@jxsuite/studio 2.4.3 → 4.0.0

package/src/panels/ai-panel.ts

@@ -34,6 +34,10 @@ import { undo } from "../tabs/transact";
 import { activeTab } from "../workspace/workspace";
 import { setOpenAiKey } from "../services/ai-settings";
 import { hasAiCredentials } from "../services/ai-models";
+import { answerAsk, isAwaitingAnswer, pendingAsk, skipAsk } from "../services/ai-ask";
+import { activeImportRun, importRun } from "../services/import-run";
+import type { ImportBrief } from "../services/import-seed";
+import type { ImportBreakpointPolicy } from "../types";
 import { openPreferences } from "../settings/preferences-dialog";
 import { onCredentialsChanged } from "../settings/preferences-accounts";
 import { setDockCollapsed } from "../shell";
@@ -42,6 +46,7 @@ import { clearMarkdownCache } from "./ai-chat/chat-markdown";
 import { renderChatHeader, renderMessageList } from "./ai-chat/chat-view";
 import { createComposer } from "./ai-chat/composer";
 import { renderSessionsList } from "./ai-chat/sessions-view";
+import { buildMessageWithContext } from "./ai-chat/attached-context";
 import { setInspectorTab } from "./right-panel";
 
 import type { AnyCommand } from "../commands/registry";
@@ -109,6 +114,17 @@ function watchAssistant() {
       void last?.toolCalls?.length;
       void cs.status;
       void cs.error;
+      // The question is not chat state — it lives in `services/ai-ask.ts` — but it is drawn into
+      // This panel, so the same effect has to track it or a question would appear a frame late
+      // (and its ANSWER would never repaint the card at all).
+      void pendingAsk();
+      /* The run record, for the same reason: an import reports a line at a time from a store that
+         is not chat state, and its chip has to repaint on every one of them. Reading the ACTIVE
+         run tracks the whole record, so any field moving schedules a frame. */
+      const run = activeImportRun();
+      void run?.message;
+      void run?.log.length;
+      void run?.status;
       scheduleAiRender();
     });
   });
