@jxsuite/studio 8.1.0 → 10.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jxsuite/studio",
-  "version": "8.1.0",
+  "version": "10.0.0",
   "description": "Jx Studio — visual builder for Jx documents",
   "license": "MIT",
   "repository": {
@@ -31,7 +31,6 @@
     "./platform": "./src/platform.ts",
     "./types": "./src/types.ts",
     "./base64": "./src/utils/base64.ts",
-    "./directory-picker": "./src/services/directory-picker.ts",
     "./import-client": "./src/services/import-client.ts",
     "./github-auth": "./src/github/github-auth.ts",
     "./github-auth-status": "./src/github/github-auth-status.ts",
@@ -61,16 +60,16 @@
   "dependencies": {
     "@atlaskit/pragmatic-drag-and-drop": "^4.0.0",
     "@atlaskit/pragmatic-drag-and-drop-hitbox": "^3.0.0",
-    "@jxsuite/ai": "^0.40.0",
-    "@jxsuite/collab": "^0.11.2",
-    "@jxsuite/create": "^1.4.0",
-    "@jxsuite/formulas": "^0.0.24",
-    "@jxsuite/markup": "^1.0.0",
-    "@jxsuite/protocol": "^4.0.0",
-    "@jxsuite/runtime": "^5.2.0",
-    "@jxsuite/schema": "^4.0.0",
-    "@jxsuite/site": "^2.2.0",
-    "@jxsuite/ui": "^0.8.0",
+    "@jxsuite/ai": "^0.41.1",
+    "@jxsuite/collab": "^0.11.4",
+    "@jxsuite/create": "^1.5.0",
+    "@jxsuite/formulas": "^0.0.26",
+    "@jxsuite/markup": "^1.0.2",
+    "@jxsuite/protocol": "^6.0.0",
+    "@jxsuite/runtime": "^6.0.1",
+    "@jxsuite/schema": "^5.0.0",
+    "@jxsuite/site": "^2.2.2",
+    "@jxsuite/ui": "^0.8.2",
     "@vue/reactivity": "3.5.44",
     "ajv": "^8.20.0",
     "ajv-formats": "^3.0.1",

package/src/canvas/iframe-editable-root.ts

@@ -445,8 +445,9 @@ export function startEditableRoot(
    * something no caret can enter, so the caret went on blinking in the block clicked BEFORE, with
    * the component now selected in the editor and every keystroke still typed into that block.
    */
-  const onPointerDownCapture = (e: Event) => {
-    if (!editingAllowed()) {
+  const onPointerDownCapture = (e: PointerEvent) => {
+    // A secondary press asks for the element menu, not an edit: see `onMouseDownCapture`.
+    if (!editingAllowed() || e.button === 2) {
       return;
     }
     const target = e.target instanceof Element ? e.target : null;
@@ -478,6 +479,33 @@ export function startEditableRoot(
     }
   };
 
+  /**
+   * A secondary press outside the active block selects, it never starts an edit.
+   *
+   * The whole canvas is one `contenteditable`, and a right-button press places the caret where it
+   * lands, as a left one does. That caret activated the block through `selectionchange`, so every
+   * right-click on a block also entered inline editing: the bridge's edit start ran ahead of the
+   * menu's mount in the same task, which held the element menu back by hundreds of milliseconds on
+   * a real page, and the block was left in edit mode after the menu closed. Cancelling the press's
+   * default keeps the caret where it was; `contextmenu` still fires, so the menu is unaffected. The
+   * block being edited keeps its native press, because the caret placed there is what the native
+   * spelling and edit menu reads. A right-click elsewhere leaves that block, as a left click
+   * would.
+   */
+  const onMouseDownCapture = (e: MouseEvent) => {
+    if (e.button !== 2 || !editingAllowed()) {
+      return;
+    }
+    if (activeEl && e.target instanceof Node && activeEl.contains(e.target)) {
+      return;
+    }
+    e.preventDefault();
+    if (activeEl) {
+      deactivate();
+      doc.getSelection()?.removeAllRanges();
+    }
+  };
+
   /**
    * Reordering is the block action bar's drag handle, full stop. A `contenteditable` region is
    * natively draggable by its text, which would both fight text selection and move content behind
@@ -501,6 +529,7 @@ export function startEditableRoot(
   container.addEventListener("compositionend", onCompositionEnd);
   container.addEventListener("dragstart", onDragStart);
   doc.addEventListener("pointerdown", onPointerDownCapture, true);
+  doc.addEventListener("mousedown", onMouseDownCapture, true);
 
   return {
     capture: () => captureDocSelection(container, deps.isEditableBlock),
@@ -542,6 +571,7 @@ export function startEditableRoot(
       container.removeEventListener("compositionend", onCompositionEnd);
       container.removeEventListener("dragstart", onDragStart);
       doc.removeEventListener("pointerdown", onPointerDownCapture, true);
+      doc.removeEventListener("mousedown", onMouseDownCapture, true);
       // Deactivating commits, so the pending tick is cancelled rather than fired.
       deactivate();
     },

package/src/collab/collab-session.ts

@@ -26,7 +26,7 @@ import { jsonClone } from "../utils/studio-utils";
 import { cloneSelection } from "../tabs/selection";
 import {
   applyExternalDocOps,
-  isBatching,
+  isBatched,
   setBatchEndNotifier,
   setHistoryDelegate,
   setTransactGate,
@@ -318,7 +318,11 @@ function onBatchEnd(tab: Tab): void {
 
 function publishRecord(session: ActiveSession, record: TransactionRecord): void {
   const forward = record.docOps.map((pair) => pair.forward);
-  if (isBatching()) {
+  /* Buffered only while THIS tab has a lane segment open, which means the transaction just
+     observed was the lane owner's: anyone else's write closes the segment before it runs, and the
+     close flushes the buffer, so the Y document receives the owner's ops before the other writer's
+     and in local order. */
+  if (isBatched(session.tab)) {
     session.batchOps ??= [];
     if (forward.length === 0) {
       session.batchNeedsDiff = true;

package/src/commands/context.ts

@@ -31,6 +31,9 @@ export const CAPABILITIES = [
   "gitClone",
   "importSite",
   "openProjectInNewWindow",
+  /* Open Project's gate: a native dialog or the cloud's repository picker. A dev-server window opens
+     its project from `?project=`, so the command is not offered there. */
+  "openProject",
   "dataRows",
   "windowControls",
   "findReferences",
@@ -339,6 +342,7 @@ export function emptyContext(): CommandContext {
       gitClone: false,
       importSite: false,
       openProjectInNewWindow: false,
+      openProject: false,
       dataRows: false,
       windowControls: false,
       findReferences: false,

package/src/commands/defaults.ts

@@ -563,6 +563,8 @@ export function defaultCommands(deps: CommandDeps): AnyCommand[] {
       keybinding: "mod+o",
       menus: ["commandbar/overflow", "statusbar/project", "palette"],
       group: "1_file",
+      when: (ctx: CommandContext) => ctx.capability.openProject,
+      requires: "a host that can open a project from a dialog",
       run: () => deps.openProject(),
     },
     {

package/src/commands/live-context.ts

@@ -38,6 +38,7 @@ import { collabState } from "../collab/collab-state";
 
 import { canvasViewForMode, editorKindForMode, emptyContext } from "./context";
 import type { CommandContext } from "./context";
+import { canOpenProject } from "../platform";
 import type { StudioPlatform } from "../types";
 
 /** Elements that own the keyboard while focused. Matches the old listener's target test exactly. */
@@ -95,6 +96,7 @@ function capabilities(platform: StudioPlatform | null): CommandContext["capabili
     findReferences: has("findReferences"),
     gitClone: has("gitClone"),
     importSite: has("importSite"),
+    openProject: canOpenProject(platform),
     openProjectInNewWindow: has("openProjectInNewWindow"),
     readFileBytes: has("readFileBytes"),
     publish: has("cfApi"),

package/src/files/files.ts

@@ -39,7 +39,7 @@ import { errorMessage } from "@jxsuite/schema/parse";
 import { localeLabel, localeOfPath, resolveI18n } from "@jxsuite/schema/locale";
 import { showPromptDialog } from "../ui/layers";
 import { projectState, requireProjectState, setProjectState } from "../store";
-import { getPlatform } from "../platform";
+import { canOpenProject, getPlatform } from "../platform";
 import { disarmPreviewOverlay } from "../preview/preview-overlay";
 import { notify } from "../services/notify";
 import { loadComponentRegistry } from "./components";
@@ -309,7 +309,8 @@ export async function openProject({
 }): Promise<boolean> {
   try {
     const platform = getPlatform();
-    const result = await platform.openProject();
+    // The command is gated on the capability, so a host without the member never gets here.
+    const result = await platform.openProject?.();
     if (!result) {
       return false;
     } // User cancelled
@@ -864,7 +865,9 @@ function filesPanelValues(): FilesPanelValues {
   }
   if (!projectState.isSiteProject && projectState.projectRoot === ".") {
     _fileRows = [];
-    const values: FilesPanelValues = { ...emptyFilesPanelValues(), view: "welcome" };
+    // A host with no Open Project (the dev server) is told how its windows DO open one instead.
+    const view = canOpenProject(getPlatform()) ? "welcome" : "address";
+    const values: FilesPanelValues = { ...emptyFilesPanelValues(), view };
     _lastValues = values;
     return values;
   }

package/src/format/format-host.ts

@@ -217,7 +217,7 @@ async function shareProjectSchemas(
  */
 export function refreshExtensionUi(platform: Pick<StudioPlatform, "fetchProjectSchemas">): void {
   void shareProjectSchemas(platform);
-  // `installed` and `bundled` are per-project facts, so an install or a project switch can move
+  // `installed` is a per-project fact, so an install or a project switch can move
   // Them even when the shipped half has not changed.
   void loadExtensionCatalog();
   void import("../settings/extension-sections")

package/src/github/github-auth-status.ts

@@ -21,8 +21,8 @@ const STORAGE_KEY = "jx_github_token";
 /**
  * The GitHub OAuth app every Jx sign-in authorizes against: the browser's device flow in
  * `github-auth.ts`, and the desktop launcher's RFC 8252 loopback redirect
- * (`packages/desktop/src/github-signin.ts`). Here, in the module with no UI dependency, because the
- * launcher's main process imports it too.
+ * (`packages/desktop/src/backend/github-signin.ts`). Here, in the module with no UI dependency,
+ * because the launcher's main process imports it too.
  */
 export const GITHUB_OAUTH_CLIENT_ID = "Ov23liYVlMFpgjOEPXJH";
 

package/src/media/media-library.ts

@@ -67,6 +67,7 @@ import { dirName, previewFileSrc } from "../files/media-paths";
 import { forgetVersions } from "../files/asset-versions";
 import { loadMediaUsages, peekMediaUsages } from "../files/media-usage";
 import { onProjectMediaChange, projectMediaFiles } from "../ui/media-picker";
+import { openMenu } from "../surfaces/menu";
 import { openMediaTab } from "./media-open";
 import { factsLine, mediaStageFor, specimenOf, usageOf } from "./media-pane";
 import {
@@ -93,6 +94,7 @@ import type {
   MediaTileRow,
 } from "../surfaces/media-library";
 import type { MediaPickDialogHandle } from "../surfaces/media-pick-dialog";
+import type { MenuHandle, MenuRowProjection } from "../surfaces/menu";
 import type { PreviewObserver } from "../browse/library-preview";
 import type { Tab } from "../tabs/tab";
 import type { CanvasSurface } from "../canvas/canvas-surface";
@@ -788,11 +790,11 @@ function actionsFor(mount: LibraryMount) {
         activate(mount, selected);
       }
     },
+    contextMenu: (file: string, x: number, y: number) => showTileMenu(mount, file, x, y),
     copyRef: () => {
       const entry = selectedEntry(mount);
-      // `navigator.clipboard` is [SecureContext]: a plain-http host has none, whatever lib.dom says.
-      if (entry && "clipboard" in navigator) {
-        void navigator.clipboard.writeText(entry.ref);
+      if (entry) {
+        copySiteUrl(entry);
       }
     },
     dragOut: () => {
@@ -913,6 +915,74 @@ function actionsFor(mount: LibraryMount) {
 }
 
 /** Enter or a double-click: open the viewer, or in pick mode, use the file. */
+/** Put a file's site URL on the clipboard. */
+function copySiteUrl(entry: ProjectMediaFile): void {
+  // `navigator.clipboard` is [SecureContext]: a plain-http host has none, whatever lib.dom says.
+  if ("clipboard" in navigator) {
+    void navigator.clipboard.writeText(entry.ref);
+  }
+}
+
+/**
+ * The tile menu that is up, if any. One handle, because only one can be open: a second kit menu
+ * opened over the first is how two of them light-dismiss each other.
+ */
+let _tileMenu: MenuHandle | null = null;
+
+/**
+ * A right-click on a tile: select it, then offer the detail pane's actions at the pointer.
+ *
+ * The same four verbs as the detail pane's (studio.md §22.6), in the order the pane draws them, and
+ * each calls what the pane's control calls, so the menu cannot drift from the pane. Selecting first
+ * is what makes the pane describe the file the menu acts on, as a right-click on a row does in the
+ * Content workspace.
+ */
+function showTileMenu(mount: LibraryMount, file: string, x: number, y: number): void {
+  select(mount, file);
+  const entry = selectedEntry(mount);
+  if (!entry) {
+    return;
+  }
+  _tileMenu?.close();
+  const row = (
+    id: string,
+    title: string,
+    run: () => void,
+    extra: Partial<MenuRowProjection> = {},
+  ): MenuRowProjection => ({
+    destructive: false,
+    disabled: false,
+    dividerAbove: false,
+    id,
+    run,
+    title,
+    ...extra,
+  });
+  _tileMenu = openMenu({
+    label: `${entry.name} actions`,
+    onClosed: (handle) => {
+      if (_tileMenu === handle) {
+        _tileMenu = null;
+      }
+    },
+    origin: { x, y },
+    region: "media-tile",
+    rows: [
+      row("open", "Open in Viewer", () => openMediaTab(file)),
+      row("copy-url", "Copy Site URL", () => copySiteUrl(entry)),
+      row("replace", "Replace…", () => requestMediaReplace(file), { dividerAbove: true }),
+      row(
+        "delete",
+        "Delete",
+        () => {
+          void deleteMediaFile(file);
+        },
+        { destructive: true, dividerAbove: true },
+      ),
+    ],
+  });
+}
+
 function activate(mount: LibraryMount, file: string): void {
   if (mount.mode === "pick") {
     const entry = selectedEntry(mount);

package/src/new-project/new-project-modal.ts

@@ -346,10 +346,7 @@ function finish(result: { root: string; config: ProjectConfig } | null) {
  * runs this same sequence itself.
  */
 async function finishCreated(result: { root: string; config: ProjectConfig }) {
-  const { adopted, error, openedElsewhere } = await adoptCreatedProject(result.root, {
-    // The wizard runs outside the agent loop — there is never a batch to flush and re-anchor.
-    getTab: () => null,
-  });
+  const { adopted, error, openedElsewhere } = await adoptCreatedProject(result.root);
   if (!adopted && !openedElsewhere) {
     notify.warn(
       "Created the project, but could not open it here.",

package/src/packages/ensure-deps.ts

@@ -1,8 +1,8 @@
 /// <reference lib="dom" />
 /**
  * Ensure the active project's dependencies are installed before the editor loads. When the backend
- * reports node_modules is missing, run `bun install` behind a blocking progress modal so component
- * and format resolution see the real dependency tree. No-op on platforms without package support.
+ * reports node_modules is missing, install them behind a blocking progress modal so component and
+ * format resolution see the real dependency tree. No-op on platforms without package support.
  *
  * It REPORTS whether an install actually ran, because "format resolution sees the real dependency
  * tree" was only half true: project activation fetches the format registry before calling this, and
@@ -17,7 +17,7 @@ import { shouldInstallAutomation } from "../services/automation";
 
 export async function ensureDependenciesInstalled(): Promise<boolean> {
   // Automation/screenshot runs open projects read-only to drive the canvas — they must never mutate
-  // The project on disk (a `bun install` would litter node_modules/bun.lock into starter templates).
+  // The project on disk (an install would litter node_modules and a lockfile into starter templates).
   if (shouldInstallAutomation(location.search)) {
     return false;
   }
@@ -35,7 +35,7 @@ export async function ensureDependenciesInstalled(): Promise<boolean> {
     return false;
   }
   const progress = showProgressModal({
-    status: "Running bun install…",
+    status: "Installing dependencies…",
     title: "Installing dependencies",
   });
   try {
@@ -44,7 +44,7 @@ export async function ensureDependenciesInstalled(): Promise<boolean> {
       progress.done();
       return true;
     }
-    progress.fail(result.log ?? "bun install failed");
+    progress.fail(result.log ?? "Install failed");
   } catch (error) {
     progress.fail(error instanceof Error ? error.message : String(error));
   }

package/src/packages/pull-package-sync.ts

@@ -4,7 +4,7 @@
  * updates. The on-open @jxsuite update rewrites package.json and bun.lock without committing, so a
  * teammate pushing the same update makes a later `git pull` refuse to merge. Since those local
  * changes are machine-generated and reproducible, we discard them, pull, and re-run the package
- * sync (re-apply the update if the pulled project is still behind, or `bun install` if the pull
+ * sync (re-apply the update if the pulled project is still behind, or an install if the pull
  * brought it). Detection is state-based (git status + content comparison against `@{u}`), never git
  * stderr parsing, so it works identically across backends and locales.
  */
@@ -188,7 +188,7 @@ async function applyDiscard(plan: PackagePullPlan): Promise<void> {
 
 /**
  * Bring packages back in line after a pull that touched (or followed a discard of) package files:
- * re-apply the @jxsuite update if the pulled project is still behind, otherwise `bun install` so
+ * re-apply the @jxsuite update if the pulled project is still behind, otherwise an install so
  * node_modules matches the pulled lockfile. Never throws — a successful pull must not turn into an
  * error banner; failures surface through the progress modal.
  */
@@ -209,7 +209,7 @@ async function syncPackagesAfterPull(): Promise<void> {
     return;
   }
   const progress = showProgressModal({
-    status: "Running bun install…",
+    status: "Installing dependencies…",
     title: "Syncing dependencies",
   });
   try {
@@ -217,7 +217,7 @@ async function syncPackagesAfterPull(): Promise<void> {
     if (result.ok) {
       progress.done();
     } else {
-      progress.fail(result.log ?? "bun install failed");
+      progress.fail(result.log ?? "Install failed");
     }
   } catch (error) {
     progress.fail(errorMessage(error));

package/src/panels/activity-panel.ts

@@ -5,7 +5,7 @@
  * What this replaces: `ui/progress-modal.ts` was **the only surface in Studio with a real error
  * view** — a red headline, the captured log in a `<pre>`, an explicit Close — and it had four call
  * sites, all package operations. It blocked the whole app, offered no cancel, and vanished
- * completely on success, so a `bun install` that hung had no exit and one that failed had a log you
+ * completely on success, so an install that hung had no exit and one that failed had a log you
  * could read exactly once. Every OTHER long operation — git clone, publish, media upload, site
  * import, project open — got a three-second grey line or nothing at all.
  *

package/src/panels/ai-panel.ts

@@ -28,13 +28,13 @@
 
 import { effect, effectScope } from "../reactivity";
 import { createDocumentAssistant } from "../services/document-assistant";
-import { writesForTurn } from "../services/ai-writes";
+import { restoreTurn } from "../services/ai-writes";
+import { isString } from "@jxsuite/schema/guards";
 import { notify } from "../services/notify";
-import { undo } from "../tabs/transact";
+import type { NotifyOptions } from "../services/notify";
 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";
@@ -124,7 +124,7 @@ export function bindAiPanelHost(el: HTMLElement | null) {
     run: runCommand,
     send: () => composer.send(),
     skip: () => {
-      skipAsk();
+      assistant.interactions.skip();
       renderAiPanel();
     },
     stop,
@@ -208,10 +208,10 @@ function watchAssistant() {
       // The registry is composed AFTER the bootstrap mounts this, and it is a reactive holder —
       // Reading it here is what turns the header's skeleton into its real buttons.
       void activeRegistry();
-      // 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 turn late
-      // (and its ANSWER would never repaint the card at all).
-      void pendingAsk();
+      // The question is not chat state — it lives in the assistant's interaction store — but it is
+      // Drawn into this panel, so the same effect has to track it or a question would appear a turn
+      // Late (and its ANSWER would never repaint the card at all).
+      void assistant.interactions.pending;
       /* 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 follow every one of them. Reading the ACTIVE run
          tracks the whole record, so any field moving re-projects. */
@@ -268,7 +268,7 @@ async function handleAssistantSend(text: string) {
   }
   /* Answering comes first: a question is put by a turn that is still running, so a send while one
      waits is its answer, never a second turn. */
-  if (answerAsk(text.trim())) {
+  if (assistant.interactions.answer(text.trim())) {
     surface?.pin();
     renderAiPanel();
     return;
@@ -319,38 +319,31 @@ async function handleRetry(): Promise<void> {
 /**
  * Undo everything one assistant turn changed — ai.md §3.2's "Restore to here".
  *
- * The loop opens one batch per turn per document, so undoing the turn is undoing that batch. The
- * button is offered by the projection only when every recorded change was transactional; this guard
- * is the second half of the same promise, because a ledger can be trimmed (MAX_TURNS) between the
- * projection and the click and a Restore that silently restored SOME of a turn would be worse than
- * one that refused.
+ * The turn's batch lane left one step per document it wrote, and {@link restoreTurn} takes each
+ * back while it is still the top of its tab's history, or refuses the whole turn with a sentence.
+ * The button is offered by the projection only when every recorded change was transactional; the
+ * refusals are the second half of the same promise, because a ledger can be trimmed (MAX_TURNS) and
+ * a document edited between the projection and the click.
  *
  * @param {string} messageId
  */
 /* Exported so the guard can be exercised directly: the button is not DRAWN for a turn that touched
    disk, which would otherwise make the refusal path unreachable from the panel. */
 export function handleRestore(messageId: string): void {
-  const writes = writesForTurn(messageId);
-  if (writes.length === 0) {
-    notify.warn("There is no longer a record of what that turn changed.", { source: "Assistant" });
+  const restored = restoreTurn(messageId);
+  if (isString(restored)) {
+    notify.warn(restored, { source: "Assistant" });
     return;
   }
-  const disk = writes.filter((w) => w.disk).map((w) => w.path);
-  if (disk.length > 0) {
-    notify.warn(
-      `Cannot restore: ${disk.join(", ")} ${disk.length === 1 ? "was" : "were"} written straight ` +
-        "to disk, which undo cannot reach.",
-      { source: "Assistant" },
-    );
-    return;
-  }
-  const tab = activeTab.value;
-  if (!tab) {
-    notify.warn("Open the document that turn edited to restore it.", { source: "Assistant" });
-    return;
+  /* Redo reaches the active tab only, so it is offered only when that is the one tab restored;
+     across documents it would bring back part of the turn. */
+  const [only, ...rest] = restored;
+  const redoable = rest.length === 0 && only === activeTab.value;
+  const options: NotifyOptions = { source: "Assistant" };
+  if (redoable) {
+    options.action = "edit.redo";
   }
-  undo(tab);
-  notify.success("Restored to before that turn.", { action: "edit.redo", source: "Assistant" });
+  notify.success("Restored to before that turn.", options);
   renderAiPanel();
 }
 
@@ -509,7 +502,7 @@ export function revealAssistant(): void {
  * turn waiting forever on a question nobody wants to answer is exactly what Stop is for.
  */
 export function isAssistantWaiting(): boolean {
-  return isAwaitingAnswer();
+  return assistant.interactions.pending !== null;
 }
 
 /**
@@ -617,7 +610,7 @@ function projectPanel(): AiChatView {
   const advice = error ? formatErrorAdvice(error) : "";
   const newChatCommand = projectCommand("assistant.newChat", { icon: "plus" });
   const rows = projectRows({
-    ask: { importRun, pendingId: pendingAsk()?.id ?? null },
+    ask: { importRun, pendingId: assistant.interactions.pending?.callId ?? null },
     messages: cs.messages,
     status: cs.status,
   });

package/src/platform.ts

@@ -50,6 +50,26 @@ declare global {
   var __jxLauncher: LauncherSignal | undefined;
 }
 
+/**
+ * Whether this host offers Open Project at all: a native dialog (`openProject`), or the cloud's
+ * repository picker. The dev server has neither, because its windows open a project from the
+ * `?project=` URL parameter, so every surface that offers Open Project asks this first rather than
+ * drawing a control that cannot do anything.
+ */
+export function canOpenProject(platform: StudioPlatform | null | undefined): boolean {
+  if (!platform) {
+    return false;
+  }
+  if (isFunction(platform.openProject)) {
+    return true;
+  }
+  return (
+    platform.openProjectPicker === "repo-list" &&
+    isFunction(platform.listRepos) &&
+    isFunction(platform.importProject)
+  );
+}
+
 /** @param {StudioPlatform} platform */
 export function registerPlatform(platform: StudioPlatform) {
   globalThis.__jxPlatform = platform;