@jay-framework/aiditor 0.17.3 → 0.18.0

package/dist/index.client.js

@@ -10,6 +10,9 @@ const visualModeToForm = {
   video: "5"
 };
 const CHANNEL_MAX_FILE_PARTS = 300;
+function isChatSubmitOptions(options) {
+  return options != null && "kind" in options && options.kind === "chat";
+}
 function countAttachmentFiles(m) {
   if (!m) return 0;
   let n = 0;
@@ -26,14 +29,18 @@ function validateMultipartPartBudget(options) {
   }
   return null;
 }
-function submitAndStreamTask(notes, visual, callbacks) {
+function submitAndStreamTask(notes, options, callbacks) {
   let aborted = false;
   const abort = () => {
     aborted = true;
   };
   const input = { notes };
-  if (visual?.mode === "video") {
-    const v = visual;
+  if (isChatSubmitOptions(options)) {
+    input.messageKind = "chat";
+    input.pageRoute = options.pageRoute;
+    input.renderedUrl = options.renderedUrl;
+  } else if (options?.mode === "video") {
+    const v = options;
     const attCount = countAttachmentFiles(v.attachmentsByPin);
     const includeVideo = Boolean(v.video);
     const err = validateMultipartPartBudget({
@@ -76,8 +83,8 @@ function submitAndStreamTask(notes, visual, callbacks) {
       }
     }
     input.extraFiles = extraFiles;
-  } else if (visual?.dual) {
-    const v = visual;
+  } else if (options?.dual) {
+    const v = options;
     input.visualTask = visualModeToForm[v.mode];
     input.pageRoute = v.pageRoute;
     input.renderedUrl = v.renderedUrl;
@@ -7975,7 +7982,7 @@ function freezeTransientStyles(iframeEl) {
   const seen = /* @__PURE__ */ new Set();
   for (const pseudo of TRANSIENT_PSEUDOCLASSES) {
     try {
-      for (const el of doc.querySelectorAll(pseudo)) seen.add(el);
+      for (const el of Array.from(doc.querySelectorAll(pseudo))) seen.add(el);
     } catch {
     }
   }
@@ -8553,7 +8560,17 @@ function stopMediaStreamTracks(stream) {
   }
 }
 const AIDITOR_NOTES_VERSION = 1;
+const AIDITOR_NOTES_BINDING_VERSION = 1.1;
+function serializedAnnotationHasBindings(annotation) {
+  return (annotation.pluginBindings?.length ?? 0) > 0 || !!annotation.pluginBinding;
+}
 function serializeAiditorNotes(payload) {
+  if ("annotations" in payload && payload.annotations.some((a2) => serializedAnnotationHasBindings(a2))) {
+    return JSON.stringify({
+      ...payload,
+      version: AIDITOR_NOTES_BINDING_VERSION
+    });
+  }
   return JSON.stringify(payload);
 }
 function resolvePreviewContextAtTime(timeSec, navLog, fallback) {
@@ -8680,178 +8697,183 @@ function joinHttpBaseUrlAndPath(httpBaseUrl, pathname) {
   const path = !pathname || pathname === "/" ? "/" : pathname.startsWith("/") ? pathname : `/${pathname}`;
   return new URL(path, baseUrl).href;
 }
-setActionCallerOptions({ timeout: 12e4 });
-const MAX_ATTACHMENTS_PER_PIN = 10;
-const MAX_ATTACHMENT_BYTES_PER_PIN = 5 * 1024 * 1024;
-function mbLabel(bytes) {
-  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
-}
-function newLocalAttachmentId() {
-  return typeof crypto !== "undefined" && "randomUUID" in crypto ? crypto.randomUUID() : `f_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 9)}`;
-}
-function newAnnotationId() {
-  return typeof crypto !== "undefined" && "randomUUID" in crypto ? crypto.randomUUID() : `ann_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 9)}`;
+const checkAddPageRouteAction = createActionCaller("aiditor.checkAddPageRoute", "GET");
+const startAddPageRequestAction = createActionCaller("aiditor.startAddPageRequest", "GET");
+createActionCaller("aiditor.saveAddPageDraft", "GET");
+const uploadAddPageAssetAction = createActionCaller("aiditor.uploadAddPageAsset", "POST", { acceptsFiles: true });
+const reclassifyAddPageAssetAction = createActionCaller("aiditor.reclassifyAddPageAsset", "GET");
+const checkPageAddPageBriefAction = createActionCaller("aiditor.checkPageAddPageBrief", "GET");
+const openAddPageFromBriefAction = createActionCaller("aiditor.openAddPageFromBrief", "GET");
+const submitAddPageAction = createStreamCaller("aiditor.submitAddPage");
+const generateAddPageBriefFromImageAction = createActionCaller("aiditor.generateAddPageBriefFromImage", "POST", { acceptsFiles: true });
+async function checkAddPageRoute(pageRoute) {
+  return checkAddPageRouteAction({ pageRoute });
 }
-function renumberAnnotations(list) {
-  return list.map((a2, i) => ({ ...a2, id: String(i + 1) }));
+async function startAddPageRequest(pageRoute) {
+  return startAddPageRequestAction({ pageRoute });
 }
-function serializeGeometry(a2) {
-  if (a2.kind === "point")
-    return { kind: "point", x: a2.x, y: a2.y };
-  if (a2.kind === "area")
-    return { kind: "area", x: a2.x, y: a2.y, w: a2.w, h: a2.h };
-  return { kind: "arrow", x1: a2.x1, y1: a2.y1, x2: a2.x2, y2: a2.y2 };
+async function uploadAddPageAsset(input) {
+  return uploadAddPageAssetAction(input);
 }
-function toNotesPayload(annotations, breakpoint) {
-  return {
-    version: AIDITOR_NOTES_VERSION,
-    breakpoint,
-    annotations: annotations.map((a2) => ({
-      id: a2.id,
-      mode: a2.kind,
-      instruction: a2.instruction.trim(),
-      geometry: serializeGeometry(a2)
-    }))
-  };
+async function reclassifyAddPageAsset(input) {
+  return reclassifyAddPageAssetAction(input);
 }
-function toVideoNotesPayload(annotations, videoMeta, notesContext) {
-  const baseOrigin = typeof window !== "undefined" ? window.location.origin : JAY_DEV_URL_DEFAULT;
-  const fallback = fallbackPreviewContextFromBar(notesContext.fallbackRenderedUrl, notesContext.fallbackRoute, baseOrigin);
-  const navLog = notesContext.previewNavLog.length > 0 ? notesContext.previewNavLog : void 0;
-  const payload = {
-    version: 2,
-    taskKind: "video",
-    videoMeta,
-    previewNavLog: navLog,
-    breakpoint: notesContext.breakpoint,
-    annotations: annotations.map((a2) => {
-      const ctx = resolvePreviewContextAtTime(a2.timeSec, navLog, fallback);
-      return {
-        id: a2.id,
-        mode: a2.kind,
-        instruction: a2.instruction.trim(),
-        geometry: serializeGeometry(a2),
-        timeSec: a2.timeSec,
-        previewUrlAtTime: ctx.href,
-        pagePathAtTime: ctx.locationPath
-      };
-    })
-  };
-  return JSON.stringify(payload);
+async function generateAddPageBriefFromImage(input) {
+  const extraFiles = {};
+  input.images.forEach((file, i) => {
+    extraFiles[`image_${i}`] = file;
+  });
+  return generateAddPageBriefFromImageAction({
+    target: input.target,
+    requestId: input.requestId,
+    pageRoute: input.pageRoute,
+    contextNotes: input.contextNotes,
+    extraFiles
+  });
 }
-function toSerializedVideoForPins(a2) {
-  return {
-    id: a2.id,
-    mode: a2.kind,
-    instruction: a2.instruction,
-    geometry: serializeGeometry(a2),
-    timeSec: a2.timeSec
+function submitAddPageStream(input, callbacks) {
+  let aborted = false;
+  const abort = () => {
+    aborted = true;
   };
+  void (async () => {
+    try {
+      for await (const chunk of submitAddPageAction(input)) {
+        if (aborted) break;
+        callbacks.onChunk(chunk);
+        if (chunk.type === "done" || chunk.type === "error") {
+          callbacks.onEnd();
+          return;
+        }
+      }
+      if (!aborted) callbacks.onEnd();
+    } catch (err) {
+      if (!aborted) {
+        callbacks.onError(err instanceof Error ? err : new Error(String(err)));
+      }
+    }
+  })();
+  return abort;
 }
-function kindLabel(kind) {
-  if (kind === "point")
-    return "Point";
-  if (kind === "area")
-    return "Area";
-  return "Arrow";
+async function checkPageAddPageBrief(input) {
+  return checkPageAddPageBriefAction(input);
 }
-const VIDEO_ANNOTATION_TIME_TOLERANCE_SEC = 0.15;
-function isVideoAnnotationAtPlayhead(playheadSec, annotationTimeSec) {
-  return Math.abs(playheadSec - annotationTimeSec) <= VIDEO_ANNOTATION_TIME_TOLERANCE_SEC;
+async function openAddPageFromBrief(input) {
+  return openAddPageFromBriefAction(input);
 }
-function bubbleAnchorNorm(a2) {
-  if (a2.kind === "point")
-    return { nx: a2.x, ny: a2.y };
-  if (a2.kind === "area") {
-    return { nx: Math.min(1, a2.x + a2.w), ny: Math.min(1, a2.y + a2.h) };
+async function ensureAddPageRequestId(pageRoute, currentRequestId) {
+  if (currentRequestId) {
+    return { requestId: currentRequestId };
   }
-  return { nx: a2.x2, ny: a2.y2 };
+  const trimmed = pageRoute.trim();
+  if (!trimmed) {
+    return {
+      requestId: "",
+      error: "Enter a page route before attaching files or pasting images."
+    };
+  }
+  const result = await startAddPageRequest(trimmed);
+  if (result.routeExists) {
+    return {
+      requestId: "",
+      error: result.routeExistsMessage ?? "This route already exists."
+    };
+  }
+  if (!result.requestId) {
+    return {
+      requestId: "",
+      error: result.routeExistsMessage ?? "Could not create page request. Check the route and try again."
+    };
+  }
+  return { requestId: result.requestId };
 }
-const POPOVER_FLIP_X_PCT = 56;
-const POPOVER_FLIP_Y_PCT = 52;
-function popoverFlipFromPct(leftPct, topPct) {
-  return {
-    flipX: leftPct > POPOVER_FLIP_X_PCT,
-    flipY: topPct > POPOVER_FLIP_Y_PCT
-  };
+function insertTextAtCursor(textarea, text, currentValue) {
+  const start = textarea.selectionStart ?? currentValue.length;
+  const end = textarea.selectionEnd ?? start;
+  const before = currentValue.slice(0, start);
+  const after = currentValue.slice(end);
+  const prefix = before.length > 0 && !before.endsWith("\n") ? "\n" : "";
+  const insertion = `${prefix}${text}
+`;
+  const next = before + insertion + after;
+  const newPos = before.length + insertion.length;
+  queueMicrotask(() => {
+    textarea.selectionStart = newPos;
+    textarea.selectionEnd = newPos;
+    textarea.focus();
+  });
+  return next;
 }
-const JAY_DEV_URL_DEFAULT = typeof window !== "undefined" ? window.location.origin : "http://localhost:3000";
-const paramsCache = /* @__PURE__ */ new Map();
-function dedupePastedFiles(files) {
+function inferRouteKindFromRoute(route) {
+  return /\[[^\]/]+\]/.test(route) ? "dynamic" : "static";
+}
+const BRIEF_FILL_MAX_IMAGES = 5;
+function dedupePastedFiles$1(files) {
   const seen = /* @__PURE__ */ new Set();
   const out = [];
   for (const f2 of files) {
-    const k = `${f2.name}\0${f2.size}\0${f2.lastModified}\0${f2.type}`;
-    if (seen.has(k))
-      continue;
+    const k = `${f2.name}:${f2.size}:${f2.type}`;
+    if (seen.has(k)) continue;
     seen.add(k);
     out.push(f2);
   }
   return out;
 }
-function filesFromClipboardData(cd) {
-  if (!cd)
-    return [];
+function filesFromClipboardData$1(cd) {
+  if (!cd) return [];
   const accum = [];
   for (let i = 0; i < cd.files.length; i++) {
     const f2 = cd.files.item(i);
-    if (f2)
-      accum.push(f2);
+    if (f2) accum.push(f2);
   }
   if (cd.items) {
     for (let i = 0; i < cd.items.length; i++) {
       const it = cd.items[i];
       if (it?.kind === "file") {
         const f2 = it.getAsFile();
-        if (f2)
-          accum.push(f2);
+        if (f2) accum.push(f2);
       }
     }
   }
-  return dedupePastedFiles(accum);
-}
-function clipboardItemsArray(cd) {
-  const items = cd?.items;
-  if (!items || items.length === 0)
-    return [];
-  return Array.from({ length: items.length }, (_, i) => items[i]).filter(Boolean);
+  return dedupePastedFiles$1(accum).filter((f2) => f2.type.startsWith("image/"));
 }
-function dataUrlToImageFileSync(dataUrl, index) {
+function dataUrlToImageFile(dataUrl, index) {
   const comma = dataUrl.indexOf(",");
-  if (comma < 0)
-    return null;
+  if (comma < 0) return null;
   const header = dataUrl.slice(0, comma);
   const dataPart = dataUrl.slice(comma + 1);
   const mimeMatch = header.match(/^data:([^;,]+)/i);
   const mime = mimeMatch?.[1]?.trim() ?? "";
-  if (!mime.startsWith("image/"))
-    return null;
+  if (!mime.startsWith("image/")) return null;
   const isBase64 = /;base64/i.test(header);
   let bytes;
   if (isBase64) {
     try {
       const bin = atob(dataPart.replace(/\s/g, ""));
       bytes = new Uint8Array(bin.length);
-      for (let i = 0; i < bin.length; i++)
-        bytes[i] = bin.charCodeAt(i);
+      for (let i = 0; i < bin.length; i++) bytes[i] = bin.charCodeAt(i);
     } catch {
       return null;
     }
   } else {
     try {
-      bytes = new TextEncoder().encode(decodeURIComponent(dataPart.replace(/\+/g, "%20")));
+      bytes = new TextEncoder().encode(
+        decodeURIComponent(dataPart.replace(/\+/g, "%20"))
+      );
     } catch {
       return null;
     }
   }
   const extPart = mime.split("/")[1] || "png";
   const ext = extPart.replace(/\+xml$/, "").split("+")[0] || "png";
-  const buf = bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength);
+  const buf = bytes.buffer.slice(
+    bytes.byteOffset,
+    bytes.byteOffset + bytes.byteLength
+  );
   return new File([buf], `paste-${index}.${ext}`, { type: mime });
 }
-function filesFromPastedHtmlDataUrls(html) {
-  if (!html)
-    return [];
+function filesFromPastedHtmlDataUrls$1(html) {
+  if (!html) return [];
   let doc;
   try {
     doc = new DOMParser().parseFromString(html, "text/html");
@@ -8861,69 +8883,2108 @@ function filesFromPastedHtmlDataUrls(html) {
   const out = [];
   for (const img of Array.from(doc.querySelectorAll("img[src]"))) {
     const src = img.getAttribute("src");
-    if (!src?.startsWith("data:image"))
-      continue;
-    const f2 = dataUrlToImageFileSync(src, out.length);
-    if (f2)
-      out.push(f2);
+    if (!src?.startsWith("data:image")) continue;
+    const f2 = dataUrlToImageFile(src, out.length);
+    if (f2) out.push(f2);
   }
-  return dedupePastedFiles(out);
+  return dedupePastedFiles$1(out);
 }
-function filesFromPlainDataImageUrl(text) {
+function filesFromPlainDataImageUrl$1(text) {
   const t = text.trim();
-  if (!t.startsWith("data:image/"))
-    return [];
-  const f2 = dataUrlToImageFileSync(t, 0);
+  if (!t.startsWith("data:image/")) return [];
+  const f2 = dataUrlToImageFile(t, 0);
   return f2 ? [f2] : [];
 }
-async function imageFilesFromNavigatorClipboard() {
-  if (!navigator.clipboard?.read)
-    return [];
-  let clipItems;
-  try {
-    clipItems = await navigator.clipboard.read();
-  } catch {
-    return [];
-  }
-  const out = [];
-  let idx = 0;
-  for (const ci of clipItems) {
-    for (const type of ci.types) {
-      if (!type.startsWith("image/"))
-        continue;
-      try {
-        const blob = await ci.getType(type);
-        if (!(blob instanceof Blob) || blob.size === 0)
-          continue;
-        const ext = type.split("/")[1]?.split("+")[0] || "png";
-        out.push(new File([blob], `paste-${idx++}.${ext}`, { type }));
-      } catch {
+function imageFilesFromPasteEvent(event) {
+  const cd = event.clipboardData;
+  const direct = filesFromClipboardData$1(cd);
+  if (direct.length > 0) return direct;
+  const html = cd?.getData("text/html") ?? "";
+  const plain = (cd?.getData("text/plain") ?? "").trim();
+  const fromRich = dedupePastedFiles$1([
+    ...filesFromPastedHtmlDataUrls$1(html),
+    ...filesFromPlainDataImageUrl$1(plain)
+  ]);
+  if (fromRich.length > 0) return fromRich;
+  if (cd?.items) {
+    for (const item of Array.from(cd.items)) {
+      if (item.type.startsWith("image/")) {
+        const file = item.getAsFile();
+        if (file) return [file];
+      }
+    }
+  }
+  return [];
+}
+function initAddPageBriefFillPanel(deps) {
+  const [showPopover, setShowPopover] = createSignal(false);
+  const [target, setTarget] = createSignal("content");
+  const [contextNotes, setContextNotes] = createSignal("");
+  const [images, setImages] = createSignal([]);
+  const [thumbUrls, setThumbUrls] = createSignal([]);
+  const [generating, setGenerating] = createSignal(false);
+  const [popoverError, setPopoverError] = createSignal("");
+  const [pendingReferenceFiles, setPendingReferenceFiles] = createSignal([]);
+  const [suggestedRoute, setSuggestedRoute] = createSignal(null);
+  const [suggestedRouteKind, setSuggestedRouteKind] = createSignal(null);
+  const showSuggestedRouteBanner = createMemo(
+    () => suggestedRoute() !== null && suggestedRoute().length > 0
+  );
+  const suggestedRouteLabel = createMemo(() => {
+    const r = suggestedRoute();
+    const k = suggestedRouteKind();
+    if (!r) return "";
+    return k ? `${r} (${k})` : r;
+  });
+  const briefFillDisabled = createMemo(() => deps.isBusy() || generating());
+  const showBriefFillPopover = createMemo(() => showPopover());
+  const canGenerate = createMemo(
+    () => images().length > 0 && !generating() && !deps.isBusy()
+  );
+  const briefFillInputDisabled = createMemo(() => generating());
+  const briefFillDropzoneClass = createMemo(
+    () => briefFillInputDisabled() ? "add-page-brief-fill-dropzone add-page-brief-fill-dropzone-disabled" : "add-page-brief-fill-dropzone"
+  );
+  const generateDisabled = createMemo(() => !canGenerate());
+  const briefFillStatusHint = createMemo(() => {
+    if (generating()) {
+      return target() === "content" ? "Generating content brief…" : "Generating design brief…";
+    }
+    return "";
+  });
+  const showBriefFillStatusHint = createMemo(
+    () => briefFillStatusHint().length > 0
+  );
+  const imageThumbRows = createMemo(
+    () => images().map((f2, i) => ({
+      rowKey: `${f2.name}-${f2.size}-${i}`,
+      name: f2.name,
+      thumbUrl: thumbUrls()[i] ?? "",
+      index: i,
+      removeDisabled: generating()
+    }))
+  );
+  const showBriefFillThumbnails = createMemo(() => imageThumbRows().length > 0);
+  function revokeThumbUrls() {
+    for (const url of thumbUrls()) {
+      if (url) URL.revokeObjectURL(url);
+    }
+  }
+  function resetPopoverState() {
+    revokeThumbUrls();
+    setImages([]);
+    setThumbUrls([]);
+    setContextNotes("");
+    setPopoverError("");
+  }
+  function closePopover() {
+    setShowPopover(false);
+    resetPopoverState();
+  }
+  function openPopover(t) {
+    resetPopoverState();
+    setTarget(t);
+    setShowPopover(true);
+  }
+  function addImageFiles(files) {
+    if (generating()) return;
+    const imageOnly = files.filter((f2) => f2.type.startsWith("image/"));
+    if (imageOnly.length === 0) return;
+    setPopoverError("");
+    setImages((prev) => {
+      const merged = [...prev];
+      for (const f2 of imageOnly) {
+        if (merged.length >= BRIEF_FILL_MAX_IMAGES) break;
+        merged.push(f2);
+      }
+      if (prev.length + imageOnly.length > BRIEF_FILL_MAX_IMAGES) {
+        setPopoverError(`Maximum ${BRIEF_FILL_MAX_IMAGES} images.`);
+      }
+      return merged;
+    });
+    setThumbUrls((prev) => {
+      const next = [...prev];
+      for (const f2 of imageOnly) {
+        if (next.length >= BRIEF_FILL_MAX_IMAGES) break;
+        next.push(URL.createObjectURL(f2));
       }
+      return next;
+    });
+  }
+  function removeImageAt(index) {
+    if (generating()) return;
+    setImages((prev) => prev.filter((_, i) => i !== index));
+    setThumbUrls((prev) => {
+      const url = prev[index];
+      if (url) URL.revokeObjectURL(url);
+      return prev.filter((_, i) => i !== index);
+    });
+  }
+  function applyMarkdownToTarget(md, t) {
+    const current = t === "content" ? deps.getContentMd() : deps.getDesignMd();
+    const setter = t === "content" ? deps.setContentMd : deps.setDesignMd;
+    if (!current.trim()) {
+      setter(md);
+      return;
+    }
+    const replace = window.confirm(
+      t === "content" ? "Replace existing Content brief? Click Cancel to append below." : "Replace existing Design brief? Click Cancel to append below."
+    );
+    if (replace) {
+      setter(md);
+    } else {
+      setter((prev) => `${prev.trim()}
+
+---
+
+${md}`);
+    }
+  }
+  async function flushPendingReferenceFiles(requestId) {
+    const pending = pendingReferenceFiles();
+    if (pending.length === 0) return;
+    setPendingReferenceFiles([]);
+    const chips = [];
+    for (const file of pending) {
+      const result = await uploadAddPageAsset({
+        requestId,
+        role: "reference",
+        file
+      });
+      chips.push({
+        rowKey: result.id,
+        id: result.id,
+        filename: file.name,
+        path: result.path,
+        role: "reference",
+        roleLabel: "Reference"
+      });
     }
+    if (chips.length > 0) deps.appendAttachments(chips);
   }
-  return dedupePastedFiles(out);
-}
-let aiditorBoundDocumentPaste = null;
-function bindAiditorDocumentPasteCapture(handler) {
-  if (typeof document === "undefined")
-    return;
-  if (aiditorBoundDocumentPaste) {
-    document.removeEventListener("paste", aiditorBoundDocumentPaste, true);
+  async function runGenerate() {
+    if (!canGenerate()) return;
+    setPopoverError("");
+    setGenerating(true);
+    deps.setComposerError("");
+    const files = images();
+    const t = target();
+    let requestId = deps.getRequestId() ?? void 0;
+    if (!requestId && deps.getRoute().trim()) {
+      const minted = await deps.mintRequestIdIfNeeded();
+      if (minted) requestId = minted;
+    }
+    try {
+      const result = await generateAddPageBriefFromImage({
+        target: t,
+        requestId,
+        pageRoute: deps.getRoute().trim() || void 0,
+        contextNotes: contextNotes().trim() || void 0,
+        images: files
+      });
+      if (!result.ok || !result.markdown) {
+        setPopoverError(result.error ?? "Brief generation failed.");
+        return;
+      }
+      applyMarkdownToTarget(result.markdown, t);
+      if (t === "content" && result.suggestedRoute) {
+        setSuggestedRoute(result.suggestedRoute);
+        setSuggestedRouteKind(result.suggestedRouteKind ?? null);
+      }
+      if (result.referenceAttachments?.length) {
+        deps.appendAttachments(
+          result.referenceAttachments.map((a2) => ({
+            rowKey: a2.id,
+            id: a2.id,
+            filename: a2.filename,
+            path: a2.path,
+            role: "reference",
+            roleLabel: "Reference"
+          }))
+        );
+      } else if (!requestId) {
+        setPendingReferenceFiles((prev) => [...prev, ...files]);
+      }
+      closePopover();
+    } catch (err) {
+      setPopoverError(err instanceof Error ? err.message : String(err));
+    } finally {
+      setGenerating(false);
+    }
+  }
+  function applySuggestedRoute() {
+    const route = suggestedRoute();
+    if (!route) return;
+    deps.setRoute(route);
+    deps.setRequestId(null);
+    deps.scheduleRouteCheck(route);
+    setSuggestedRoute(null);
+    setSuggestedRouteKind(null);
+  }
+  function dismissSuggestedRoute() {
+    setSuggestedRoute(null);
+    setSuggestedRouteKind(null);
+  }
+  function onRequestIdMinted(requestId) {
+    void flushPendingReferenceFiles(requestId);
+  }
+  function resetBriefFill() {
+    closePopover();
+    setSuggestedRoute(null);
+    setSuggestedRouteKind(null);
+    setPendingReferenceFiles([]);
+  }
+  function bindBriefFillRefs(refs) {
+    refs.addPageFillContentFromImageBtn.onclick(() => openPopover("content"));
+    refs.addPageFillDesignFromImageBtn.onclick(() => openPopover("design"));
+    refs.addPageBriefFillCancelBtn.onclick(() => closePopover());
+    refs.addPageBriefFillCloseBtn.onclick(() => closePopover());
+    refs.addPageBriefFillGenerateBtn.onclick(() => {
+      void runGenerate();
+    });
+    refs.addPageBriefFillContextNotes.oninput(
+      ({ event }) => {
+        if (generating()) return;
+        setContextNotes(event.target.value);
+      }
+    );
+    refs.addPageBriefFillFileInput.onchange(
+      ({ event }) => {
+        if (generating()) return;
+        const input = event.target;
+        const files = input.files ? Array.from(input.files) : [];
+        addImageFiles(files);
+        input.value = "";
+      }
+    );
+    refs.addPageBriefFillDropzone.onclick(() => {
+      if (generating()) return;
+      refs.addPageBriefFillFileInput.exec$?.((el) => {
+        el.click();
+      });
+    });
+    refs.addPageBriefFillDropzone.ondragover(
+      ({ event }) => {
+        event.preventDefault();
+      }
+    );
+    refs.addPageBriefFillDropzone.ondrop(
+      ({ event }) => {
+        event.preventDefault();
+        if (generating()) return;
+        const dt = event.dataTransfer;
+        if (!dt?.files?.length) return;
+        addImageFiles(Array.from(dt.files));
+      }
+    );
+    refs.addPageBriefFillDropzone.addEventListener(
+      "paste",
+      (ev) => {
+        if (generating()) return;
+        const pasted = imageFilesFromPasteEvent(ev.event);
+        if (pasted.length === 0) return;
+        ev.event.preventDefault();
+        addImageFiles(pasted);
+      }
+    );
+    refs.addPageBriefFillThumbnails.onclick(
+      ({ event }) => {
+        if (generating()) return;
+        const btn = event.target.closest(
+          "[data-brief-fill-remove]"
+        );
+        if (!btn) return;
+        const idx = Number.parseInt(btn.dataset.briefFillRemove ?? "", 10);
+        if (Number.isNaN(idx)) return;
+        removeImageAt(idx);
+      }
+    );
+    refs.addPageSuggestedRouteApplyBtn.onclick(() => applySuggestedRoute());
+    refs.addPageSuggestedRouteDismissBtn.onclick(() => dismissSuggestedRoute());
   }
-  aiditorBoundDocumentPaste = handler;
-  document.addEventListener("paste", handler, true);
+  return {
+    showBriefFillPopover,
+    briefFillContextNotes: contextNotes,
+    briefFillPopoverError: popoverError,
+    showBriefFillPopoverError: createMemo(() => popoverError().length > 0),
+    briefFillDisabled,
+    briefFillInputDisabled,
+    briefFillDropzoneClass,
+    generateDisabled,
+    briefFillStatusHint,
+    showBriefFillStatusHint,
+    imageThumbRows,
+    showBriefFillThumbnails,
+    showSuggestedRouteBanner,
+    suggestedRouteLabel,
+    bindBriefFillRefs,
+    resetBriefFill,
+    onRequestIdMinted,
+    briefFillGenerating: generating
+  };
 }
-function aiditorConstructor(_props, refs) {
-  const [projectDir, setProjectDir] = createSignal("");
-  const [jayDevUrl, setJayDevUrl] = createSignal(JAY_DEV_URL_DEFAULT);
-  const [isBootstrapping, setIsBootstrapping] = createSignal(true);
-  const [showBootstrapError, setShowBootstrapError] = createSignal(false);
-  const [bootstrapErrorText, setBootstrapErrorText] = createSignal("");
-  const [activeTaskId, setActiveTaskId] = createSignal(null);
-  const [chunks, setChunks] = createSignal([]);
-  const [bottomPanelCollapsed, setBottomPanelCollapsed] = createSignal(true);
-  const [isRunning, setIsRunning] = createSignal(false);
-  const [showFilePreview, setShowFilePreview] = createSignal(false);
+const CATALOG = [
+  {
+    pluginName: "wix-server-client",
+    packageName: "@jay-framework/wix-server-client",
+    description: "Wix API client and authentication",
+    kind: "service-only",
+    requires: [],
+    showInAddPagePicker: false,
+    configFiles: ["config/.wix.yaml"]
+  },
+  {
+    pluginName: "wix-cart",
+    packageName: "@jay-framework/wix-cart",
+    description: "Shopping cart headless components",
+    kind: "headless",
+    requires: ["wix-server-client"],
+    showInAddPagePicker: true
+  },
+  {
+    pluginName: "wix-stores",
+    packageName: "@jay-framework/wix-stores",
+    description: "Wix Stores product search, product page, categories",
+    kind: "headless",
+    requires: ["wix-server-client", "wix-cart"],
+    showInAddPagePicker: true,
+    configFiles: ["config/.wix-stores.yaml"]
+  },
+  {
+    pluginName: "wix-stores-v1",
+    packageName: "@jay-framework/wix-stores-v1",
+    description: "Wix Stores v1 catalog API",
+    kind: "headless",
+    requires: ["wix-server-client", "wix-cart"],
+    showInAddPagePicker: true
+  },
+  {
+    pluginName: "wix-data",
+    packageName: "@jay-framework/wix-data",
+    description: "Wix Data collections CMS",
+    kind: "headless",
+    requires: ["wix-server-client"],
+    showInAddPagePicker: true,
+    configFiles: ["config/.wix-data.yaml"]
+  },
+  {
+    pluginName: "wix-media",
+    packageName: "@jay-framework/wix-media",
+    description: "Wix media service (no page components)",
+    kind: "service-only",
+    requires: ["wix-server-client"],
+    showInAddPagePicker: true
+  },
+  {
+    pluginName: "ui-kit",
+    packageName: "@jay-framework/ui-kit",
+    description: "Jay UI kit headless components",
+    kind: "headless",
+    requires: [],
+    showInAddPagePicker: true
+  },
+  {
+    pluginName: "gemini-agent",
+    packageName: "@jay-framework/gemini-agent",
+    description: "Gemini AI agent plugin",
+    kind: "headless",
+    requires: [],
+    showInAddPagePicker: true,
+    configFiles: ["config/.gemini-agent.yaml"]
+  },
+  {
+    pluginName: "webmcp",
+    packageName: "@jay-framework/webmcp",
+    description: "Web MCP tooling",
+    kind: "tooling",
+    requires: [],
+    showInAddPagePicker: false
+  },
+  {
+    pluginName: "aiditor",
+    packageName: "@jay-framework/aiditor",
+    description: "AIditor self plugin",
+    kind: "tooling",
+    requires: [],
+    showInAddPagePicker: false
+  }
+];
+function getCatalogEntry(pluginName) {
+  return CATALOG.find((e2) => e2.pluginName === pluginName);
+}
+const DEFAULT_COMPONENT_KEYS = {
+  "product-page": "p",
+  "product-search": "search",
+  "cart-indicator": "cart",
+  "cart-page": "cartPage",
+  "category-list": "categories"
+};
+function getDefaultComponentKey(contractName) {
+  if (contractName in DEFAULT_COMPONENT_KEYS) {
+    return DEFAULT_COMPONENT_KEYS[contractName];
+  }
+  return contractName.charAt(0) || "c";
+}
+const listJayPluginsAction = createActionCaller("aiditor.listJayPlugins", "GET");
+createActionCaller("aiditor.listPluginContracts", "GET");
+const checkPluginUpdateAction = createActionCaller("aiditor.checkPluginUpdate", "GET");
+const ensureProjectPluginAction = createStreamCaller("aiditor.ensureProjectPlugin");
+createActionCaller("aiditor.getPluginSetupStatus", "GET");
+const rerunPluginSetupAction = createActionCaller("aiditor.rerunPluginSetup", "GET");
+const syncAddPagePluginManifestAction = createActionCaller("aiditor.syncAddPagePluginManifest", "GET");
+const writePluginSourceAction = createActionCaller("aiditor.writePluginSource", "GET");
+async function listJayPlugins(refreshSetupStatus = false) {
+  return listJayPluginsAction({ refreshSetupStatus });
+}
+async function checkPluginUpdate(pluginName) {
+  return checkPluginUpdateAction({ pluginName });
+}
+function ensureProjectPluginStream(input, callbacks) {
+  let aborted = false;
+  const abort = () => {
+    aborted = true;
+  };
+  void (async () => {
+    try {
+      for await (const chunk of ensureProjectPluginAction(input)) {
+        if (aborted) break;
+        callbacks.onChunk(chunk);
+        if (chunk.type === "done" || chunk.type === "error") {
+          callbacks.onEnd();
+          return;
+        }
+      }
+      if (!aborted) callbacks.onEnd();
+    } catch (err) {
+      if (!aborted) {
+        callbacks.onError(err instanceof Error ? err : new Error(String(err)));
+      }
+    }
+  })();
+  return abort;
+}
+async function syncAddPagePluginManifest(input) {
+  return syncAddPagePluginManifestAction(input);
+}
+async function rerunPluginSetup(pluginName, force) {
+  return rerunPluginSetupAction({ pluginName, force });
+}
+async function writePluginSource(input) {
+  return writePluginSourceAction(input);
+}
+const ADD_PAGE_MANAGE_PLUGINS_VALUE = "__manage_plugins__";
+function upsertPagePluginContract(prev, pluginName, packageName, contractName, componentKey) {
+  const next = [...prev];
+  let plugin = next.find((p) => p.pluginName === pluginName);
+  if (!plugin) {
+    plugin = {
+      pluginName,
+      packageName,
+      contracts: [],
+      installStatus: "not_needed"
+    };
+    next.push(plugin);
+  }
+  const exists = plugin.contracts.some((c) => c.contractName === contractName);
+  const contracts = exists ? plugin.contracts.map(
+    (c) => c.contractName === contractName ? { ...c, componentKey } : c
+  ) : [...plugin.contracts, { contractName, componentKey }];
+  return next.map(
+    (p) => p.pluginName === pluginName ? { ...p, packageName, contracts } : p
+  );
+}
+function removePagePluginContract(prev, pluginName, contractName) {
+  return prev.map(
+    (p) => p.pluginName === pluginName ? {
+      ...p,
+      contracts: p.contracts.filter(
+        (c) => c.contractName !== contractName
+      )
+    } : p
+  ).filter((p) => p.contracts.length > 0);
+}
+function initAddPagePluginsPanel(deps) {
+  const { projectPlugins, openProjectSettings } = deps;
+  const [selectedPlugins, setSelectedPlugins] = createSignal([]);
+  const [pickerPlugin, setPickerPlugin] = createSignal("");
+  const [pickerValue, setPickerValue] = createSignal("");
+  let syncTimer;
+  const installedHeadlessPlugins = createMemo(
+    () => projectPlugins.pluginsList().filter(
+      (p) => p.installed && p.kind === "headless" && p.contracts.length > 0
+    )
+  );
+  const addPagePluginPickerOptions = createMemo(
+    () => {
+      const options = installedHeadlessPlugins().map((p) => ({
+        rowKey: p.pluginName,
+        value: p.pluginName,
+        label: p.pluginName
+      }));
+      options.push({
+        rowKey: ADD_PAGE_MANAGE_PLUGINS_VALUE,
+        value: ADD_PAGE_MANAGE_PLUGINS_VALUE,
+        label: "Manage plugins…"
+      });
+      return options;
+    }
+  );
+  const addPageContractPickerRows = createMemo(
+    () => {
+      const pluginName = pickerPlugin();
+      if (!pluginName) return [];
+      const entry = projectPlugins.pluginsList().find((p) => p.pluginName === pluginName);
+      if (!entry?.installed || entry.kind !== "headless") return [];
+      const sel = selectedPlugins().find((s) => s.pluginName === pluginName);
+      return entry.contracts.map((c) => ({
+        rowKey: `${pluginName}:${c.contractName}`,
+        pluginName,
+        packageName: entry.packageName,
+        contractName: c.contractName,
+        description: c.description ?? "",
+        onPage: !!sel?.contracts.some((x) => x.contractName === c.contractName),
+        componentKey: sel?.contracts.find((x) => x.contractName === c.contractName)?.componentKey ?? getDefaultComponentKey(c.contractName)
+      }));
+    }
+  );
+  const pagePluginChipRows = createMemo(() => {
+    const chips = [];
+    for (const plugin of selectedPlugins()) {
+      for (const contract of plugin.contracts) {
+        chips.push({
+          rowKey: `${plugin.pluginName}:${contract.contractName}`,
+          label: `${plugin.pluginName} · ${contract.contractName}`,
+          pluginName: plugin.pluginName,
+          packageName: plugin.packageName,
+          contractName: contract.contractName,
+          componentKey: contract.componentKey ?? getDefaultComponentKey(contract.contractName)
+        });
+      }
+    }
+    return chips;
+  });
+  const showContractPicker = createMemo(() => pickerPlugin().length > 0);
+  const showPagePluginsZone = createMemo(() => true);
+  const showPluginsPanel = createMemo(
+    () => projectPlugins.pluginsLoaded() && projectPlugins.pluginsList().length > 0
+  );
+  const showPagePluginsEmptyHint = createMemo(
+    () => showPluginsPanel() && pagePluginChipRows().length === 0
+  );
+  const pluginsBlockCreatePage = createMemo(() => {
+    if (projectPlugins.installInProgress()) return true;
+    return selectedPlugins().some(
+      (p) => p.installStatus === "installing" || p.installStatus === "pending" || p.installStatus === "failed"
+    );
+  });
+  function scheduleManifestSync() {
+    const requestId = deps.getRequestId();
+    if (!requestId) return;
+    if (syncTimer) clearTimeout(syncTimer);
+    syncTimer = setTimeout(() => {
+      void syncAddPagePluginManifest({
+        requestId,
+        selectedPlugins: selectedPlugins()
+      }).then((res) => {
+        if (res.ok && res.contentMd) {
+          deps.setContentMd(res.contentMd);
+        }
+      });
+    }, 300);
+  }
+  function addContractToPage(pluginName, packageName, contractName, componentKey) {
+    setSelectedPlugins(
+      (prev) => upsertPagePluginContract(
+        prev,
+        pluginName,
+        packageName,
+        contractName,
+        componentKey
+      )
+    );
+    scheduleManifestSync();
+  }
+  function removeFromPage(pluginName, packageName, contractName) {
+    setSelectedPlugins(
+      (prev) => removePagePluginContract(prev, pluginName, contractName)
+    );
+    scheduleManifestSync();
+  }
+  function handlePickerChange(value) {
+    setPickerValue("");
+    if (value === ADD_PAGE_MANAGE_PLUGINS_VALUE) {
+      openProjectSettings();
+      setPickerPlugin("");
+      return;
+    }
+    if (!value) {
+      setPickerPlugin("");
+      return;
+    }
+    setPickerPlugin(value);
+  }
+  function resetPluginsPanel() {
+    setSelectedPlugins([]);
+    setPickerPlugin("");
+    setPickerValue("");
+    if (syncTimer) clearTimeout(syncTimer);
+  }
+  function bindPluginsPanelRefs(refs) {
+    refs.addPagePluginPicker?.onchange(
+      ({ event }) => {
+        const value = event.target.value;
+        handlePickerChange(value);
+      }
+    );
+    refs.addPagePluginsPanel.onclick(
+      ({ event }) => {
+        const target = event.target;
+        const manageLink = target.closest("[data-add-page-manage-plugins]");
+        if (manageLink) {
+          openProjectSettings();
+          return;
+        }
+        const addBtn = target.closest(
+          "[data-add-page-add-contract]"
+        );
+        if (addBtn?.dataset.plugin && addBtn.dataset.contract && addBtn.dataset.package) {
+          addContractToPage(
+            addBtn.dataset.plugin,
+            addBtn.dataset.package,
+            addBtn.dataset.contract,
+            addBtn.dataset.key ?? getDefaultComponentKey(addBtn.dataset.contract)
+          );
+          return;
+        }
+        const removeChip = target.closest(
+          "[data-add-page-remove-chip]"
+        );
+        if (removeChip?.dataset.plugin && removeChip.dataset.contract && removeChip.dataset.package) {
+          removeFromPage(
+            removeChip.dataset.plugin,
+            removeChip.dataset.package,
+            removeChip.dataset.contract
+          );
+        }
+      }
+    );
+  }
+  return {
+    selectedPlugins,
+    setSelectedPlugins,
+    scheduleManifestSync,
+    syncManifestNow: async () => {
+      const requestId = deps.getRequestId();
+      if (!requestId) return;
+      const res = await syncAddPagePluginManifest({
+        requestId,
+        selectedPlugins: selectedPlugins()
+      });
+      if (res.ok && res.contentMd) deps.setContentMd(res.contentMd);
+    },
+    bindPluginsPanelRefs,
+    addPagePluginPickerOptions,
+    addPagePluginPickerValue: pickerValue,
+    addPagePickerPluginLabel: createMemo(() => {
+      const name = pickerPlugin();
+      return name ? `Components from ${name}` : "";
+    }),
+    addPageContractPickerRows,
+    pagePluginChipRows,
+    showContractPicker,
+    showPagePluginsZone,
+    showPluginsPanel,
+    showPagePluginsEmptyHint,
+    pluginsBlockCreatePage,
+    pickerPlugin,
+    setPickerPlugin,
+    handlePickerChange,
+    resetPluginsPanel
+  };
+}
+function tryJayRefExec(refObj, fn) {
+  if (typeof refObj?.exec$ !== "function") return false;
+  try {
+    refObj.exec$(fn);
+    return true;
+  } catch {
+    return false;
+  }
+}
+function initAddPageComposer(deps) {
+  const [showAddPageComposer, setShowAddPageComposer] = createSignal(false);
+  const [addPageRoute, setAddPageRoute] = createSignal("");
+  const [addPageContentMd, setAddPageContentMd] = createSignal("");
+  const [addPageDesignMd, setAddPageDesignMd] = createSignal("");
+  const [addPageRequestId, setAddPageRequestId] = createSignal(
+    null
+  );
+  const [addPageRequestRoute, setAddPageRequestRoute] = createSignal(null);
+  const [addPageRouteError, setAddPageRouteError] = createSignal("");
+  const [addPageComposerError, setAddPageComposerError] = createSignal("");
+  const [addPageUploadHint, setAddPageUploadHint] = createSignal("");
+  const [addPageAttachments, setAddPageAttachments] = createSignal([]);
+  const [addPageShowDesignHint, setAddPageShowDesignHint] = createSignal(false);
+  const [addPageIsDynamicRoute, setAddPageIsDynamicRoute] = createSignal(false);
+  const [addPageSubmitting, setAddPageSubmitting] = createSignal(false);
+  const pluginsPanel = initAddPagePluginsPanel({
+    projectPlugins: deps.projectPlugins,
+    getRequestId: () => addPageRequestId(),
+    getContentMd: () => addPageContentMd(),
+    setContentMd: setAddPageContentMd,
+    openProjectSettings: deps.openProjectSettings
+  });
+  const briefFillPanel = initAddPageBriefFillPanel({
+    isBusy: () => deps.isRunning() || addPageSubmitting(),
+    getRoute: () => addPageRoute(),
+    setRoute: setAddPageRoute,
+    getRequestId: () => addPageRequestId(),
+    setRequestId: setAddPageRequestId,
+    getContentMd: () => addPageContentMd(),
+    setContentMd: setAddPageContentMd,
+    getDesignMd: () => addPageDesignMd(),
+    setDesignMd: setAddPageDesignMd,
+    appendAttachments: (chips) => {
+      setAddPageAttachments((prev) => [...prev, ...chips]);
+      updateDesignHint();
+    },
+    mintRequestIdIfNeeded,
+    scheduleRouteCheck,
+    setComposerError: setAddPageComposerError
+  });
+  let routeCheckTimer;
+  let contentTextareaEl = null;
+  let designTextareaEl = null;
+  const showAddPageRouteError = createMemo(
+    () => addPageRouteError().length > 0
+  );
+  const showAddPageComposerError = createMemo(
+    () => addPageComposerError().length > 0
+  );
+  const showAddPageUploadHint = createMemo(
+    () => addPageUploadHint().length > 0
+  );
+  const showAddPageAttachments = createMemo(
+    () => addPageAttachments().length > 0
+  );
+  const addPageRunningHint = createMemo(
+    () => deps.isRunning() ? "Agent is running…" : ""
+  );
+  const showAddPageRunningHint = createMemo(
+    () => addPageRunningHint().length > 0
+  );
+  const addPageAttachmentDisplayRows = createMemo(
+    () => addPageAttachments().map((a2) => ({
+      ...a2,
+      rowKey: a2.id
+    }))
+  );
+  const addPageCanSubmit = createMemo(() => {
+    if (deps.isRunning() || addPageSubmitting() || briefFillPanel.briefFillGenerating()) {
+      return false;
+    }
+    if (pluginsPanel.pluginsBlockCreatePage()) return false;
+    const route = addPageRoute().trim();
+    if (!route || addPageRouteError()) return false;
+    const hasMd = addPageContentMd().trim().length > 0 || addPageDesignMd().trim().length > 0;
+    return hasMd;
+  });
+  const addPageCreateDisabled = createMemo(
+    () => !addPageCanSubmit() || deps.isRunning() || briefFillPanel.briefFillGenerating()
+  );
+  function resetAddPageComposer() {
+    setAddPageRoute("");
+    setAddPageContentMd("");
+    setAddPageDesignMd("");
+    setAddPageRequestId(null);
+    setAddPageRequestRoute(null);
+    setAddPageRouteError("");
+    setAddPageComposerError("");
+    setAddPageUploadHint("");
+    setAddPageAttachments([]);
+    setAddPageShowDesignHint(false);
+    setAddPageIsDynamicRoute(false);
+    pluginsPanel.resetPluginsPanel();
+    briefFillPanel.resetBriefFill();
+  }
+  function openAddPageComposer() {
+    resetAddPageComposer();
+    setShowAddPageComposer(true);
+    void deps.projectPlugins.refreshPluginsList();
+  }
+  async function refreshCurrentPageBriefAvailability() {
+    const filePath = deps.selectedPageFilePath().trim();
+    if (!filePath) {
+      deps.setCurrentPageHasBrief(false);
+      return;
+    }
+    try {
+      const result = await checkPageAddPageBrief({
+        jayHtmlPath: filePath,
+        pageRoute: deps.selectedPageUrl() ?? void 0
+      });
+      deps.setCurrentPageHasBrief(result.hasBrief);
+    } catch {
+      deps.setCurrentPageHasBrief(false);
+    }
+  }
+  async function openAddPageComposerFromBrief() {
+    const filePath = deps.selectedPageFilePath().trim();
+    const sourceRoute = deps.selectedPageUrl();
+    if (!filePath || !sourceRoute) {
+      setAddPageComposerError(
+        "Select a project page with saved Add Page briefs."
+      );
+      setShowAddPageComposer(true);
+      return;
+    }
+    resetAddPageComposer();
+    setShowAddPageComposer(true);
+    setAddPageComposerError("");
+    void deps.projectPlugins.refreshPluginsList();
+    try {
+      const result = await openAddPageFromBrief({
+        jayHtmlPath: filePath,
+        sourcePageRoute: sourceRoute
+      });
+      if (!result.ok || !result.requestId || !result.pageRoute) {
+        setAddPageComposerError(result.error ?? "Could not load page brief.");
+        return;
+      }
+      setAddPageRoute(result.pageRoute);
+      setAddPageContentMd(result.contentMd ?? "");
+      setAddPageDesignMd(result.designMd ?? "");
+      setAddPageRequestId(result.requestId);
+      setAddPageRequestRoute(result.pageRoute);
+      setAddPageIsDynamicRoute(result.routeKind === "dynamic");
+      setAddPageRouteError("");
+      setAddPageAttachments(
+        (result.attachments ?? []).map((a2) => ({
+          rowKey: a2.id,
+          id: a2.id,
+          filename: a2.filename,
+          path: a2.path,
+          role: a2.role,
+          roleLabel: a2.role === "reference" ? "Reference" : "Asset"
+        }))
+      );
+      updateDesignHint();
+    } catch (err) {
+      setAddPageComposerError(err instanceof Error ? err.message : String(err));
+    }
+  }
+  function closeAddPageComposer(force = false) {
+    const hasText = addPageRoute().trim() || addPageContentMd().trim() || addPageDesignMd().trim() || addPageAttachments().length > 0;
+    if (!force && hasText && !window.confirm("Discard Add Page draft?")) {
+      return;
+    }
+    setShowAddPageComposer(false);
+    resetAddPageComposer();
+  }
+  function scheduleRouteCheck(route) {
+    if (routeCheckTimer) clearTimeout(routeCheckTimer);
+    setAddPageIsDynamicRoute(inferRouteKindFromRoute(route) === "dynamic");
+    if (!route.trim()) {
+      setAddPageRouteError("");
+      return;
+    }
+    routeCheckTimer = setTimeout(() => {
+      void checkAddPageRoute(route).then((res) => {
+        if (!res.valid) {
+          setAddPageRouteError(res.error ?? "Invalid route.");
+          setAddPageRequestId(null);
+          setAddPageRequestRoute(null);
+          return;
+        }
+        if (res.routeExists) {
+          setAddPageRouteError("This route already exists.");
+          setAddPageRequestId(null);
+          setAddPageRequestRoute(null);
+          return;
+        }
+        setAddPageRouteError("");
+        setAddPageIsDynamicRoute(res.routeKind === "dynamic");
+        if (addPageRequestId() && addPageRequestRoute() && addPageRequestRoute() !== res.normalizedRoute) {
+          setAddPageRequestId(null);
+        }
+        if (!addPageRequestId()) {
+          void ensureAddPageRequestId(res.normalizedRoute, null).then(
+            (ensured) => {
+              if (ensured.requestId) {
+                setAddPageRequestId(ensured.requestId);
+                setAddPageRequestRoute(res.normalizedRoute);
+                briefFillPanel.onRequestIdMinted(ensured.requestId);
+              }
+            }
+          );
+        }
+      }).catch((err) => {
+        setAddPageRouteError(
+          err instanceof Error ? err.message : String(err)
+        );
+        setAddPageRequestId(null);
+        setAddPageRequestRoute(null);
+      });
+    }, 300);
+  }
+  function updateDesignHint() {
+    const thinDesign = addPageDesignMd().trim().length < 40;
+    const noRefs = addPageAttachments().length === 0;
+    setAddPageShowDesignHint(thinDesign && noRefs);
+  }
+  async function mintRequestIdIfNeeded() {
+    const route = addPageRoute().trim();
+    if (!route) {
+      setAddPageComposerError(
+        "Enter a page route before attaching files or pasting images."
+      );
+      return null;
+    }
+    if (addPageRouteError()) {
+      setAddPageComposerError(addPageRouteError());
+      return null;
+    }
+    const ensured = await ensureAddPageRequestId(route, addPageRequestId());
+    if (ensured.error) {
+      setAddPageComposerError(ensured.error);
+      return null;
+    }
+    setAddPageRequestId(ensured.requestId);
+    setAddPageRequestRoute(route);
+    briefFillPanel.onRequestIdMinted(ensured.requestId);
+    return ensured.requestId;
+  }
+  async function handleAddPageUpload(file, role, markdownTarget = "content") {
+    setAddPageComposerError("");
+    setAddPageUploadHint(`Uploading ${file.name}…`);
+    const requestId = await mintRequestIdIfNeeded();
+    if (!requestId) {
+      setAddPageUploadHint("");
+      return;
+    }
+    try {
+      const result = await uploadAddPageAsset({
+        requestId,
+        role,
+        file
+      });
+      const chip = {
+        rowKey: result.id,
+        id: result.id,
+        filename: file.name,
+        path: result.path,
+        role,
+        roleLabel: role === "reference" ? "Reference" : "Asset"
+      };
+      setAddPageAttachments((prev) => [...prev, chip]);
+      if (role === "asset" && result.markdownSnippet) {
+        const ta = markdownTarget === "design" ? designTextareaEl : contentTextareaEl;
+        const setMd = markdownTarget === "design" ? setAddPageDesignMd : setAddPageContentMd;
+        if (ta) {
+          setMd((md) => insertTextAtCursor(ta, result.markdownSnippet, md));
+        }
+      }
+      updateDesignHint();
+    } catch (err) {
+      setAddPageComposerError(err instanceof Error ? err.message : String(err));
+    } finally {
+      setAddPageUploadHint("");
+    }
+  }
+  function handleAddPageChunk(chunk) {
+    if (chunk.type === "thinking" && chunk.text) {
+      deps.appendAgentOutputChunk(chunk.text, "chunk chunk-thinking");
+    } else if (chunk.type === "chunk" && chunk.text) {
+      deps.appendAgentOutputChunk(chunk.text);
+    } else if (chunk.type === "status" && chunk.message) {
+      deps.appendAgentOutputChunk(chunk.message, "chunk chunk-status");
+    } else if (chunk.type === "tool" && chunk.name) {
+      const detail = chunk.text ? ` ${chunk.text}` : "";
+      const fp = chunk.name === "Read" || chunk.name === "Write" ? chunk.text?.split("\n")[0]?.trim() ?? "" : "";
+      deps.appendAgentOutputChunk(
+        `> ${chunk.name}${detail}`,
+        "chunk chunk-tool",
+        fp,
+        fp ? chunk.name : ""
+      );
+    } else if (chunk.type === "error" && chunk.message) {
+      deps.appendAgentOutputChunk(chunk.message, "chunk chunk-error");
+      if (chunk.text) {
+        deps.appendAgentOutputChunk(chunk.text, "chunk chunk-error");
+      }
+    } else if (chunk.type === "result") {
+      deps.appendAgentOutputChunk(
+        chunk.message ?? "Page created.",
+        "chunk chunk-result"
+      );
+    }
+  }
+  function findProjectPageForRoute(pageRoute) {
+    const normalized = pageRoute.replace(/\/+$/, "") || "/";
+    return deps.projectPages().find((p) => p.url === normalized) ?? deps.projectPages().find((p) => p.url === pageRoute);
+  }
+  async function openPreviewForRoute(pageRoute) {
+    const normalized = pageRoute.replace(/\/+$/, "") || "/";
+    await deps.loadProjectInfo();
+    let page2 = findProjectPageForRoute(pageRoute);
+    if (!page2) {
+      await new Promise((r) => setTimeout(r, 400));
+      await deps.loadProjectInfo();
+      page2 = findProjectPageForRoute(pageRoute);
+    }
+    if (!page2) {
+      page2 = {
+        name: normalized,
+        url: normalized,
+        filePath: "",
+        usedComponents: []
+      };
+    }
+    deps.selectProjectPage(page2);
+    if (inferRouteKindFromRoute(pageRoute) === "dynamic") {
+      try {
+        const allRows = [];
+        for await (const batch of getPageParamsAction({ route: pageRoute })) {
+          allRows.push(...batch);
+        }
+        const paths = pathnamesFromParamRows(page2.url, allRows);
+        if (paths.length === 0) {
+          deps.appendAgentOutputChunk(
+            "Add a param value in the route picker to preview this dynamic page.",
+            "chunk chunk-status"
+          );
+        }
+      } catch {
+        deps.appendAgentOutputChunk(
+          "Add a param value in the route picker to preview this dynamic page.",
+          "chunk chunk-status"
+        );
+      }
+    }
+  }
+  let lastSubmitSnapshot = null;
+  function submitAddPage(isRetry = false) {
+    if (!addPageCanSubmit()) return;
+    const route = addPageRoute().trim();
+    void (async () => {
+      setAddPageComposerError("");
+      setAddPageSubmitting(true);
+      const requestId = await mintRequestIdIfNeeded();
+      if (!requestId) {
+        setAddPageSubmitting(false);
+        return;
+      }
+      lastSubmitSnapshot = {
+        requestId,
+        pageRoute: route,
+        contentMd: addPageContentMd(),
+        designMd: addPageDesignMd()
+      };
+      setShowAddPageComposer(false);
+      deps.setChunks([]);
+      deps.setIsRunning(true);
+      deps.setBottomPanelCollapsed(false);
+      deps.setAddPageResultBanner(null);
+      await pluginsPanel.syncManifestNow();
+      deps.getStopStream()?.();
+      const abort = submitAddPageStream(
+        {
+          requestId,
+          contentMd: addPageContentMd(),
+          designMd: addPageDesignMd(),
+          pageRoute: route,
+          isRetry
+        },
+        {
+          onChunk: (chunk) => {
+            handleAddPageChunk(chunk);
+            if (chunk.type === "result" && chunk.text) {
+              deps.setAddPageResultBanner({
+                kind: "success",
+                message: "Page created — use annotate tools to refine details.",
+                pageRoute: chunk.text,
+                showRetry: false,
+                showFixWithAiditor: false
+              });
+              void openPreviewForRoute(chunk.text);
+            }
+            if (chunk.type === "error" && "validateErrors" in chunk && Array.isArray(
+              chunk.validateErrors
+            ) && (chunk.validateErrors?.length ?? 0) > 0) {
+              deps.setAddPageResultBanner({
+                kind: "failed",
+                message: "Validation failed.",
+                pageRoute: route,
+                showRetry: true,
+                showFixWithAiditor: true
+              });
+            } else if (chunk.type === "error") {
+              deps.setAddPageResultBanner({
+                kind: "failed",
+                message: chunk.message ?? "Add Page failed.",
+                pageRoute: route,
+                showRetry: true,
+                showFixWithAiditor: true
+              });
+            }
+          },
+          onEnd: () => {
+            deps.setIsRunning(false);
+            setAddPageSubmitting(false);
+          },
+          onError: (err) => {
+            deps.appendAgentOutputChunk(err.message, "chunk chunk-error");
+            deps.setIsRunning(false);
+            setAddPageSubmitting(false);
+            deps.setAddPageResultBanner({
+              kind: "failed",
+              message: err.message,
+              pageRoute: route,
+              showRetry: true,
+              showFixWithAiditor: false
+            });
+          }
+        }
+      );
+      deps.setStopStream(abort);
+    })();
+  }
+  function retryAddPage() {
+    const snap = lastSubmitSnapshot;
+    if (!snap) {
+      openAddPageComposer();
+      return;
+    }
+    setAddPageRoute(snap.pageRoute);
+    setAddPageContentMd(snap.contentMd);
+    setAddPageDesignMd(snap.designMd);
+    setAddPageRequestId(snap.requestId);
+    submitAddPage(true);
+  }
+  function bindAddPageRefs(refs) {
+    refs.addPageOpenBtn.onclick(() => openAddPageComposer());
+    refs.addPageFromBriefBtn.onclick(() => {
+      void openAddPageComposerFromBrief();
+    });
+    refs.addPageCloseBtn.onclick(() => closeAddPageComposer());
+    refs.addPageCancelBtn.onclick(() => closeAddPageComposer());
+    refs.addPageOverlay.onclick(({ event }) => {
+      if (event.target === event.currentTarget) {
+        closeAddPageComposer();
+      }
+    });
+    refs.addPageCreateBtn.onclick(() => submitAddPage(false));
+    refs.addPageRouteInput.oninput(({ event }) => {
+      const v = event.target.value;
+      setAddPageRoute(v);
+      scheduleRouteCheck(v);
+    });
+    refs.addPageContentMd.oninput(({ event }) => {
+      contentTextareaEl = event.target;
+      setAddPageContentMd(contentTextareaEl.value);
+      updateDesignHint();
+    });
+    refs.addPageDesignMd.oninput(({ event }) => {
+      designTextareaEl = event.target;
+      setAddPageDesignMd(designTextareaEl.value);
+      updateDesignHint();
+    });
+    function imageFilesFromDataTransfer(dt) {
+      if (!dt?.files?.length) return [];
+      return Array.from(dt.files).filter((f2) => f2.type.startsWith("image/"));
+    }
+    function bindAddPageMarkdownFileDrop(ref, markdownTarget) {
+      ref.ondragover(({ event }) => {
+        if (imageFilesFromDataTransfer(event.dataTransfer).length > 0) {
+          event.preventDefault();
+        }
+      });
+      ref.ondrop(({ event }) => {
+        const files = imageFilesFromDataTransfer(event.dataTransfer);
+        if (files.length === 0) return;
+        event.preventDefault();
+        for (const file of files) {
+          void handleAddPageUpload(file, "asset", markdownTarget);
+        }
+      });
+      ref.addEventListener("paste", (ev) => {
+        const files = imageFilesFromPasteEvent(ev.event);
+        if (files.length === 0) return;
+        ev.event.preventDefault();
+        for (const file of files) {
+          void handleAddPageUpload(file, "asset", markdownTarget);
+        }
+      });
+    }
+    bindAddPageMarkdownFileDrop(refs.addPageContentMd, "content");
+    bindAddPageMarkdownFileDrop(refs.addPageDesignMd, "design");
+    refs.addPageReferenceFileInput.onchange(
+      ({ event }) => {
+        const input = event.target;
+        const files = input.files ? Array.from(input.files) : [];
+        for (const file of files) void handleAddPageUpload(file, "reference");
+        input.value = "";
+      }
+    );
+    refs.addPageReferenceDrop.ondragover(
+      ({ event }) => {
+        event.preventDefault();
+      }
+    );
+    refs.addPageReferenceDrop.ondrop(
+      ({ event }) => {
+        event.preventDefault();
+        const files = event.dataTransfer?.files;
+        if (!files?.length) return;
+        for (const file of Array.from(files)) {
+          void handleAddPageUpload(file, "reference");
+        }
+      }
+    );
+    refs.addPageAttachReferenceBtn.onclick(() => {
+      tryJayRefExec(refs.addPageReferenceFileInput, (el) => {
+        el.click();
+      });
+    });
+    pluginsPanel.bindPluginsPanelRefs(refs);
+    briefFillPanel.bindBriefFillRefs(refs);
+    refs.addPageAttachmentsList.onchange(
+      ({ event }) => {
+        const sel = event.target;
+        const id = sel.dataset.attachmentId;
+        const newRole = sel.value;
+        if (!id) return;
+        const chip = addPageAttachments().find((c) => c.id === id);
+        if (!chip || chip.role === newRole) return;
+        const requestId = addPageRequestId();
+        if (!requestId) return;
+        void reclassifyAddPageAsset({
+          requestId,
+          attachmentId: id,
+          newRole
+        }).then((res) => {
+          setAddPageAttachments(
+            (prev) => prev.map(
+              (c) => c.id === id ? {
+                ...c,
+                role: newRole,
+                roleLabel: newRole === "reference" ? "Reference" : "Asset",
+                path: res.path
+              } : c
+            )
+          );
+        });
+      }
+    );
+    refs.addPageAttachmentsList.onclick(
+      ({ event }) => {
+        const btn = event.target.closest(
+          "[data-add-page-remove]"
+        );
+        if (!btn) return;
+        const id = btn.dataset.addPageRemove;
+        if (!id) return;
+        setAddPageAttachments((prev) => prev.filter((c) => c.id !== id));
+        updateDesignHint();
+      }
+    );
+  }
+  return {
+    showAddPageComposer,
+    addPageRoute,
+    addPageContentMd,
+    addPageDesignMd,
+    addPageRouteError,
+    addPageComposerError,
+    addPageUploadHint,
+    addPageAttachmentRows: addPageAttachmentDisplayRows,
+    addPageShowDesignHint,
+    showAddPagePluginsPanel: pluginsPanel.showPluginsPanel,
+    showAddPagePagePluginsZone: pluginsPanel.showPagePluginsZone,
+    addPagePluginPickerOptions: pluginsPanel.addPagePluginPickerOptions,
+    addPagePluginPickerValue: pluginsPanel.addPagePluginPickerValue,
+    showAddPageContractPicker: pluginsPanel.showContractPicker,
+    addPagePickerPluginLabel: pluginsPanel.addPagePickerPluginLabel,
+    addPageContractPickerRows: pluginsPanel.addPageContractPickerRows,
+    addPagePagePluginChips: pluginsPanel.pagePluginChipRows,
+    showAddPageHasPagePluginChips: createMemo(
+      () => pluginsPanel.pagePluginChipRows().length > 0
+    ),
+    showAddPagePagePluginsEmptyHint: pluginsPanel.showPagePluginsEmptyHint,
+    addPageIsDynamicRoute,
+    addPageCreateDisabled,
+    showAddPageRouteError,
+    showAddPageComposerError,
+    showAddPageUploadHint,
+    showAddPageAttachments,
+    addPageRunningHint,
+    showAddPageRunningHint,
+    showBriefFillPopover: briefFillPanel.showBriefFillPopover,
+    briefFillContextNotes: briefFillPanel.briefFillContextNotes,
+    briefFillPopoverError: briefFillPanel.briefFillPopoverError,
+    showBriefFillPopoverError: briefFillPanel.showBriefFillPopoverError,
+    briefFillDisabled: briefFillPanel.briefFillDisabled,
+    briefFillInputDisabled: briefFillPanel.briefFillInputDisabled,
+    briefFillDropzoneClass: briefFillPanel.briefFillDropzoneClass,
+    addPageBriefFillGenerateDisabled: briefFillPanel.generateDisabled,
+    briefFillStatusHint: briefFillPanel.briefFillStatusHint,
+    showBriefFillStatusHint: briefFillPanel.showBriefFillStatusHint,
+    addPageBriefFillThumbRows: briefFillPanel.imageThumbRows,
+    showBriefFillThumbnails: briefFillPanel.showBriefFillThumbnails,
+    showSuggestedRouteBanner: briefFillPanel.showSuggestedRouteBanner,
+    suggestedRouteLabel: briefFillPanel.suggestedRouteLabel,
+    openAddPageComposer,
+    openAddPageComposerFromBrief,
+    refreshCurrentPageBriefAvailability,
+    closeAddPageComposer,
+    submitAddPage,
+    retryAddPage,
+    openPreviewForRoute,
+    bindAddPageRefs
+  };
+}
+function annotationPluginBindings(annotation) {
+  if (annotation.pluginBindings?.length) return [...annotation.pluginBindings];
+  if (annotation.pluginBinding) return [annotation.pluginBinding];
+  return [];
+}
+function buildBindingChipLabel(binding, annotationId) {
+  const where = binding.scope === "page" ? "anywhere on page" : `marker #${annotationId}`;
+  return `${binding.pluginName} · ${binding.contractName} · ${where}`;
+}
+function markerHeadlessPluginOptions(plugins) {
+  const installed = plugins.filter(
+    (p) => p.kind === "headless" && p.installed && p.showInAddPagePicker !== false && p.contracts.length > 0
+  );
+  const options = installed.map((p) => ({
+    rowKey: p.pluginName,
+    value: p.pluginName,
+    label: p.pluginName
+  }));
+  options.push({
+    rowKey: ADD_PAGE_MANAGE_PLUGINS_VALUE,
+    value: ADD_PAGE_MANAGE_PLUGINS_VALUE,
+    label: "Manage plugins…"
+  });
+  return options;
+}
+function markerContractPickerRows(plugins, pluginName, bindings) {
+  const entry = plugins.find((p) => p.pluginName === pluginName);
+  if (!entry?.installed) return [];
+  return entry.contracts.map((c) => ({
+    rowKey: `${pluginName}:${c.contractName}`,
+    pluginName,
+    packageName: entry.packageName,
+    contractName: c.contractName,
+    description: c.description ?? "",
+    onPage: bindings.some(
+      (b) => b.pluginName === pluginName && b.contractName === c.contractName
+    ),
+    componentKey: bindings.find(
+      (b) => b.pluginName === pluginName && b.contractName === c.contractName
+    )?.componentKey ?? getDefaultComponentKey(c.contractName)
+  }));
+}
+function upsertAnnotationBinding(prev, binding) {
+  const idx = prev.findIndex(
+    (b) => b.pluginName === binding.pluginName && b.contractName === binding.contractName
+  );
+  if (idx === -1) return [...prev, binding];
+  const next = [...prev];
+  next[idx] = binding;
+  return next;
+}
+function removeAnnotationBinding(prev, pluginName, contractName) {
+  return prev.filter(
+    (b) => !(b.pluginName === pluginName && b.contractName === contractName)
+  );
+}
+function enrichAnnotationBindingUi(annotation, plugins) {
+  const bindings = annotationPluginBindings(annotation);
+  const pickerPlugin = annotation.bindingPickerPlugin ?? "";
+  const open = !!annotation.bindingSectionOpen;
+  return {
+    bindingSectionOpen: open,
+    showBindingControls: open,
+    showMarkerHasBindingChips: bindings.length > 0,
+    showMarkerBindingEmptyHint: bindings.length === 0,
+    markerBindingChips: bindings.map((b) => ({
+      rowKey: `${b.pluginName}:${b.contractName}`,
+      label: buildBindingChipLabel(b, annotation.id),
+      pluginName: b.pluginName,
+      packageName: b.packageName,
+      contractName: b.contractName,
+      scope: b.scope
+    })),
+    markerPluginOptions: markerHeadlessPluginOptions(plugins),
+    markerContractPickerRows: markerContractPickerRows(
+      plugins,
+      pickerPlugin,
+      bindings
+    ),
+    showMarkerContractPicker: pickerPlugin.length > 0,
+    markerPickerPluginLabel: pickerPlugin ? `Components from ${pickerPlugin}` : ""
+  };
+}
+function bindingFromSelection(plugins, pluginName, contractName, scope) {
+  const entry = plugins.find((p) => p.pluginName === pluginName);
+  if (!entry?.installed || !contractName) return void 0;
+  return {
+    pluginName,
+    packageName: entry.packageName,
+    contractName,
+    componentKey: getDefaultComponentKey(contractName),
+    scope
+  };
+}
+function buildPluginInstallAgentNotes(entry, installError, projectDirHint) {
+  const requires = entry.requires.length > 0 ? entry.requires.join(", ") : "(none — install this plugin only)";
+  const wixPortal = entry.packageName.startsWith("@jay-framework/wix-") ? `
+- If npm is unreachable, use portal from project root: \`portal:../../../wix/packages/${entry.pluginName}\` (adjust if your wix repo path differs).` : "";
+  return [
+    "Install a Jay Framework plugin for this project. Work in the project directory shown below.",
+    "",
+    `Project directory (Jay stack app root): ${projectDirHint}`,
+    "",
+    "## Plugin to install",
+    `- pluginName: ${entry.pluginName}`,
+    `- packageName: ${entry.packageName}`,
+    `- requires (install these first if missing): ${requires}`,
+    "",
+    "## AIditor automatic install failed",
+    installError,
+    "",
+    "## Required steps (in order)",
+    "1. Determine monorepo layout: if the project is `examples/starter` inside `jay-aiditor`, run Yarn from the **workspace root** (parent with `packageManager: yarn@4.x` in package.json), NOT global Yarn 1.x.",
+    "2. Install dependencies first, then the plugin:",
+    "   - From workspace root: `corepack yarn workspace aiditor-starter add <packageName>` (use latest published version, or an explicit `@0.16.x` if needed).",
+    "   - Or from project root with Yarn 4: `corepack yarn add <packageName>`.",
+    "   - Do NOT use bare `yarn add` if it reports Yarn 1.22 — use `corepack yarn` instead.",
+    "3. Run `npx jay-stack-cli setup <pluginName>` in the project directory.",
+    "4. Run `npx jay-stack-cli agent-kit --plugin <pluginName>` in the project directory.",
+    "5. Confirm `package.json` lists the package and `agent-kit/plugins-index.yaml` includes the plugin contracts.",
+    "",
+    "## Local / monorepo alternative",
+    wixPortal,
+    "- Read `agent-kit/plugin/INSTRUCTIONS.md` for plugin setup conventions.",
+    "",
+    "When finished, summarize what you installed and any config files the user must edit (e.g. config/.wix.yaml)."
+  ].filter((line) => line !== "").join("\n");
+}
+const LOCAL_SPEC_PREFIXES = ["portal:", "file:", "workspace:"];
+function isRegistryInstallSpec(installSpec) {
+  if (!installSpec) return true;
+  return !LOCAL_SPEC_PREFIXES.some((p) => installSpec.startsWith(p));
+}
+const VALID_INSTALL_PREFIXES = ["portal:", "file:", "workspace:"];
+function isValidInstallSpec(spec) {
+  return VALID_INSTALL_PREFIXES.some((p) => spec.startsWith(p));
+}
+function initProjectPluginsManager(deps) {
+  const [pluginsList, setPluginsList] = createSignal([]);
+  const [pluginsLoaded, setPluginsLoaded] = createSignal(false);
+  const [installingPlugin, setInstallingPlugin] = createSignal(
+    null
+  );
+  const [installStepLabel, setInstallStepLabel] = createSignal("");
+  const [pluginsPanelError, setPluginsPanelError] = createSignal("");
+  const [failedInstallPlugin, setFailedInstallPlugin] = createSignal(null);
+  const [wixConfigWarning, setWixConfigWarning] = createSignal(false);
+  const [showReloadPreviewBanner, setShowReloadPreviewBanner] = createSignal(false);
+  const [showAddLocalPluginForm, setShowAddLocalPluginForm] = createSignal(false);
+  const [addLocalPluginName, setAddLocalPluginName] = createSignal("");
+  const [addLocalPackageName, setAddLocalPackageName] = createSignal("");
+  const [addLocalPath, setAddLocalPath] = createSignal("");
+  const [pluginUpdateUi, setPluginUpdateUi] = createSignal({});
+  let installAbort;
+  function updateUiForPlugin(pluginName, patch) {
+    setPluginUpdateUi((prev) => ({
+      ...prev,
+      [pluginName]: {
+        checked: false,
+        checking: false,
+        updateAvailable: false,
+        isLocalSource: false,
+        ...prev[pluginName],
+        ...patch
+      }
+    }));
+  }
+  const availableInstallRows = createMemo(() => {
+    const installing = installingPlugin();
+    return pluginsList().filter(
+      (p) => p.showInAddPagePicker && !p.installed && p.kind !== "tooling"
+    ).map((p) => ({
+      rowKey: p.pluginName,
+      pluginName: p.pluginName,
+      packageName: p.packageName,
+      description: p.description,
+      buttonLabel: installing === p.pluginName ? "Installing…" : "Install",
+      buttonDisabled: installing !== null
+    }));
+  });
+  const installedPluginRows = createMemo(() => {
+    const ui = pluginUpdateUi();
+    return pluginsList().filter((p) => p.installed).map((p) => {
+      const updateState = ui[p.pluginName];
+      const isLocal = updateState?.isLocalSource || !isRegistryInstallSpec(p.installSpec);
+      const showUpdateControl = !isLocal;
+      let updateButtonLabel = "Check for update";
+      let showCheckForUpdateBtn = showUpdateControl;
+      let showRunUpdateBtn = false;
+      let updateButtonDisabled = installingPlugin() !== null;
+      if (updateState?.checking) {
+        updateButtonLabel = "Checking…";
+        updateButtonDisabled = true;
+        showCheckForUpdateBtn = true;
+        showRunUpdateBtn = false;
+      } else if (updateState?.checked && updateState.updateAvailable) {
+        updateButtonLabel = `Update to ${updateState.latestVersion ?? "latest"}`;
+        showCheckForUpdateBtn = false;
+        showRunUpdateBtn = true;
+      } else if (updateState?.checked && !updateState.updateAvailable) {
+        updateButtonLabel = "Up to date";
+        updateButtonDisabled = true;
+        showCheckForUpdateBtn = true;
+        showRunUpdateBtn = false;
+      }
+      const versionLabel = updateState?.installedVersion ? `v${updateState.installedVersion}` : p.installedVersion ? `v${p.installedVersion}` : isLocal ? "local" : "";
+      const setupBadge = p.setupStatus === "configured" ? "Configured" : p.setupStatus === "needs-config" ? "Needs configuration" : p.setupStatus === "error" ? "Setup failed" : "";
+      const setupBadgeClass = p.setupStatus === "configured" ? "add-page-setup-ok" : p.setupStatus === "needs-config" ? "add-page-setup-warn" : "add-page-setup-error";
+      const contractSummary = p.kind === "headless" && p.contracts.length > 0 ? p.contracts.map((c) => c.contractName).join(", ") : p.kind === "service-only" ? "No page components (service)" : "";
+      return {
+        rowKey: p.pluginName,
+        pluginName: p.pluginName,
+        packageName: p.packageName,
+        description: p.description,
+        versionLabel,
+        setupBadge,
+        setupBadgeClass,
+        configFile: p.configFiles[0] ?? "",
+        showConfig: p.configFiles.length > 0,
+        contractSummary,
+        showUpdateControl,
+        showCheckForUpdateBtn,
+        showRunUpdateBtn,
+        updateButtonLabel,
+        updateButtonDisabled
+      };
+    });
+  });
+  const showInstallZone = createMemo(() => availableInstallRows().length > 0);
+  const showInstalledZone = createMemo(() => installedPluginRows().length > 0);
+  const showPluginsPanel = createMemo(
+    () => pluginsLoaded() && pluginsList().length > 0
+  );
+  const showPluginsPanelError = createMemo(
+    () => pluginsPanelError().length > 0
+  );
+  const showFixInstallWithAgent = createMemo(
+    () => showPluginsPanelError() && failedInstallPlugin() !== null && deps.fixInstallWithAgent !== void 0
+  );
+  const fixInstallPluginName = createMemo(() => failedInstallPlugin() ?? "");
+  const showInstallProgress = createMemo(
+    () => installingPlugin() !== null && installStepLabel().length > 0
+  );
+  const installInProgress = createMemo(() => installingPlugin() !== null);
+  const showWixConfigWarning = createMemo(() => wixConfigWarning());
+  const showReloadPreview = createMemo(() => showReloadPreviewBanner());
+  async function refreshPluginsList(refreshSetup = false) {
+    try {
+      const result = await listJayPlugins(refreshSetup);
+      setPluginsList(result.plugins);
+      setPluginsLoaded(true);
+      const wixClient = result.plugins.find(
+        (p) => p.pluginName === "wix-server-client"
+      );
+      setWixConfigWarning(
+        !!wixClient?.installed && wixClient.setupStatus === "needs-config"
+      );
+    } catch (err) {
+      setPluginsPanelError(err instanceof Error ? err.message : String(err));
+    }
+  }
+  async function runCheckUpdate(pluginName) {
+    updateUiForPlugin(pluginName, { checking: true });
+    setPluginsPanelError("");
+    try {
+      const result = await checkPluginUpdate(pluginName);
+      updateUiForPlugin(pluginName, {
+        checking: false,
+        checked: true,
+        updateAvailable: result.updateAvailable,
+        installedVersion: result.installedVersion ?? void 0,
+        latestVersion: result.latestVersion ?? void 0,
+        isLocalSource: result.isLocalSource,
+        message: result.message
+      });
+      if (result.message && !result.updateAvailable) {
+        setPluginsPanelError("");
+      }
+    } catch (err) {
+      updateUiForPlugin(pluginName, { checking: false, checked: false });
+      setPluginsPanelError(err instanceof Error ? err.message : String(err));
+    }
+  }
+  async function runInstall(pluginName, installSpec, options) {
+    setInstallingPlugin(pluginName);
+    setInstallStepLabel(
+      options?.upgrade ? "Starting update…" : "Starting install…"
+    );
+    setPluginsPanelError("");
+    setFailedInstallPlugin(null);
+    installAbort?.();
+    installAbort = ensureProjectPluginStream(
+      { pluginName, installSpec, upgrade: options?.upgrade },
+      {
+        onChunk: (chunk) => {
+          if (chunk.type === "progress" && chunk.message) {
+            const step = chunk.step === "package" ? "Package" : chunk.step === "requires" ? "Dependencies" : chunk.step === "setup" ? "Setup" : chunk.step === "agent-kit" ? "Contracts" : "Installing";
+            setInstallStepLabel(`${step}: ${chunk.message}`);
+          }
+          if (chunk.type === "error") {
+            setFailedInstallPlugin(pluginName);
+            setPluginsPanelError(
+              chunk.installError ?? chunk.message ?? "Install failed."
+            );
+            setInstallingPlugin(null);
+            setInstallStepLabel("");
+          }
+          if (chunk.type === "complete") {
+            setInstallingPlugin(null);
+            setInstallStepLabel("");
+            updateUiForPlugin(pluginName, {
+              checked: false,
+              checking: false,
+              updateAvailable: false
+            });
+            void refreshPluginsList(true).then(() => deps.loadProjectInfo());
+            setShowReloadPreviewBanner(true);
+          }
+        },
+        onEnd: () => {
+          setInstallingPlugin(null);
+        },
+        onError: (err) => {
+          setFailedInstallPlugin(pluginName);
+          setPluginsPanelError(err.message);
+          setInstallingPlugin(null);
+          setInstallStepLabel("");
+        }
+      }
+    );
+  }
+  function resetManager() {
+    setPluginsList([]);
+    setPluginsLoaded(false);
+    setInstallingPlugin(null);
+    setInstallStepLabel("");
+    setPluginsPanelError("");
+    setFailedInstallPlugin(null);
+    setWixConfigWarning(false);
+    setShowReloadPreviewBanner(false);
+    setShowAddLocalPluginForm(false);
+    setAddLocalPluginName("");
+    setAddLocalPackageName("");
+    setAddLocalPath("");
+    setPluginUpdateUi({});
+    installAbort?.();
+    installAbort = void 0;
+  }
+  function bindProjectPluginsRefs(refs) {
+    refs.projectPluginsPanel.onclick(
+      ({ event }) => {
+        const target = event.target;
+        const installBtn = target.closest(
+          "[data-project-install-plugin]"
+        );
+        if (installBtn) {
+          const name = installBtn.dataset.plugin;
+          if (name) void runInstall(name, installBtn.dataset.installSpec);
+          return;
+        }
+        const checkUpdateBtn = target.closest(
+          "[data-project-check-update]"
+        );
+        if (checkUpdateBtn?.dataset.plugin) {
+          void runCheckUpdate(checkUpdateBtn.dataset.plugin);
+          return;
+        }
+        const runUpdateBtn = target.closest(
+          "[data-project-run-update]"
+        );
+        if (runUpdateBtn?.dataset.plugin) {
+          void runInstall(runUpdateBtn.dataset.plugin, void 0, {
+            upgrade: true
+          });
+          return;
+        }
+        const rerunBtn = target.closest(
+          "[data-project-rerun-setup]"
+        );
+        if (rerunBtn?.dataset.plugin) {
+          void rerunPluginSetup(rerunBtn.dataset.plugin).then(
+            () => refreshPluginsList(true)
+          );
+          return;
+        }
+        const openConfigBtn = target.closest(
+          "[data-project-open-config]"
+        );
+        if (openConfigBtn?.dataset.config) {
+          void readFileAction({ filePath: openConfigBtn.dataset.config }).then(
+            (res) => {
+              if (res.type === "text") {
+                window.alert(
+                  `${openConfigBtn.dataset.config}
+
+(Edit in your IDE — secrets are not edited in AIditor.)
+
+${res.data.slice(0, 2e3)}`
+                );
+              }
+            }
+          );
+          return;
+        }
+        const fixAgentBtn = target.closest(
+          "[data-project-fix-install-agent]"
+        );
+        if (fixAgentBtn?.dataset.plugin) {
+          const name = fixAgentBtn.dataset.plugin;
+          const err = pluginsPanelError();
+          if (name && err && deps.fixInstallWithAgent) {
+            deps.fixInstallWithAgent(name, err);
+          }
+          return;
+        }
+        if (target.closest("[data-project-show-local-plugin]")) {
+          setShowAddLocalPluginForm(true);
+          return;
+        }
+        if (target.closest("[data-project-cancel-local-plugin]")) {
+          setShowAddLocalPluginForm(false);
+          return;
+        }
+        if (target.closest("[data-project-save-local-plugin]")) {
+          void (async () => {
+            const pluginName = addLocalPluginName().trim();
+            const packageName = addLocalPackageName().trim();
+            let installSpec = addLocalPath().trim();
+            if (!pluginName || !packageName || !installSpec) {
+              setPluginsPanelError("Fill plugin name, package, and path.");
+              return;
+            }
+            if (!isValidInstallSpec(installSpec)) {
+              installSpec = `portal:${installSpec.replace(/^\.\//, "")}`;
+            }
+            if (!isValidInstallSpec(installSpec)) {
+              setPluginsPanelError(
+                "Path must be portal:, file:, or workspace: (or a relative path for portal:)."
+              );
+              return;
+            }
+            try {
+              await writePluginSource({
+                pluginName,
+                packageName,
+                installSpec,
+                label: "Local"
+              });
+              setShowAddLocalPluginForm(false);
+              setAddLocalPluginName("");
+              setAddLocalPackageName("");
+              setAddLocalPath("");
+              setPluginsPanelError("");
+              await refreshPluginsList();
+            } catch (err) {
+              setPluginsPanelError(
+                err instanceof Error ? err.message : String(err)
+              );
+            }
+          })();
+        }
+      }
+    );
+  }
+  return {
+    pluginsList,
+    pluginsLoaded,
+    refreshPluginsList,
+    resetManager,
+    bindProjectPluginsRefs,
+    availableInstallRows,
+    installedPluginRows,
+    showInstallZone,
+    showInstalledZone,
+    showPluginsPanel,
+    showPluginsPanelError,
+    showFixInstallWithAgent,
+    fixInstallPluginName,
+    pluginsPanelError,
+    showInstallProgress,
+    installStepLabel,
+    showWixConfigWarning,
+    showReloadPreview,
+    installInProgress,
+    showAddLocalPluginForm,
+    addLocalPluginName,
+    addLocalPackageName,
+    addLocalPath,
+    setAddLocalPluginName,
+    setAddLocalPackageName,
+    setAddLocalPath,
+    runInstall
+  };
+}
+setActionCallerOptions({ timeout: 12e4 });
+const MAX_ATTACHMENTS_PER_PIN = 10;
+const MAX_ATTACHMENT_BYTES_PER_PIN = 5 * 1024 * 1024;
+function mbLabel(bytes) {
+  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+}
+function newLocalAttachmentId() {
+  return typeof crypto !== "undefined" && "randomUUID" in crypto ? crypto.randomUUID() : `f_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 9)}`;
+}
+function newAnnotationId() {
+  return typeof crypto !== "undefined" && "randomUUID" in crypto ? crypto.randomUUID() : `ann_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 9)}`;
+}
+function renumberAnnotations(list) {
+  return list.map((a2, i) => ({ ...a2, id: String(i + 1) }));
+}
+function serializeGeometry(a2) {
+  if (a2.kind === "point")
+    return { kind: "point", x: a2.x, y: a2.y };
+  if (a2.kind === "area")
+    return { kind: "area", x: a2.x, y: a2.y, w: a2.w, h: a2.h };
+  return { kind: "arrow", x1: a2.x1, y1: a2.y1, x2: a2.x2, y2: a2.y2 };
+}
+function toNotesPayload(annotations, breakpoint) {
+  return {
+    version: AIDITOR_NOTES_VERSION,
+    breakpoint,
+    annotations: annotations.map((a2) => ({
+      id: a2.id,
+      mode: a2.kind,
+      instruction: a2.instruction.trim(),
+      geometry: serializeGeometry(a2),
+      ...a2.pluginBindings?.length ? { pluginBindings: a2.pluginBindings } : {}
+    }))
+  };
+}
+function toVideoNotesPayload(annotations, videoMeta, notesContext) {
+  const baseOrigin = typeof window !== "undefined" ? window.location.origin : JAY_DEV_URL_DEFAULT;
+  const fallback = fallbackPreviewContextFromBar(notesContext.fallbackRenderedUrl, notesContext.fallbackRoute, baseOrigin);
+  const navLog = notesContext.previewNavLog.length > 0 ? notesContext.previewNavLog : void 0;
+  const payload = {
+    version: 2,
+    taskKind: "video",
+    videoMeta,
+    previewNavLog: navLog,
+    breakpoint: notesContext.breakpoint,
+    annotations: annotations.map((a2) => {
+      const ctx = resolvePreviewContextAtTime(a2.timeSec, navLog, fallback);
+      return {
+        id: a2.id,
+        mode: a2.kind,
+        instruction: a2.instruction.trim(),
+        geometry: serializeGeometry(a2),
+        timeSec: a2.timeSec,
+        previewUrlAtTime: ctx.href,
+        pagePathAtTime: ctx.locationPath,
+        ...a2.pluginBindings?.length ? { pluginBindings: a2.pluginBindings } : {}
+      };
+    })
+  };
+  return JSON.stringify(payload);
+}
+function toSerializedVideoForPins(a2) {
+  return {
+    id: a2.id,
+    mode: a2.kind,
+    instruction: a2.instruction,
+    geometry: serializeGeometry(a2),
+    timeSec: a2.timeSec
+  };
+}
+function kindLabel(kind) {
+  if (kind === "point")
+    return "Point";
+  if (kind === "area")
+    return "Area";
+  return "Arrow";
+}
+const VIDEO_ANNOTATION_TIME_TOLERANCE_SEC = 0.15;
+function isVideoAnnotationAtPlayhead(playheadSec, annotationTimeSec) {
+  return Math.abs(playheadSec - annotationTimeSec) <= VIDEO_ANNOTATION_TIME_TOLERANCE_SEC;
+}
+function bubbleAnchorNorm(a2) {
+  if (a2.kind === "point")
+    return { nx: a2.x, ny: a2.y };
+  if (a2.kind === "area") {
+    return { nx: Math.min(1, a2.x + a2.w), ny: Math.min(1, a2.y + a2.h) };
+  }
+  return { nx: a2.x2, ny: a2.y2 };
+}
+const POPOVER_FLIP_X_PCT = 56;
+const POPOVER_FLIP_Y_PCT = 52;
+function popoverFlipFromPct(leftPct, topPct) {
+  return {
+    flipX: leftPct > POPOVER_FLIP_X_PCT,
+    flipY: topPct > POPOVER_FLIP_Y_PCT
+  };
+}
+const JAY_DEV_URL_DEFAULT = typeof window !== "undefined" ? window.location.origin : "http://localhost:3000";
+const paramsCache = /* @__PURE__ */ new Map();
+function dedupePastedFiles(files) {
+  const seen = /* @__PURE__ */ new Set();
+  const out = [];
+  for (const f2 of files) {
+    const k = `${f2.name}\0${f2.size}\0${f2.lastModified}\0${f2.type}`;
+    if (seen.has(k))
+      continue;
+    seen.add(k);
+    out.push(f2);
+  }
+  return out;
+}
+function filesFromClipboardData(cd) {
+  if (!cd)
+    return [];
+  const accum = [];
+  for (let i = 0; i < cd.files.length; i++) {
+    const f2 = cd.files.item(i);
+    if (f2)
+      accum.push(f2);
+  }
+  if (cd.items) {
+    for (let i = 0; i < cd.items.length; i++) {
+      const it = cd.items[i];
+      if (it?.kind === "file") {
+        const f2 = it.getAsFile();
+        if (f2)
+          accum.push(f2);
+      }
+    }
+  }
+  return dedupePastedFiles(accum);
+}
+function clipboardItemsArray(cd) {
+  const items = cd?.items;
+  if (!items || items.length === 0)
+    return [];
+  return Array.from({ length: items.length }, (_, i) => items[i]).filter(Boolean);
+}
+function dataUrlToImageFileSync(dataUrl, index) {
+  const comma = dataUrl.indexOf(",");
+  if (comma < 0)
+    return null;
+  const header = dataUrl.slice(0, comma);
+  const dataPart = dataUrl.slice(comma + 1);
+  const mimeMatch = header.match(/^data:([^;,]+)/i);
+  const mime = mimeMatch?.[1]?.trim() ?? "";
+  if (!mime.startsWith("image/"))
+    return null;
+  const isBase64 = /;base64/i.test(header);
+  let bytes;
+  if (isBase64) {
+    try {
+      const bin = atob(dataPart.replace(/\s/g, ""));
+      bytes = new Uint8Array(bin.length);
+      for (let i = 0; i < bin.length; i++)
+        bytes[i] = bin.charCodeAt(i);
+    } catch {
+      return null;
+    }
+  } else {
+    try {
+      bytes = new TextEncoder().encode(decodeURIComponent(dataPart.replace(/\+/g, "%20")));
+    } catch {
+      return null;
+    }
+  }
+  const extPart = mime.split("/")[1] || "png";
+  const ext = extPart.replace(/\+xml$/, "").split("+")[0] || "png";
+  const buf = bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength);
+  return new File([buf], `paste-${index}.${ext}`, { type: mime });
+}
+function filesFromPastedHtmlDataUrls(html) {
+  if (!html)
+    return [];
+  let doc;
+  try {
+    doc = new DOMParser().parseFromString(html, "text/html");
+  } catch {
+    return [];
+  }
+  const out = [];
+  for (const img of Array.from(doc.querySelectorAll("img[src]"))) {
+    const src = img.getAttribute("src");
+    if (!src?.startsWith("data:image"))
+      continue;
+    const f2 = dataUrlToImageFileSync(src, out.length);
+    if (f2)
+      out.push(f2);
+  }
+  return dedupePastedFiles(out);
+}
+function filesFromPlainDataImageUrl(text) {
+  const t = text.trim();
+  if (!t.startsWith("data:image/"))
+    return [];
+  const f2 = dataUrlToImageFileSync(t, 0);
+  return f2 ? [f2] : [];
+}
+async function imageFilesFromNavigatorClipboard() {
+  if (!navigator.clipboard?.read)
+    return [];
+  let clipItems;
+  try {
+    clipItems = await navigator.clipboard.read();
+  } catch {
+    return [];
+  }
+  const out = [];
+  let idx = 0;
+  for (const ci of clipItems) {
+    for (const type of ci.types) {
+      if (!type.startsWith("image/"))
+        continue;
+      try {
+        const blob = await ci.getType(type);
+        if (!(blob instanceof Blob) || blob.size === 0)
+          continue;
+        const ext = type.split("/")[1]?.split("+")[0] || "png";
+        out.push(new File([blob], `paste-${idx++}.${ext}`, { type }));
+      } catch {
+      }
+    }
+  }
+  return dedupePastedFiles(out);
+}
+let aiditorBoundDocumentPaste = null;
+function bindAiditorDocumentPasteCapture(handler) {
+  if (typeof document === "undefined")
+    return;
+  if (aiditorBoundDocumentPaste) {
+    document.removeEventListener("paste", aiditorBoundDocumentPaste, true);
+  }
+  aiditorBoundDocumentPaste = handler;
+  document.addEventListener("paste", handler, true);
+}
+function aiditorConstructor(_props, refs) {
+  const [projectDir, setProjectDir] = createSignal("");
+  const [jayDevUrl, setJayDevUrl] = createSignal(JAY_DEV_URL_DEFAULT);
+  const [isBootstrapping, setIsBootstrapping] = createSignal(true);
+  const [showBootstrapError, setShowBootstrapError] = createSignal(false);
+  const [bootstrapErrorText, setBootstrapErrorText] = createSignal("");
+  const [activeTaskId, setActiveTaskId] = createSignal(null);
+  const [chunks, setChunks] = createSignal([]);
+  const [bottomPanelCollapsed, setBottomPanelCollapsed] = createSignal(true);
+  const [agentChatMessage, setAgentChatMessage] = createSignal("");
+  const [addPageResultBanner, setAddPageResultBanner] = createSignal(null);
+  const [isRunning, setIsRunning] = createSignal(false);
+  const [showFilePreview, setShowFilePreview] = createSignal(false);
   const [filePreviewPath, setFilePreviewPath] = createSignal("");
   const [filePreviewContent, setFilePreviewContent] = createSignal("");
   const [filePreviewIsImage, setFilePreviewIsImage] = createSignal(false);
@@ -8935,6 +10996,7 @@ function aiditorConstructor(_props, refs) {
   const [httpBaseUrl, setHttpBaseUrl] = createSignal("");
   const [isPreviewMode, setIsPreviewMode] = createSignal(false);
   const [selectedPageUrl, setSelectedPageUrl] = createSignal(null);
+  const [currentPageHasBrief, setCurrentPageHasBrief] = createSignal(false);
   const [previewSrc, setPreviewSrc] = createSignal("");
   const [previewUrlBar, setPreviewUrlBar] = createSignal("");
   const [previewLoading, setPreviewLoading] = createSignal(false);
@@ -8956,6 +11018,21 @@ function aiditorConstructor(_props, refs) {
   const [areaDraft, setAreaDraft] = createSignal(null);
   const [arrowPending, setArrowPending] = createSignal(null);
   const [visualSubmitError, setVisualSubmitError] = createSignal("");
+  const [showProjectSettingsModal, setShowProjectSettingsModal] = createSignal(false);
+  let runPluginInstallAgent;
+  const projectPlugins = initProjectPluginsManager({
+    loadProjectInfo: () => loadProjectInfo(),
+    fixInstallWithAgent: (pluginName, installError) => {
+      runPluginInstallAgent?.(pluginName, installError);
+    }
+  });
+  function openProjectSettings() {
+    setShowProjectSettingsModal(true);
+    void projectPlugins.refreshPluginsList();
+  }
+  function closeProjectSettings() {
+    setShowProjectSettingsModal(false);
+  }
   const [showVideoReviewModal, setShowVideoReviewModal] = createSignal(false);
   const [videoReviewObjectUrl, setVideoReviewObjectUrl] = createSignal("");
   const [videoReviewPreparing, setVideoReviewPreparing] = createSignal(false);
@@ -9072,6 +11149,14 @@ function aiditorConstructor(_props, refs) {
   });
   const selectedRouteSelectValue = createMemo(() => selectedPageUrl() ?? "");
   const hasPages = createMemo(() => projectPages().length > 0);
+  const selectedPageFilePath = createMemo(() => {
+    const url = selectedPageUrl();
+    if (!url)
+      return "";
+    const page2 = projectPages().find((p) => p.url === url) ?? projectPages().find((p) => p.url === url.replace(/\/+$/, "") || "/");
+    return page2?.filePath ?? "";
+  });
+  const showAddPageFromBriefBtn = createMemo(() => currentPageHasBrief() && selectedPageFilePath().length > 0);
   const showPathSelect = createMemo(() => isPreviewMode() && !previewLoading() && !previewError() && previewPathOptions().length > 0);
   const showPreviewIframe = createMemo(() => isPreviewMode() && !previewLoading() && !!previewSrc() && !previewError());
   const showVisualToolbar = createMemo(() => isPreviewMode() && !previewLoading() && !previewError() && !!previewSrc());
@@ -9224,6 +11309,7 @@ function aiditorConstructor(_props, refs) {
   });
   const visualAnnotationRows = createMemo(() => {
     const runDisabled = visualRunDisabled();
+    const plugins = projectPlugins.pluginsList();
     return visualAnnotations().map((a2) => {
       const { nx, ny } = bubbleAnchorNorm(a2);
       const leftPct = nx * 100;
@@ -9244,7 +11330,8 @@ function aiditorConstructor(_props, refs) {
         topPct,
         popoverFlipX: flipX,
         popoverFlipY: flipY,
-        attachmentChips
+        attachmentChips,
+        ...enrichAnnotationBindingUi(a2, plugins)
       };
     });
   });
@@ -9375,6 +11462,7 @@ function aiditorConstructor(_props, refs) {
     const t = videoReviewCurrentTimeSec();
     const list = fullList.filter((a2) => isVideoAnnotationAtPlayhead(t, a2.timeSec));
     const runDisabled = fullList.length > 0 && (isRunning() || fullList.some((a2) => a2.instruction.trim().length === 0));
+    const plugins = projectPlugins.pluginsList();
     return list.map((a2) => {
       const { nx, ny } = bubbleAnchorNorm(a2);
       const leftPct = nx * 100;
@@ -9396,7 +11484,8 @@ function aiditorConstructor(_props, refs) {
         topPct,
         popoverFlipX: flipX,
         popoverFlipY: flipY,
-        attachmentChips
+        attachmentChips,
+        ...enrichAnnotationBindingUi(a2, plugins)
       };
     });
   });
@@ -9521,30 +11610,34 @@ function aiditorConstructor(_props, refs) {
   const snapshotAreaDraftTopPct = createMemo(() => (snapshotAreaDraftNorm()?.y ?? 0) * 100);
   const snapshotAreaDraftWidthPct = createMemo(() => (snapshotAreaDraftNorm()?.w ?? 0) * 100);
   const snapshotAreaDraftHeightPct = createMemo(() => (snapshotAreaDraftNorm()?.h ?? 0) * 100);
-  const snapshotAnnotationItems = createMemo(() => snapshotAnnotations().map((a2) => {
-    const { nx, ny } = bubbleAnchorNorm(a2);
-    const leftPct = nx * 100;
-    const topPct = ny * 100;
-    const { flipX, flipY } = popoverFlipFromPct(leftPct, topPct);
-    const attachmentChips = a2.attachments.map((at) => ({
-      key: at.id,
-      name: at.file.name,
-      thumbUrl: at.previewUrl && at.file.type.startsWith("image/") ? at.previewUrl : "",
-      annotationId: a2.id
-    }));
-    return {
-      id: a2.id,
-      indexLabel: a2.id,
-      kindLabel: `${a2.id} — ${kindLabel(a2.kind)}`,
-      instruction: a2.instruction,
-      kind: a2.kind,
-      leftPct,
-      topPct,
-      popoverFlipX: flipX,
-      popoverFlipY: flipY,
-      attachmentChips
-    };
-  }));
+  const snapshotAnnotationItems = createMemo(() => {
+    const plugins = projectPlugins.pluginsList();
+    return snapshotAnnotations().map((a2) => {
+      const { nx, ny } = bubbleAnchorNorm(a2);
+      const leftPct = nx * 100;
+      const topPct = ny * 100;
+      const { flipX, flipY } = popoverFlipFromPct(leftPct, topPct);
+      const attachmentChips = a2.attachments.map((at) => ({
+        key: at.id,
+        name: at.file.name,
+        thumbUrl: at.previewUrl && at.file.type.startsWith("image/") ? at.previewUrl : "",
+        annotationId: a2.id
+      }));
+      return {
+        id: a2.id,
+        indexLabel: a2.id,
+        kindLabel: `${a2.id} — ${kindLabel(a2.kind)}`,
+        instruction: a2.instruction,
+        kind: a2.kind,
+        leftPct,
+        topPct,
+        popoverFlipX: flipX,
+        popoverFlipY: flipY,
+        attachmentChips,
+        ...enrichAnnotationBindingUi(a2, plugins)
+      };
+    });
+  });
   const showSnapshotAnnotationsPanel = createMemo(() => snapshotAnnotations().length > 0);
   const showSnapshotSubmitError = createMemo(() => snapshotSubmitError().trim().length > 0);
   const showSnapshotPointMarkers = createMemo(() => snapshotPointDisplayItems().length > 0);
@@ -9558,6 +11651,10 @@ function aiditorConstructor(_props, refs) {
   const bottomPanelClass = createMemo(() => bottomPanelCollapsed() ? "bottom-panel bottom-panel-collapsed" : "bottom-panel");
   const bottomPanelToggleGlyph = createMemo(() => bottomPanelCollapsed() ? "▲" : "▼");
   const showBottomPanelRunning = createMemo(() => isRunning());
+  const showAgentChatInput = createMemo(() => !bottomPanelCollapsed());
+  const agentChatInputDisabled = createMemo(() => isRunning());
+  const agentChatSendDisabled = createMemo(() => isRunning() || agentChatMessage().trim().length === 0);
+  const agentChatPlaceholder = createMemo(() => isRunning() ? "Agent is working…" : "Type a message…");
   let stopStream = null;
   let previewParamsGeneration = 0;
   let attachTargetPinId = null;
@@ -9766,7 +11863,7 @@ function aiditorConstructor(_props, refs) {
   }
   function focusLastSnapshotAnnotationTextarea() {
     requestAnimationFrame(() => {
-      tryJayRefExec(refs.snapshotBackdrop, (backdrop) => {
+      tryJayRefExec2(refs.snapshotBackdrop, (backdrop) => {
         const textareas = backdrop.querySelectorAll("textarea.visual-annotation-instruction");
         const last = textareas[textareas.length - 1];
         if (last)
@@ -9787,6 +11884,85 @@ function aiditorConstructor(_props, refs) {
     setVisualAnnotations((prev) => prev.map((a2) => a2.id === id ? { ...a2, instruction } : a2));
     setVisualSubmitError("");
   }
+  createEffect(() => {
+    if (visualAnnotations().length > 0 || snapshotAnnotations().length > 0 || videoSessionAnnotations().length > 0 || showProjectSettingsModal()) {
+      void projectPlugins.refreshPluginsList();
+    }
+  });
+  function updateVisualAnnotation(id, updater) {
+    setVisualAnnotations((prev) => prev.map((a2) => a2.id === id ? updater(a2) : a2));
+  }
+  function updateSnapshotAnnotation(id, updater) {
+    setSnapshotAnnotations((prev) => prev.map((a2) => a2.id === id ? updater(a2) : a2));
+  }
+  function updateVideoAnnotation(id, updater) {
+    setVideoSessionAnnotations((prev) => prev.map((a2) => a2.id === id ? updater(a2) : a2));
+  }
+  function updateVideoAsVisual(id, updater) {
+    updateVideoAnnotation(id, (a2) => updater(a2));
+  }
+  function toggleBindingSection(update, id) {
+    update(id, (a2) => ({
+      ...a2,
+      bindingSectionOpen: !a2.bindingSectionOpen
+    }));
+  }
+  function setBindingPickerPlugin(update, id, pluginName) {
+    if (pluginName === ADD_PAGE_MANAGE_PLUGINS_VALUE || pluginName === "__install__") {
+      openProjectSettings();
+      return;
+    }
+    update(id, (a2) => ({
+      ...a2,
+      bindingSectionOpen: true,
+      bindingPickerPlugin: pluginName
+    }));
+  }
+  function addBindingToAnnotation(update, id, pluginName, _packageName, contractName, componentKey) {
+    const plugins = projectPlugins.pluginsList();
+    update(id, (a2) => {
+      const binding = bindingFromSelection(plugins, pluginName, contractName, "marker");
+      if (!binding)
+        return a2;
+      if (componentKey)
+        binding.componentKey = componentKey;
+      return {
+        ...a2,
+        bindingSectionOpen: true,
+        pluginBindings: upsertAnnotationBinding(a2.pluginBindings ?? [], binding)
+      };
+    });
+  }
+  function removeBindingFromAnnotation(update, id, pluginName, contractName) {
+    update(id, (a2) => ({
+      ...a2,
+      pluginBindings: removeAnnotationBinding(a2.pluginBindings ?? [], pluginName, contractName)
+    }));
+  }
+  function handleBindingUiEvent(target, id, update) {
+    if (target.classList.contains("annotation-binding-toggle")) {
+      toggleBindingSection(update, id);
+      return;
+    }
+    if (target.closest("[data-marker-manage-plugins]")) {
+      openProjectSettings();
+      return;
+    }
+    if (target.classList.contains("annotation-binding-plugin")) {
+      setBindingPickerPlugin(update, id, target.value);
+      return;
+    }
+    const addBtn = target.closest("[data-marker-add-contract]");
+    if (addBtn?.dataset.plugin && addBtn.dataset.contract && addBtn.dataset.package) {
+      addBindingToAnnotation(update, id, addBtn.dataset.plugin, addBtn.dataset.package, addBtn.dataset.contract, addBtn.dataset.key ?? "");
+      return;
+    }
+    const removeChip = target.closest("[data-marker-remove-binding]");
+    if (removeChip?.dataset.plugin && removeChip.dataset.contract) {
+      removeBindingFromAnnotation(update, id, removeChip.dataset.plugin, removeChip.dataset.contract);
+      return;
+    }
+  }
   function setRecordingDraftInstruction(instruction) {
     setRecordingDraftAnnotation((prev) => {
       if (!prev)
@@ -9835,7 +12011,7 @@ function aiditorConstructor(_props, refs) {
   }
   function focusLastAnnotationTextarea() {
     requestAnimationFrame(() => {
-      tryJayRefExec(refs.visualOverlay, (overlay) => {
+      tryJayRefExec2(refs.visualOverlay, (overlay) => {
         const root = overlay.closest(".main-panel") ?? overlay.parentElement;
         if (!root)
           return;
@@ -9904,7 +12080,7 @@ function aiditorConstructor(_props, refs) {
     });
   }
   function touchAnnotationDropWire() {
-    tryJayRefExec(refs.previewCaptureRoot, (root) => {
+    tryJayRefExec2(refs.previewCaptureRoot, (root) => {
       const el = root;
       if (el._aiditorAnnotEvents)
         return;
@@ -9950,8 +12126,8 @@ function aiditorConstructor(_props, refs) {
   }
   function loadProjectInfo() {
     if (!projectDir())
-      return;
-    getProjectInfoAction({ jayDevUrl: jayDevUrl() }).then((raw) => {
+      return Promise.resolve();
+    return getProjectInfoAction({ jayDevUrl: jayDevUrl() }).then((raw) => {
       const routes = raw.routes ?? [];
       const pages = routes.map((r) => ({
         name: r.path,
@@ -9967,7 +12143,9 @@ function aiditorConstructor(_props, refs) {
       const home = pages.find((p) => p.url === "/" || p.url === "");
       if (home)
         selectProjectPage(home);
-    }).catch((err) => console.error("[aiditor] getProjectInfo error:", err));
+    }).catch((err) => {
+      console.error("[aiditor] getProjectInfo error:", err);
+    });
   }
   function loadFreezes(route) {
     listFreezesAction({ route }).then(({ freezes }) => {
@@ -10049,6 +12227,20 @@ function aiditorConstructor(_props, refs) {
       }
     })();
   }
+  function appendAgentOutputChunk(text, cssClass = "chunk", filePath = "", toolName = "", showUserPrefix = false) {
+    setChunks((prev) => [
+      ...prev,
+      { text, cssClass, filePath, toolName, showUserPrefix }
+    ]);
+    requestAnimationFrame(() => {
+      tryJayRefExec2(refs.outputScroll, (el) => {
+        el.scrollTop = el.scrollHeight;
+      });
+    });
+  }
+  const refreshPageBriefRef = {
+    current: null
+  };
   function selectProjectPage(page2) {
     ++previewParamsGeneration;
     clearVisualSession();
@@ -10064,6 +12256,7 @@ function aiditorConstructor(_props, refs) {
       setPreviewSrc("");
       setPreviewUrlBar("");
       setPreviewError("Connect to Jay dev (setup) to load previews.");
+      void refreshPageBriefRef.current?.();
       return;
     }
     if (!page2.url.includes(":")) {
@@ -10073,11 +12266,44 @@ function aiditorConstructor(_props, refs) {
       setLogicalPreviewFull(full);
       queueMicrotask(() => touchAnnotationDropWire());
       loadFreezes(page2.url);
+      void refreshPageBriefRef.current?.();
       return;
     }
     setPreviewSrc("");
     loadParamsForRoute(page2);
-  }
+    void refreshPageBriefRef.current?.();
+  }
+  const addPage = initAddPageComposer({
+    projectDir,
+    isRunning,
+    setIsRunning,
+    setBottomPanelCollapsed,
+    appendAgentOutputChunk,
+    setChunks,
+    loadProjectInfo,
+    projectPlugins,
+    openProjectSettings,
+    projectPages,
+    httpBaseUrl,
+    setSelectedPageUrl,
+    selectProjectPage,
+    setAddPageResultBanner,
+    getStopStream: () => stopStream ?? void 0,
+    setStopStream: (fn) => {
+      stopStream = fn ?? null;
+    },
+    selectedPageFilePath,
+    selectedPageUrl,
+    setCurrentPageHasBrief
+  });
+  refreshPageBriefRef.current = () => {
+    void addPage.refreshCurrentPageBriefAvailability();
+  };
+  const showAddPageResultBanner = createMemo(() => addPageResultBanner() !== null);
+  const addPageResultBannerClass = createMemo(() => addPageResultBanner()?.kind === "success" ? "add-page-result-success" : "add-page-result-failed");
+  const addPageResultBannerMessage = createMemo(() => addPageResultBanner()?.message ?? "");
+  const showAddPageRetry = createMemo(() => addPageResultBanner()?.showRetry === true);
+  const showAddPageFixWithAiditor = createMemo(() => addPageResultBanner()?.showFixWithAiditor === true);
   runBootstrap();
   ensurePreviewProbePoll();
   function handleSnapshotShortcut() {
@@ -10114,6 +12340,41 @@ function aiditorConstructor(_props, refs) {
     });
   }
   refs.retryBootstrapBtn.onclick(() => runBootstrap());
+  addPage.bindAddPageRefs(refs);
+  refs.projectSettingsBtn.onclick(() => openProjectSettings());
+  refs.projectSettingsCloseBtn.onclick(() => closeProjectSettings());
+  refs.projectSettingsOverlay.onclick(({ event }) => {
+    if (event.target === event.currentTarget)
+      closeProjectSettings();
+  });
+  projectPlugins.bindProjectPluginsRefs(refs);
+  refs.projectPluginsPanel.oninput(({ event }) => {
+    const t = event.target;
+    if (t.classList.contains("project-local-name")) {
+      projectPlugins.setAddLocalPluginName(t.value);
+    } else if (t.classList.contains("project-local-package")) {
+      projectPlugins.setAddLocalPackageName(t.value);
+    } else if (t.classList.contains("project-local-path")) {
+      projectPlugins.setAddLocalPath(t.value);
+    }
+  });
+  refs.addPageResultBannerSlot.onclick(({ event }) => {
+    const target = event.target.closest("[data-add-page-retry], [data-add-page-fix]");
+    if (!target)
+      return;
+    const banner = addPageResultBanner();
+    if (!banner)
+      return;
+    if (target.hasAttribute("data-add-page-retry")) {
+      setAddPageResultBanner(null);
+      addPage.retryAddPage();
+      return;
+    }
+    if (target.hasAttribute("data-add-page-fix")) {
+      setAddPageResultBanner(null);
+      void addPage.openPreviewForRoute(banner.pageRoute);
+    }
+  });
   refs.pageRouteSelect.onchange(({ event }) => {
     const v = event.target.value;
     if (!v)
@@ -10353,11 +12614,25 @@ function aiditorConstructor(_props, refs) {
     if (btn.classList.contains("visual-annotation-attach")) {
       event.preventDefault();
       attachTargetPinId = draft.id;
-      tryJayRefExec(refs.visualAttachFileInput, (el) => el.click());
+      tryJayRefExec2(refs.visualAttachFileInput, (el) => el.click());
     }
   });
+  refs.visualAnnotationRows.annotationRow.onchange(({ event }) => {
+    const t = event.target;
+    const card = t.closest("[data-annotation-id]");
+    const id = card?.getAttribute("data-annotation-id");
+    if (!id)
+      return;
+    handleBindingUiEvent(t, id, updateVisualAnnotation);
+  });
   refs.visualAnnotationRows.annotationRow.onclick(({ event, viewState }) => {
-    const t = event.target.closest("button");
+    const raw = event.target;
+    if (raw.closest(".annotation-binding")) {
+      event.preventDefault();
+      handleBindingUiEvent(raw, viewState.id, updateVisualAnnotation);
+      return;
+    }
+    const t = raw.closest("button");
     if (!t)
       return;
     if (t.classList.contains("visual-attachment-remove-file")) {
@@ -10371,7 +12646,7 @@ function aiditorConstructor(_props, refs) {
     if (t.classList.contains("visual-annotation-attach")) {
       event.preventDefault();
       attachTargetPinId = viewState.id;
-      tryJayRefExec(refs.visualAttachFileInput, (el) => el.click());
+      tryJayRefExec2(refs.visualAttachFileInput, (el) => el.click());
       return;
     }
     if (t.classList.contains("visual-annotation-remove")) {
@@ -10408,7 +12683,7 @@ function aiditorConstructor(_props, refs) {
       setIsRunning(true);
       setVisualSubmitError("");
       let rootEl = null;
-      const gotRoot = tryJayRefExec(refs.previewCaptureRoot, (el) => {
+      const gotRoot = tryJayRefExec2(refs.previewCaptureRoot, (el) => {
         rootEl = el;
       });
       if (!gotRoot || !rootEl) {
@@ -10491,13 +12766,13 @@ function aiditorConstructor(_props, refs) {
     if (!previewIsSameOriginForCapture(previewSrc()))
       return;
     let rootEl = null;
-    tryJayRefExec(refs.previewCaptureRoot, (el) => {
+    tryJayRefExec2(refs.previewCaptureRoot, (el) => {
       rootEl = el;
     });
     if (!rootEl)
       return;
     let iframeEl = null;
-    tryJayRefExec(refs.previewIframe, (el) => {
+    tryJayRefExec2(refs.previewIframe, (el) => {
       iframeEl = el;
     });
     try {
@@ -10585,7 +12860,7 @@ function aiditorConstructor(_props, refs) {
     }
   }
   function ensureIframeShortcutForwarder() {
-    tryJayRefExec(refs.previewIframe, (fr) => {
+    tryJayRefExec2(refs.previewIframe, (fr) => {
       const iframe = fr;
       try {
         const doc = iframe.contentDocument;
@@ -10613,7 +12888,7 @@ function aiditorConstructor(_props, refs) {
     if (!src || !previewIsSameOriginForCapture(src))
       return;
     ensureIframeShortcutForwarder();
-    tryJayRefExec(refs.previewIframe, (fr) => {
+    tryJayRefExec2(refs.previewIframe, (fr) => {
       const iframe = fr;
       try {
         const win = iframe.contentWindow;
@@ -10644,7 +12919,7 @@ function aiditorConstructor(_props, refs) {
     recordingPreviewNavLog = [];
     queueMicrotask(tickPreviewIframeProbe);
   }
-  function tryJayRefExec(refObj, fn) {
+  function tryJayRefExec2(refObj, fn) {
     const r = refObj;
     if (typeof r?.exec$ !== "function")
       return false;
@@ -10673,13 +12948,13 @@ function aiditorConstructor(_props, refs) {
       normalizeRecordingPinsToVideoDurationIfNeeded(dur);
       setVideoDurationSec(dur);
       setVideoTimeLabel(`${formatClock(cur)} / ${formatClock(dur)}`);
-      tryJayRefExec(refs.videoTimeline, (inp) => {
+      tryJayRefExec2(refs.videoTimeline, (inp) => {
         inp.value = String(Math.round(cur / dur * 1e3));
       });
     }
   }
   function pauseVideoForAnnotationCapture() {
-    tryJayRefExec(refs.videoReviewPlayer, (el) => {
+    tryJayRefExec2(refs.videoReviewPlayer, (el) => {
       const v = el;
       if (!v.paused)
         v.pause();
@@ -10688,13 +12963,13 @@ function aiditorConstructor(_props, refs) {
   }
   function syncReviewTransportAfterAnnotation() {
     queueMicrotask(() => {
-      tryJayRefExec(refs.videoReviewPlayer, (el) => {
+      tryJayRefExec2(refs.videoReviewPlayer, (el) => {
         refreshVideoReviewTransport(el);
       });
     });
   }
   function seekVideoReviewToTimeAndPause(timeSec) {
-    tryJayRefExec(refs.videoReviewPlayer, (el) => {
+    tryJayRefExec2(refs.videoReviewPlayer, (el) => {
       const v = el;
       v.pause();
       let dur = effectiveVideoDuration(v);
@@ -10768,7 +13043,7 @@ function aiditorConstructor(_props, refs) {
           });
         }
       };
-      const wired = tryJayRefExec(refs.videoReviewPlayer, (el) => bindVideo(el)) || (() => {
+      const wired = tryJayRefExec2(refs.videoReviewPlayer, (el) => bindVideo(el)) || (() => {
         const q = document.querySelector("[data-aiditor-video-review]");
         if (q?.isConnected) {
           bindVideo(q);
@@ -10777,7 +13052,7 @@ function aiditorConstructor(_props, refs) {
         return false;
       })();
       if (wired) {
-        tryJayRefExec(refs.videoReviewBackdrop, (el) => {
+        tryJayRefExec2(refs.videoReviewBackdrop, (el) => {
           el.focus();
         });
         startWatchdog();
@@ -10921,7 +13196,7 @@ function aiditorConstructor(_props, refs) {
   }
   function currentVideoTimeForNewPin() {
     let t = 0;
-    tryJayRefExec(refs.videoReviewPlayer, (v) => {
+    tryJayRefExec2(refs.videoReviewPlayer, (v) => {
       t = v.currentTime;
     });
     return t;
@@ -10955,10 +13230,10 @@ function aiditorConstructor(_props, refs) {
     }
     let captureRoot = null;
     let videoEl = null;
-    tryJayRefExec(refs.videoReviewCaptureRoot, (r) => {
+    tryJayRefExec2(refs.videoReviewCaptureRoot, (r) => {
       captureRoot = r;
     });
-    tryJayRefExec(refs.videoReviewPlayer, (v) => {
+    tryJayRefExec2(refs.videoReviewPlayer, (v) => {
       videoEl = v;
     });
     if (!captureRoot || !videoEl) {
@@ -11038,6 +13313,79 @@ function aiditorConstructor(_props, refs) {
     event.stopPropagation();
     setChunks([]);
   });
+  refs.agentChatInput.oninput(({ event }) => {
+    setAgentChatMessage(event.target.value);
+  });
+  refs.agentChatInput.onkeydown(({ event }) => {
+    if (event.key !== "Enter" || event.shiftKey)
+      return;
+    event.preventDefault();
+    sendChatMessage();
+  });
+  refs.agentChatSendBtn.onclick(() => {
+    sendChatMessage();
+  });
+  function focusAgentChatInput() {
+    requestAnimationFrame(() => {
+      tryJayRefExec2(refs.agentChatInput, (el) => {
+        el.focus();
+      });
+    });
+  }
+  function handleAgentStreamChunk(chunk) {
+    if (chunk.type === "thinking" && chunk.text) {
+      appendAgentOutputChunk(chunk.text, "chunk chunk-thinking");
+    } else if (chunk.type === "chunk" && chunk.text) {
+      appendAgentOutputChunk(chunk.text);
+    } else if (chunk.type === "status" && chunk.message) {
+      appendAgentOutputChunk(chunk.message, "chunk chunk-status");
+    } else if (chunk.type === "tool" && chunk.name) {
+      const detail = chunk.text ? ` ${chunk.text}` : "";
+      const isFileOp = chunk.name === "Read" || chunk.name === "Write";
+      const fp = isFileOp && chunk.text ? chunk.text.split("\n")[0].trim() : "";
+      appendAgentOutputChunk(`> ${chunk.name}${detail}`, "chunk chunk-tool", fp, fp ? chunk.name : "");
+    } else if (chunk.type === "error" && chunk.message) {
+      appendAgentOutputChunk(chunk.message, "chunk chunk-error");
+    } else if (chunk.type === "result") {
+      const cost = chunk.cost ? ` ($${chunk.cost.toFixed(4)})` : "";
+      appendAgentOutputChunk(`Done${cost}`, "chunk chunk-result");
+    }
+  }
+  function finishAgentStreamRun() {
+    setIsRunning(false);
+    focusAgentChatInput();
+  }
+  function runAgentStream(notes2, options, streamOptions) {
+    stopStream?.();
+    if (streamOptions.clearOutput)
+      setChunks([]);
+    setIsRunning(true);
+    setBottomPanelCollapsed(false);
+    stopStream = submitAndStreamTask(notes2, options, {
+      onChunk: handleAgentStreamChunk,
+      onEnd: finishAgentStreamRun,
+      onError: (err) => {
+        appendAgentOutputChunk(err.message, "chunk chunk-error");
+        finishAgentStreamRun();
+      }
+    });
+  }
+  function sendChatMessage() {
+    if (isRunning())
+      return;
+    const text = agentChatMessage().trim();
+    if (!text)
+      return;
+    const route = selectedPageUrl() ?? "/";
+    const rendered = previewUrlBar().trim();
+    appendAgentOutputChunk(text, "chunk chunk-user", "", "", true);
+    setAgentChatMessage("");
+    runAgentStream(text, {
+      kind: "chat",
+      pageRoute: route,
+      renderedUrl: rendered
+    }, { clearOutput: false });
+  }
   refs.outputScroll.onclick(({ event }) => {
     const target = event.target;
     if (!target.classList.contains("file-link"))
@@ -11098,7 +13446,7 @@ function aiditorConstructor(_props, refs) {
     document.addEventListener("mouseup", onUp);
   });
   refs.freezeBtn.onclick(() => {
-    tryJayRefExec(refs.previewIframe, (fr) => {
+    tryJayRefExec2(refs.previewIframe, (fr) => {
       const iframe = fr;
       iframe.contentWindow?.postMessage({ type: "jay:requestFreeze" }, "*");
     });
@@ -11118,7 +13466,7 @@ function aiditorConstructor(_props, refs) {
         setVisualSubmitError("");
         setVideoRecordingNavLog([]);
         let rootEl = null;
-        const gotRoot = tryJayRefExec(refs.previewCaptureRoot, (r) => {
+        const gotRoot = tryJayRefExec2(refs.previewCaptureRoot, (r) => {
           rootEl = r;
         });
         if (!gotRoot || !rootEl) {
@@ -11317,6 +13665,14 @@ function aiditorConstructor(_props, refs) {
       }
     }
   });
+  refs.videoAnnotationRows.videoAnnotationRow.onchange(({ event }) => {
+    const t = event.target;
+    const card = t.closest("[data-annotation-id]");
+    const id = card?.getAttribute("data-annotation-id");
+    if (!id)
+      return;
+    handleBindingUiEvent(t, id, updateVideoAsVisual);
+  });
   refs.videoAnnotationRows.videoAnnotationRow.oninput(({ event }) => {
     const t = event.target;
     if (t.tagName !== "TEXTAREA" || !t.classList.contains("visual-annotation-instruction"))
@@ -11327,7 +13683,13 @@ function aiditorConstructor(_props, refs) {
     setVideoAnnotationInstruction(id, t.value);
   });
   refs.videoAnnotationRows.videoAnnotationRow.onclick(({ event, viewState }) => {
-    const t = event.target.closest("button");
+    const raw = event.target;
+    if (raw.closest(".annotation-binding")) {
+      event.preventDefault();
+      handleBindingUiEvent(raw, viewState.id, updateVideoAsVisual);
+      return;
+    }
+    const t = raw.closest("button");
     if (!t)
       return;
     if (t.classList.contains("visual-attachment-remove-file")) {
@@ -11341,7 +13703,7 @@ function aiditorConstructor(_props, refs) {
     if (t.classList.contains("visual-video-annotation-attach")) {
       event.preventDefault();
       attachVideoTargetPinId = viewState.id;
-      tryJayRefExec(refs.videoReviewAttachFileInput, (el) => el.click());
+      tryJayRefExec2(refs.videoReviewAttachFileInput, (el) => el.click());
       return;
     }
     if (t.classList.contains("visual-annotation-remove")) {
@@ -11362,7 +13724,7 @@ function aiditorConstructor(_props, refs) {
   });
   refs.videoTimeline.oninput(({ event }) => {
     const val = Number(event.target.value);
-    tryJayRefExec(refs.videoReviewPlayer, (el) => {
+    tryJayRefExec2(refs.videoReviewPlayer, (el) => {
       const v = el;
       let dur = effectiveVideoDuration(v);
       if (dur <= 0)
@@ -11388,7 +13750,7 @@ function aiditorConstructor(_props, refs) {
     seekVideoReviewToTimeAndPause(t);
   });
   refs.videoPlayPauseBtn.onclick(() => {
-    tryJayRefExec(refs.videoReviewPlayer, (el) => {
+    tryJayRefExec2(refs.videoReviewPlayer, (el) => {
       const v = el;
       if (v.paused)
         void v.play().catch(() => {
@@ -11413,7 +13775,7 @@ function aiditorConstructor(_props, refs) {
   refs.videoReviewBackdrop.onkeydown(({ event }) => {
     if (event.key === "Escape") {
       event.preventDefault();
-      tryJayRefExec(refs.videoReviewCloseBtn, (b) => b.click());
+      tryJayRefExec2(refs.videoReviewCloseBtn, (b) => b.click());
     }
   });
   refs.snapshotToolPointBtn.onclick(() => onSelectSnapshotTool("point"));
@@ -11454,7 +13816,7 @@ function aiditorConstructor(_props, refs) {
       return;
     const el = event.currentTarget;
     let imgEl = null;
-    tryJayRefExec(refs.snapshotImg, (img) => {
+    tryJayRefExec2(refs.snapshotImg, (img) => {
       imgEl = img;
     });
     if (!imgEl)
@@ -11524,7 +13886,7 @@ function aiditorConstructor(_props, refs) {
       return;
     const el = event.currentTarget;
     let imgEl = null;
-    tryJayRefExec(refs.snapshotImg, (img) => {
+    tryJayRefExec2(refs.snapshotImg, (img) => {
       imgEl = img;
     });
     if (!imgEl)
@@ -11568,6 +13930,14 @@ function aiditorConstructor(_props, refs) {
       }
     }
   });
+  refs.snapshotAnnotationItems.snapshotAnnotationRow.onchange(({ event }) => {
+    const t = event.target;
+    const card = t.closest("[data-annotation-id]");
+    const id = card?.getAttribute("data-annotation-id");
+    if (!id)
+      return;
+    handleBindingUiEvent(t, id, updateSnapshotAnnotation);
+  });
   refs.snapshotAnnotationItems.snapshotAnnotationRow.oninput(({ event }) => {
     const t = event.target;
     if (t.tagName !== "TEXTAREA" || !t.classList.contains("visual-annotation-instruction"))
@@ -11593,7 +13963,16 @@ function aiditorConstructor(_props, refs) {
     }
   });
   refs.snapshotAnnotationItems.snapshotAnnotationRow.onclick(({ event }) => {
-    const btn = event.target.closest("button");
+    const raw = event.target;
+    if (raw.closest(".annotation-binding")) {
+      event.preventDefault();
+      const card = raw.closest("[data-annotation-id]");
+      const id = card?.getAttribute("data-annotation-id");
+      if (id)
+        handleBindingUiEvent(raw, id, updateSnapshotAnnotation);
+      return;
+    }
+    const btn = raw.closest("button");
     if (!btn)
       return;
     if (btn.classList.contains("snapshot-annotation-remove")) {
@@ -11610,7 +13989,7 @@ function aiditorConstructor(_props, refs) {
       if (!id)
         return;
       snapshotAttachTargetPinId = id;
-      tryJayRefExec(refs.snapshotAttachFileInput, (inp) => inp.click());
+      tryJayRefExec2(refs.snapshotAttachFileInput, (inp) => inp.click());
       return;
     }
     if (btn.classList.contains("visual-attachment-remove-file")) {
@@ -11635,7 +14014,7 @@ function aiditorConstructor(_props, refs) {
   createEffect(() => {
     if (showSnapshotModal()) {
       requestAnimationFrame(() => {
-        tryJayRefExec(refs.snapshotBackdrop, (el) => el.focus());
+        tryJayRefExec2(refs.snapshotBackdrop, (el) => el.focus());
       });
     }
   });
@@ -11731,47 +14110,16 @@ function aiditorConstructor(_props, refs) {
     });
   }
   bindAiditorDocumentPasteCapture(onAiditorDocumentPasteCapture);
+  runPluginInstallAgent = (pluginName, installError) => {
+    const entry = getCatalogEntry(pluginName);
+    if (!entry)
+      return;
+    setShowProjectSettingsModal(false);
+    const notes2 = buildPluginInstallAgentNotes(entry, installError, projectDir() || "Jay project root (where jay-stack dev runs)");
+    startAgentStream(notes2, void 0);
+  };
   function startAgentStream(notes2, visual) {
-    stopStream?.();
-    setChunks([]);
-    setIsRunning(true);
-    setBottomPanelCollapsed(false);
-    const addChunk = (text, cssClass = "chunk", filePath = "", toolName = "") => {
-      setChunks((prev) => [...prev, { text, cssClass, filePath, toolName }]);
-      requestAnimationFrame(() => {
-        tryJayRefExec(refs.outputScroll, (el) => {
-          el.scrollTop = el.scrollHeight;
-        });
-      });
-    };
-    stopStream = submitAndStreamTask(notes2, visual, {
-      onChunk: (chunk) => {
-        if (chunk.type === "thinking" && chunk.text) {
-          addChunk(chunk.text, "chunk chunk-thinking");
-        } else if (chunk.type === "chunk" && chunk.text) {
-          addChunk(chunk.text);
-        } else if (chunk.type === "status" && chunk.message) {
-          addChunk(chunk.message, "chunk chunk-status");
-        } else if (chunk.type === "tool" && chunk.name) {
-          const detail = chunk.text ? ` ${chunk.text}` : "";
-          const isFileOp = chunk.name === "Read" || chunk.name === "Write";
-          const fp = isFileOp && chunk.text ? chunk.text.split("\n")[0].trim() : "";
-          addChunk(`> ${chunk.name}${detail}`, "chunk chunk-tool", fp, fp ? chunk.name : "");
-        } else if (chunk.type === "error" && chunk.message) {
-          addChunk(chunk.message, "chunk chunk-error");
-        } else if (chunk.type === "result") {
-          const cost = chunk.cost ? ` ($${chunk.cost.toFixed(4)})` : "";
-          addChunk(`Done${cost}`, "chunk chunk-result");
-        }
-      },
-      onEnd: () => {
-        setIsRunning(false);
-      },
-      onError: (err) => {
-        addChunk(err.message, "chunk chunk-error");
-        setIsRunning(false);
-      }
-    });
+    runAgentStream(notes2, visual, { clearOutput: true });
   }
   return {
     render: () => ({
@@ -11806,6 +14154,11 @@ function aiditorConstructor(_props, refs) {
       bottomPanelClass,
       bottomPanelToggleGlyph,
       showBottomPanelRunning,
+      agentChatMessage,
+      showAgentChatInput,
+      agentChatInputDisabled,
+      agentChatSendDisabled,
+      agentChatPlaceholder,
       showFilePreview,
       filePreviewPath,
       filePreviewContent,
@@ -11912,7 +14265,72 @@ function aiditorConstructor(_props, refs) {
       snapshotAnnotationItems,
       showSnapshotAnnotationsPanel,
       showSnapshotSubmitError,
-      snapshotSubmitError
+      snapshotSubmitError,
+      showAddPageComposer: addPage.showAddPageComposer,
+      addPageRoute: addPage.addPageRoute,
+      addPageContentMd: addPage.addPageContentMd,
+      addPageDesignMd: addPage.addPageDesignMd,
+      addPageRouteError: addPage.addPageRouteError,
+      showAddPageRouteError: addPage.showAddPageRouteError,
+      addPageComposerError: addPage.addPageComposerError,
+      showAddPageComposerError: addPage.showAddPageComposerError,
+      addPageUploadHint: addPage.addPageUploadHint,
+      showAddPageUploadHint: addPage.showAddPageUploadHint,
+      addPageIsDynamicRoute: addPage.addPageIsDynamicRoute,
+      addPageShowDesignHint: addPage.addPageShowDesignHint,
+      addPageCreateDisabled: addPage.addPageCreateDisabled,
+      addPageRunningHint: addPage.addPageRunningHint,
+      showAddPageRunningHint: addPage.showAddPageRunningHint,
+      addPageAttachmentRows: addPage.addPageAttachmentRows,
+      showAddPageAttachments: addPage.showAddPageAttachments,
+      showProjectSettingsModal,
+      showProjectSettingsPluginsPanel: projectPlugins.showPluginsPanel,
+      showProjectSettingsInstallZone: projectPlugins.showInstallZone,
+      showProjectSettingsInstalledZone: projectPlugins.showInstalledZone,
+      projectSettingsInstallRows: projectPlugins.availableInstallRows,
+      projectSettingsInstalledRows: projectPlugins.installedPluginRows,
+      showProjectSettingsPluginsError: projectPlugins.showPluginsPanelError,
+      showFixInstallWithAgent: projectPlugins.showFixInstallWithAgent,
+      fixInstallPluginName: projectPlugins.fixInstallPluginName,
+      projectSettingsPluginsError: projectPlugins.pluginsPanelError,
+      showProjectSettingsInstallProgress: projectPlugins.showInstallProgress,
+      projectSettingsInstallProgress: projectPlugins.installStepLabel,
+      showProjectSettingsWixConfigWarning: projectPlugins.showWixConfigWarning,
+      showProjectSettingsReloadPreview: projectPlugins.showReloadPreview,
+      showProjectLocalPluginForm: projectPlugins.showAddLocalPluginForm,
+      projectLocalPluginName: projectPlugins.addLocalPluginName,
+      projectLocalPackageName: projectPlugins.addLocalPackageName,
+      projectLocalPath: projectPlugins.addLocalPath,
+      showAddPagePluginsPanel: addPage.showAddPagePluginsPanel,
+      showAddPagePagePluginsZone: addPage.showAddPagePagePluginsZone,
+      addPagePluginPickerOptions: addPage.addPagePluginPickerOptions,
+      addPagePluginPickerValue: addPage.addPagePluginPickerValue,
+      showAddPageContractPicker: addPage.showAddPageContractPicker,
+      addPagePickerPluginLabel: addPage.addPagePickerPluginLabel,
+      addPageContractPickerRows: addPage.addPageContractPickerRows,
+      addPagePagePluginChips: addPage.addPagePagePluginChips,
+      showAddPageHasPagePluginChips: addPage.showAddPageHasPagePluginChips,
+      showAddPagePagePluginsEmptyHint: addPage.showAddPagePagePluginsEmptyHint,
+      showAddPageResultBanner,
+      addPageResultBannerClass,
+      addPageResultBannerMessage,
+      showAddPageRetry,
+      showAddPageFixWithAiditor,
+      showAddPageFromBriefBtn,
+      showBriefFillPopover: addPage.showBriefFillPopover,
+      briefFillContextNotes: addPage.briefFillContextNotes,
+      briefFillPopoverError: addPage.briefFillPopoverError,
+      showBriefFillPopoverError: addPage.showBriefFillPopoverError,
+      briefFillDisabled: addPage.briefFillDisabled,
+      briefFillInputDisabled: addPage.briefFillInputDisabled,
+      briefFillDropzoneClass: addPage.briefFillDropzoneClass,
+      addPageBriefFillGenerateDisabled: addPage.addPageBriefFillGenerateDisabled,
+      briefFillStatusHint: addPage.briefFillStatusHint,
+      showBriefFillStatusHint: addPage.showBriefFillStatusHint,
+      showBriefFillThumbnails: addPage.showBriefFillThumbnails,
+      addPageBriefFillThumbRows: addPage.addPageBriefFillThumbRows,
+      showSuggestedRouteBanner: addPage.showSuggestedRouteBanner,
+      suggestedRouteLabel: addPage.suggestedRouteLabel
     })
   };
 }