@@ -179,11 +195,23 @@ function renderSetupNotice(): TemplateResult {
 
 // ─── Sending ────────────────────────────────────────────────────────────────
 
-/** Send a message through the document assistant agent loop. */
+/**
+ * Send a message through the document assistant agent loop — or answer the question it is waiting
+ * on, which is the same keystroke and a different act.
+ *
+ * The answer must NOT become a user message. `toMessagesArray` serialises the array verbatim and a
+ * provider requires a `tool` reply to follow its `tool_calls` request; a user turn spliced between
+ * them is a 400. It travels as the tool result instead, and the question's own card renders it.
+ */
 async function handleAssistantSend(text: string) {
   if (!text.trim() || assistant.chatState.status === "streaming") {
     return;
   }
+  if (answerAsk(text.trim())) {
+    stickToBottom = true;
+    scheduleAiRender();
+    return;
+  }
   // A send always lands in the chat view, pinned to the newest message.
   view = "chat";
   stickToBottom = true;
@@ -264,6 +292,66 @@ export async function seedAssistantPrompt(text: string): Promise<void> {
   await handleAssistantSend(text);
 }
 
+/**
+ * Take the New Project Import form's brief and start the run as an assistant turn.
+ *
+ * The wizard closes without having created anything: `import_site` is `no-project` tiered and does
+ * the creating, so the window is still on the welcome screen when this runs — which is exactly the
+ * state the assistant is designed to be usable in (`specs/studio.md` §6).
+ *
+ * A fresh chat, deliberately. An import is the start of a project, and threading it onto whatever
+ * conversation the previous project left behind would put another project's document context in
+ * front of the model on its very first decision.
+ *
+ * The brief is already in `services/import-seed.ts` — the form that gathered it put it there, so
+ * `import_site` can read the destination later whether or not this hand-off is what started it.
+ *
+ * @param {ImportBrief} brief
+ */
+export async function revealImportHandoff(brief: ImportBrief): Promise<void> {
+  revealAssistant();
+  newChat();
+  await seedAssistantPrompt(buildImportTurn(brief));
+}
+
+/**
+ * The user message that opens an import turn.
+ *
+ * The parameters ride in an attached-context block — the composer's own convention for facts the
+ * model must see but the reader should not have to re-read (`ai-chat/attached-context.ts`). The
+ * body is the user's own brief, so the transcript reads as what they asked for rather than as a
+ * form submission.
+ *
+ * @param {ImportBrief} brief
+ * @returns {string}
+ */
+/** The breakpoint policy in a sentence the model can act on rather than a JSON blob. */
+function describeBreakpoints(policy: ImportBreakpointPolicy): string {
+  if (policy.mode === "all") {
+    return "keep every one the site declares";
+  }
+  if (policy.mode === "explicit") {
+    return `${(policy.widths ?? []).join(", ")} (rounding ${policy.rounding ?? "nearest"})`;
+  }
+  return `keep ${policy.count ?? 3}, evenly spaced (rounding ${policy.rounding ?? "nearest"})`;
+}
+
+export function buildImportTurn(brief: ImportBrief): string {
+  const body = brief.prompt.trim() || `Import ${brief.url} and get it ready for me to work on.`;
+  return buildMessageWithContext(body, [
+    {
+      detail:
+        `Import request from the New Project form — url: ${brief.url}, ` +
+        `destination: ${brief.directory}, depth: ${brief.depth}, ` +
+        `max pages: ${brief.maxPages}, AI component naming: ${brief.aiComponents}, ` +
+        `breakpoints: ${describeBreakpoints(brief.breakpoints)}. ` +
+        "Call import_site with the url; the destination and options above are already settled.",
+      kind: "import",
+      label: `Import ${brief.url}`,
+    },
+  ]);
+}
+
 // ─── Automation seeding (screenshot runner) ─────────────────────────────────
 
 /** A canned tool-call chip for {@link seedAssistantMessages}. */
@@ -331,6 +419,17 @@ export function revealAssistant(): void {
   setInspectorTab("assistant");
 }
 
+/**
+ * Whether a turn is suspended on the reader.
+ *
+ * Not the same as streaming and not the opposite of idle: no tokens are moving, but the loop is
+ * alive and holding a tool open. `assistant.stop` is enabled on the union of the two, because a
+ * turn waiting forever on a question nobody wants to answer is exactly what Stop is for.
+ */
+export function isAssistantWaiting(): boolean {
+  return isAwaitingAnswer();
+}
+
 /**
  * Whether a turn is in flight — the probe `commands/live-context.ts` declares as `aiStreaming` and
  * projects onto `ctx.ai.streaming`.
@@ -388,6 +487,7 @@ function activeSessionTitle(): string | null {
 // ─── Composer ───────────────────────────────────────────────────────────────
 
 const composer = createComposer({
+  isAwaiting: isAssistantWaiting,
   isStreaming: isAssistantStreaming,
   onOpenSettings: () => {
     void openPreferences("assistant");
@@ -533,7 +633,10 @@ export function assistantCommands(): AnyCommand[] {
       menus: ["palette"],
       group: "2_turn",
       requires: "a turn in flight",
-      enablement: (ctx: CommandContext) => ctx.ai.streaming,
+      /* The union, not just `streaming`. A turn suspended on `ask_user` moves no tokens, so
+         `ctx.ai.streaming` reads false — and that is precisely the turn a reader who does not want
+         to answer needs to end. */
+      enablement: (ctx: CommandContext) => ctx.ai.streaming || ctx.ai.waiting,
       run: stop,
     },
   ];
