@jxsuite/studio 1.2.0 → 1.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jxsuite/studio",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "Jx Studio — visual builder for Jx documents",
   "license": "MIT",
   "repository": {

package/src/panels/ai-panel.ts

@@ -21,7 +21,7 @@ import type { TemplateResult } from "lit-html";
 import { getPlatform } from "../platform";
 import { effect, effectScope } from "../reactivity";
 import { createDocumentAssistant } from "../services/document-assistant";
-import { hasOpenAiKey } from "../services/ai-settings";
+import { hasOpenAiKey, setOpenAiKey } from "../services/ai-settings";
 import { fetchAvailableModels, isManagedProxy, isProxyConfigured } from "../services/ai-models";
 import { createAiCredentialsForm } from "../ui/ai-credentials-form";
 import { clearMarkdownCache } from "./ai-chat/chat-markdown";
@@ -263,6 +263,58 @@ export async function seedAssistantPrompt(text: string): Promise<void> {
   await handleAssistantSend(text);
 }
 
+// ─── Automation seeding (screenshot runner) ─────────────────────────────────
+
+/** A canned tool-call chip for {@link seedAssistantMessages}. */
+export interface SeededToolCall {
+  name: string;
+  /** JSON-encoded arguments, e.g. `{"path":["children",0],"text":"…"}`. */
+  arguments: string;
+}
+
+/** A canned transcript entry for {@link seedAssistantMessages}. */
+export interface SeededAssistantMessage {
+  role: "user" | "assistant";
+  content: string;
+  toolCalls?: SeededToolCall[];
+}
+
+let seededCount = 0;
+
+/**
+ * Automation-only seam (scripts/screenshots): stage a canned conversation without ever invoking a
+ * model. Stores an inert demo key so the key gate opens (localStorage-only on the dev server — no
+ * request fires), switches to the chat view, and pushes fully-formed messages straight into the
+ * reactive chat state — the same path session restore uses — so the panel repaints through its
+ * normal watcher.
+ */
+export function seedAssistantMessages(messages: SeededAssistantMessage[]): void {
+  setOpenAiKey("sk-demo");
+  keyEditing = false;
+  view = "chat";
+  stickToBottom = true;
+  for (const msg of messages) {
+    seededCount += 1;
+    const seq = seededCount;
+    assistant.chatState.messages.push({
+      content: msg.content,
+      id: `seeded_${seq}`,
+      role: msg.role,
+      timestamp: seq,
+      ...(msg.toolCalls
+        ? {
+            toolCalls: msg.toolCalls.map((tc, i) => ({
+              arguments: tc.arguments,
+              id: `seeded_${seq}_tc${i}`,
+              name: tc.name,
+            })),
+          }
+        : {}),
+    });
+  }
+  scheduleAiRender();
+}
+
 // ─── Controls ─────────────────────────────────────────────────────────────────
 
 function stop() {

package/src/platforms/cloud.ts

@@ -334,7 +334,9 @@ export function createCloudPlatform(project: CloudProject | null): StudioPlatfor
      * {kind:"git"} notices this handler ignores.
      */
     subscribeFileEvents(handler: (events: FsEvent[]) => void) {
-      if (typeof WebSocket === "undefined" || typeof location === "undefined") {
+      // No project means an empty base, so the bare `/events` URL hits no gateway route.
+      // That fails in a reconnect loop; mirror `collab`'s guard and degrade to no-op on the hub.
+      if (!project || typeof WebSocket === "undefined" || typeof location === "undefined") {
         return () => {};
       }
       let socket: WebSocket | null = null;

package/src/project-list.ts

@@ -36,3 +36,8 @@ export function getProjectList(): ProjectListEntry[] {
 export function resetProjectList(): void {
   cache = [];
 }
+
+/** Seed seam for tests and the screenshot automation hook (staged catalogues). */
+export function seedProjectList(entries: ProjectListEntry[]): void {
+  cache = entries;
+}

package/src/publish/publish-panel.ts

@@ -339,6 +339,23 @@ function render(): void {
   }
 }
 
+/**
+ * Automation-only seam (scripts/screenshots): open the modal directly in its connected state with a
+ * canned deployment, bypassing {@link loadConnection} so no Cloudflare request ever fires. The
+ * active project's `build.deploy` block still supplies the connected project/URL line.
+ */
+export function seedPublishConnected(options: {
+  accountId?: string;
+  deployment: PagesDeploymentInfo;
+}): void {
+  _connection = { accountId: options.accountId ?? "demo-account", connected: true };
+  _accounts = [];
+  _deployment = options.deployment;
+  _error = "";
+  _busy = false;
+  render();
+}
+
 /** Open the publish modal for the active project. */
 export function openPublishPanel(): void {
   const config = currentConfig();

package/src/services/automation.ts

@@ -10,18 +10,30 @@
  */
 
 import { renderOnly, updateUi } from "../store";
-import { activeTab, workspace } from "../workspace/workspace";
+import { setProjectState } from "../state";
+import { seedProjectList } from "../project-list";
+import { activeTab, closeAllTabs, workspace } from "../workspace/workspace";
+import type { ProjectListEntry } from "../types";
 import { applyPanelCollapse, view } from "../view";
 import { setEditZoom as applyEditZoomLevel } from "../canvas/canvas-utils";
+import { collabState } from "../collab/collab-state";
+import type { PeerPresence } from "../collab/collab-state";
+import type { SeededAssistantMessage } from "../panels/ai-panel";
+import type { PagesDeploymentInfo } from "../publish/pages-service";
 import type { JxPath } from "../state";
 
 /** Callbacks injected from studio.ts (module-local helpers or imports kept out of this module). */
 export interface AutomationDeps {
   getCanvasMode: () => string;
   openBrowseModal: () => void;
+  openConnectorGrid: (connection: string | undefined, table: string) => void;
   openNewProjectModal: () => void;
+  openQuickSearchPalette: () => void;
+  openSettingsModal: (section?: string) => void;
   render: () => void;
   renderActivityBar: () => void;
+  seedAssistantMessages: (messages: SeededAssistantMessage[]) => void;
+  seedPublishConnected: (options: { accountId?: string; deployment: PagesDeploymentInfo }) => void;
   setCanvasMode: (mode: string) => void;
   statusMessage: (text: string) => void;
 }
@@ -30,7 +42,14 @@ export interface AutomationApi {
   editDef: (defName: string) => void;
   editFunction: (path: JxPath, eventKey: string) => void;
   openBrowse: () => void;
+  openDataGrid: (options: { connection?: string; table: string }) => void;
   openNewProject: () => void;
+  openQuickSearch: () => void;
+  openSettings: (section?: string) => void;
+  seedAssistant: (options: { messages: SeededAssistantMessage[] }) => void;
+  seedCollab: (options: { peers: PeerPresence[] }) => void;
+  seedPublish: (options: { accountId?: string; deployment: PagesDeploymentInfo }) => void;
+  showWelcome: (options?: { projects?: ProjectListEntry[] }) => void;
   getState: () => {
     activeTabId: string | null;
     canvasMode: string;
@@ -66,9 +85,56 @@ export function createAutomationApi(deps: AutomationDeps): AutomationApi {
     openBrowse() {
       deps.openBrowseModal();
     },
+    openDataGrid(options: { connection?: string; table: string }) {
+      deps.openConnectorGrid(options.connection, options.table);
+    },
     openNewProject() {
       deps.openNewProjectModal();
     },
+    openQuickSearch() {
+      deps.openQuickSearchPalette();
+    },
+    openSettings(section?: string) {
+      deps.openSettingsModal(section);
+    },
+    seedAssistant(options: { messages: SeededAssistantMessage[] }) {
+      deps.seedAssistantMessages(options.messages);
+    },
+    seedCollab(options: { peers: PeerPresence[] }) {
+      // Stage a live co-editing session on the active tab: the toolbar's presence chips and the
+      // Canvas peer-selection boxes both read this same reactive store.
+      const tab = activeTab.value;
+      if (!tab) {
+        return;
+      }
+      const state = collabState(tab);
+      state.status = "synced";
+      state.active = true;
+      state.peers = options.peers.map((peer) => ({
+        ...peer,
+        state: {
+          ...peer.state,
+          focusedPath: peer.state.focusedPath ?? tab.documentPath,
+        },
+      }));
+      deps.render();
+    },
+    seedPublish(options: { accountId?: string; deployment: PagesDeploymentInfo }) {
+      deps.seedPublishConnected(options);
+    },
+    showWelcome(options?: { projects?: ProjectListEntry[] }) {
+      // The devserver platform auto-opens the repo-root project on boot; the welcome
+      // Screen only renders with no project and no tabs, so stage that state directly.
+      // A staged catalogue replaces the real one (screenshots must not leak local paths).
+      closeAllTabs();
+      setProjectState(null);
+      if (options?.projects) {
+        seedProjectList(options.projects);
+      }
+      view.chatPanelCollapsed = true;
+      applyPanelCollapse();
+      deps.render();
+    },
     getState() {
       return {
         activeTabId: workspace.activeTabId,

package/src/settings/settings-modal.ts

@@ -106,11 +106,11 @@ let _activeSection = "general";
 
 let _contentEl: HTMLElement | null = null;
 
-export function openSettingsModal() {
+export function openSettingsModal(section?: string) {
   if (_handle) {
     return;
   }
-  _activeSection = "general";
+  _activeSection = section ?? "general";
   renderModal();
   // Refresh descriptor-contributed sections (cached payloads make this cheap) and rerender the
   // Nav once they land. Lazy import breaks the settings-modal ↔ extension-sections module cycle.

package/src/studio.ts

@@ -96,6 +96,9 @@ import { renderHeadTemplate } from "./panels/head-panel";
 import { exportCemManifest as _exportCemManifest } from "./services/cem-export";
 import { installAutomationHook } from "./services/automation";
 import { openBrowseModal } from "./browse/browse-modal";
+import { seedAssistantMessages } from "./panels/ai-panel";
+import { seedPublishConnected } from "./publish/publish-panel";
+import { openConnectorGrid } from "./grid/grid-open";
 
 import { getPlatform, hasPlatform, registerPlatform } from "./platform";
 import { parseMediaEntries } from "./utils/canvas-media";
@@ -145,7 +148,8 @@ import {
   renderBlockActionBar,
 } from "./panels/block-action-bar";
 import { initCssData } from "./panels/style-utils";
-import { initQuickSearch } from "./panels/quick-search";
+import { initQuickSearch, openQuickSearch } from "./panels/quick-search";
+import { openSettingsModal } from "./settings/settings-modal";
 import { hydrateAccountStatus } from "./account-status";
 import { hydrateProjectList } from "./project-list";
 import { addRecentProject, hydrateRecentProjects, removeRecentProject } from "./recent-projects";
@@ -391,9 +395,14 @@ if (!hasPlatform()) {
 installAutomationHook({
   getCanvasMode,
   openBrowseModal,
+  openConnectorGrid,
   openNewProjectModal,
+  openQuickSearchPalette: openQuickSearch,
+  openSettingsModal,
   render,
   renderActivityBar,
+  seedAssistantMessages,
+  seedPublishConnected,
   setCanvasMode,
   statusMessage,
 });

package/src/ui/formula-catalog.ts

@@ -293,7 +293,10 @@ const OPERATOR_META: Record<string, OperatorMeta> = {
 export function operatorEntries(): FormulaCatalogEntry[] {
   const out: FormulaCatalogEntry[] = [];
   for (const op of BLESSED_OPERATORS) {
-    const meta = OPERATOR_META[op];
+    // Own-property lookup only: a bare index would resolve inherited Object.prototype members for
+    // Ops like "toLocaleString", yielding a bogus meta whose undefined group/description breaks
+    // The palette's substring filter.
+    const meta = Object.hasOwn(OPERATOR_META, op) ? OPERATOR_META[op] : undefined;
     if (meta) {
       out.push({
         description: meta.description,