@@ -565,6 +668,17 @@ export function renderAiPanelTemplate(): TemplateResult {
         tokens: cs.tokenCount,
       })}
       ${renderMessageList({
+        ask: {
+          importRun,
+          onAnswer: (text) => {
+            void handleAssistantSend(text);
+          },
+          onSkip: () => {
+            skipAsk();
+            scheduleAiRender();
+          },
+          pendingId: pendingAsk()?.id ?? null,
+        },
         error: cs.error,
         listRef: onMessagesListRef,
         messages: cs.messages,

package/src/panels/frontmatter-fields.ts

@@ -14,7 +14,7 @@ import { renderFieldRow } from "../ui/field-row";
 import { spNumberField, spTextField } from "../ui/field-input";
 import { renderMediaPicker } from "../ui/media-picker";
 import { mutateUpdateFrontmatter, transactDoc } from "../tabs/transact";
-import { findContentTypeSchema } from "../utils/studio-utils";
+import { findContentTypeSchema, isMediaFormat } from "../utils/studio-utils";
 import { NULL_FORM_CONTEXT, getFormControl, referenceTarget } from "../ui/schema-form";
 import type { JsonSchema } from "../ui/schema-form";
 
@@ -233,7 +233,11 @@ export function renderFmField(
     });
   }
 
-  if (entry.format === "image") {
+  /* Both spellings. `"uri-reference"` is the one the SPEC uses and the one the content loader keys
+     its asset rewrite on (`rewriteEntryAssets`), so a schema written against the spec got a plain
+     text box here while the same field got a media picker in the properties panel — which reads
+     `inferInputType`, and that has always accepted it. */
+  if (isMediaFormat(entry.format)) {
     return renderFieldRow({
       hasValue: hasVal,
       label: displayLabel,

package/src/panels/navigator-panels.ts

@@ -79,7 +79,7 @@ export function registerNavigatorPanels(): void {
   // ── Off-rail: reachable by command and palette, no rail button ──────────────
   registerInsertPanel();
 
-  // ── The Bottom dock's tabs (§3.2 ⑪): Problems · Diff · Logic · Activity ──────
+  // ── The Bottom dock's tabs (§3.2 ⑪): Problems · Logic · Activity ────────────
   // Composed here, in the one place panel records are gathered, so the shell has ONE composition
   // Site rather than one per dock. Importing the module is also what attaches the dock to the
   // Shell's mount lifecycle — see its `registerShellSurface` call. Problems arrives with them and
@@ -110,12 +110,13 @@ export function navigatorPanelSet(): readonly PanelRecord[] {
  * The roster `panel.focus.*` is generated from: rail order first, then the rail-less Navigator
  * panels.
  *
- * Not `railPanelSet()`: Insert and State have no rail button and no chord, and they still need a
- * `Show …` command and a palette row, which is the whole point of `rail: false` (a surface
- * reachable by name, not by number).
+ * Not `railPanelSet()`: Insert and Languages have no rail button and no chord, and they still need
+ * a `Show …` command and a palette row, which is the whole point of `rail: false` (a surface
+ * reachable by name, not by number). State used to be the third of them and is gone: its editor is
+ * the Data panel's now, so there is no second record to roster.
  *
- * The Bottom dock's four tabs are deliberately absent — Problems as of this change, and Diff, Logic
- * and Activity all along. Each is `rail: false` AND hosted there, so each is addressed by
+ * The Bottom dock's three tabs are deliberately absent — Problems as of this change, and Logic and
+ * Activity all along. Each is `rail: false` AND hosted there, so each is addressed by
  * `view.setBottomTab`: one verb per surface, and the dock's own strip is how a human picks between
  * them. That is also why the filter here is by DOCK and not merely by `rail`, and why Problems
  * leaving the rail removed `panel.focus.problems` rather than demoting it to a chordless row.

package/src/panels/properties-panel.ts

@@ -49,7 +49,13 @@ import { renderFieldRow, renderKvRow } from "../ui/field-row";
 import type { FieldProvenance } from "./provenance";
 import { renderDynamicSlot, slotMode } from "../ui/dynamic-slot";
 import { spTextArea, spTextField } from "../ui/field-input";
-import { attrLabel, camelToLabel, inferInputType, parseCemType } from "../utils/studio-utils";
+import {
+  attrLabel,
+  camelToLabel,
+  inferInputType,
+  isMediaFormat,
+  parseCemType,
+} from "../utils/studio-utils";
 import { classifyHref, composeHref } from "../utils/link-target";
 import type { LinkKind } from "../utils/link-target";
 import {
@@ -274,7 +280,7 @@ function renderComponentPropsFieldsTemplate(
       /** @type {ReturnType<typeof setTimeout> | undefined} */
       let debounce: ReturnType<typeof setTimeout> | undefined;
       let widgetTpl;
-      if (prop.format === "image") {
+      if (isMediaFormat(prop.format)) {
         widgetTpl = renderMediaPicker(prop.name, staticVal, onChange);
       } else if (prop.format === "color") {
         widgetTpl = renderColorSelector(prop.name, staticVal, onChange);

package/src/panels/seo-modal.ts

@@ -24,8 +24,7 @@
 
 import { html, nothing } from "lit-html";
 import { activeRegistry } from "../commands/active-registry";
-import { loopbackAssetSrc } from "../canvas/canvas-origin";
-import { previewAssetSrc } from "../canvas/content-assets";
+import { previewAssetSrc } from "../canvas/asset-refs";
 import { renderFieldRow } from "../ui/field-row";
 import { renderMediaPicker } from "../ui/media-picker";
 import { renderProvenanceChip } from "./provenance";
@@ -140,9 +139,9 @@ function serpCard(preview: SeoPreview): TemplateResult {
 /**
  * The mock social card.
  *
- * The image is resolved the same way every other image in the studio chrome is —
- * `loopbackAssetSrc(previewAssetSrc(…))` — so a content-relative `./images/hero.jpg` previews at
- * its asset-mount URL while the authored ref stays exactly as written.
+ * The image is resolved the same way every other image in the studio chrome is — `previewAssetSrc`
+ * — so a content-relative `./images/hero.jpg` previews at its asset-mount URL while the authored
+ * ref stays exactly as written.
  */
 function socialCard(preview: SeoPreview): TemplateResult {
   const image = seoField(preview, "og:image").value.trim();
@@ -152,7 +151,7 @@ function socialCard(preview: SeoPreview): TemplateResult {
       <div class="seo-social-media">
         ${
           image
-            ? html`<img src=${loopbackAssetSrc(previewAssetSrc(image))} alt="" />`
+            ? html`<img src=${previewAssetSrc(image)} alt="" />`
             : html`<span class="seo-unset">No image</span>`
         }
       </div>