@jxsuite/studio 2.4.1 → 2.4.3

package/dist/studio.js

@@ -1,6 +1,6 @@
 import {
   seedPublishConnected
-} from "./chunks/studio-qymkxbcq.js";
+} from "./chunks/studio-dgj7gq44.js";
 import"./chunks/studio-wdt9y92a.js";
 import {
   ElementResolutionController,
@@ -67,7 +67,7 @@ import {
   registerStyleCommands,
   render as render3,
   setInspectorTab
-} from "./chunks/studio-1d6bm7eg.js";
+} from "./chunks/studio-f5yyvqxv.js";
 import {
   CommandUnavailableError,
   chordFromEvent,
@@ -99,7 +99,7 @@ import {
   showSlashMenu,
   showSlashMenuAtRect,
   suppressBlockActionBar
-} from "./chunks/studio-qb6vy1z1.js";
+} from "./chunks/studio-ws6ef6js.js";
 import {
   addableContexts,
   defaultCommands,
@@ -111,7 +111,7 @@ import {
   tokenLabel,
   transposeStylebookStyle,
   writeTokenOverride
-} from "./chunks/studio-gfzyxa0m.js";
+} from "./chunks/studio-hyn3vhwr.js";
 import {
   DERIVE_PRESETS,
   JxColorPopover,
@@ -144,7 +144,7 @@ import {
   spNumberField,
   spTextArea,
   spTextField
-} from "./chunks/studio-n9k15qdg.js";
+} from "./chunks/studio-v1va0vhd.js";
 import {
   LitElement,
   css
@@ -160,7 +160,7 @@ import {
 import {
   initQuickSearch,
   openQuickSearch
-} from "./chunks/studio-9sxn0eaa.js";
+} from "./chunks/studio-jnakhg87.js";
 import {
   addRecentProject,
   clearRecentProjects,
@@ -187,10 +187,10 @@ import {
   removeRecentProject,
   renderFilesTemplate,
   seedEntry
-} from "./chunks/studio-jand3kjg.js";
+} from "./chunks/studio-v2c5pmjj.js";
 import {
   computeWindow
-} from "./chunks/studio-91sdrn9x.js";
+} from "./chunks/studio-sccge2wf.js";
 import {
   autoSyncProjectOnOpen,
   cleanupGitPanel,
@@ -211,13 +211,13 @@ import {
   registerSourceControlCommands,
   renderGitPanel,
   stripRange
-} from "./chunks/studio-tdt7b6qb.js";
+} from "./chunks/studio-ke244pam.js";
 import {
   createPanelScheduler
 } from "./chunks/studio-8jpzqk5s.js";
 import {
   selectContributedEntry
-} from "./chunks/studio-rz861p2b.js";
+} from "./chunks/studio-hb7c46jy.js";
 import {
   notifySettingsDocument,
   onSettingsDocumentChanged,
@@ -238,7 +238,7 @@ import {
   renderForm,
   renderProvenanceChip,
   resolveContextPointer
-} from "./chunks/studio-rkr6pm84.js";
+} from "./chunks/studio-ef8t53vc.js";
 import {
   validateDoc,
   validateProjectConfig
@@ -263,7 +263,7 @@ import {
   registerGridCommands,
   scanLibrary,
   uploadDirForCategory
-} from "./chunks/studio-4m39t01b.js";
+} from "./chunks/studio-0b6fs05q.js";
 import {
   live
 } from "./chunks/studio-c31yb4t6.js";
@@ -307,7 +307,7 @@ import {
   setIncludeDrafts,
   startFsSync,
   writesForTurn
-} from "./chunks/studio-gqpbrrj5.js";
+} from "./chunks/studio-26sv44br.js";
 import"./chunks/studio-2w11grav.js";
 import"./chunks/studio-bw5dz6km.js";
 import {
@@ -316,18 +316,18 @@ import {
   isImage,
   setMediaChangedHandler,
   uploadAssets
-} from "./chunks/studio-0svvdm0a.js";
+} from "./chunks/studio-cz2j1c0g.js";
 import {
   beginActivity,
   registerActivityPanel,
   showProgressModal
-} from "./chunks/studio-d1f2rqxh.js";
+} from "./chunks/studio-28xc8ws4.js";
 import {
   currentDeploy,
   latestDeployment,
   noteDeployment,
   platformSupportsPublish
-} from "./chunks/studio-675v08qj.js";
+} from "./chunks/studio-aweyr4v1.js";
 import {
   CATEGORIES,
   SPAN_FULL_RENDER,
@@ -439,7 +439,7 @@ import {
   timeSpan,
   timeSpanAsync,
   updateActivePanelHeaders
-} from "./chunks/studio-h6553a8h.js";
+} from "./chunks/studio-pyrw8h0w.js";
 import {
   BOTTOM_TAB_IDS,
   BUFFER_COMMIT,
@@ -606,7 +606,7 @@ import {
   updateSiteConfig,
   view,
   workspace
-} from "./chunks/studio-kfq9ed73.js";
+} from "./chunks/studio-ra7ar50f.js";
 import {
   classMap,
   ifDefined,
@@ -669,7 +669,7 @@ import {
   mountStillWanted,
   refreshExtensionUi,
   refreshFormats
-} from "./chunks/studio-40fm3hyr.js";
+} from "./chunks/studio-rqemfhz6.js";
 import {
   getPlatform,
   hasPlatform,
@@ -16807,7 +16807,7 @@ function entryIdsFor(collection) {
   if (known) {
     return known;
   }
-  const pending = import("./chunks/content-source-cn9te96r.js").then((m) => m.listCollectionEntryIds(collection));
+  const pending = import("./chunks/content-source-k9724vcv.js").then((m) => m.listCollectionEntryIds(collection));
   entryIdCache.set(collection, pending);
   return pending;
 }
@@ -17068,7 +17068,7 @@ function renderEntryMode(surface, tab) {
   });
 }
 async function openEntryEditor(path) {
-  const { openFileInTab: openFileInTab2 } = await import("./chunks/files-dsh5g8j4.js");
+  const { openFileInTab: openFileInTab2 } = await import("./chunks/files-yew27sn9.js");
   await openFileInTab2(path);
   for (const [id, tab] of workspace.tabs.entries()) {
     if (tab.documentPath !== path) {
@@ -17129,7 +17129,7 @@ async function createEntry(collectionName) {
     });
     return null;
   }
-  const { createFileIn: createFileIn2 } = await import("./chunks/files-dsh5g8j4.js");
+  const { createFileIn: createFileIn2 } = await import("./chunks/files-yew27sn9.js");
   const created = await createFileIn2({
     content,
     dir: collection.dir,
@@ -22349,7 +22349,7 @@ function groupProblems(records = problems) {
   return groups;
 }
 function openProblemPath(path) {
-  import("./chunks/files-dsh5g8j4.js").then((m) => m.openFileInTab(path));
+  import("./chunks/files-yew27sn9.js").then((m) => m.openFileInTab(path));
 }
 function actionTpl(record) {
   const id = record.action;
@@ -28687,6 +28687,71 @@ function renderAiPanelTemplate() {
   `;
 }
 
+// ../schema/src/component-meta.ts
+function collectSlotDefs(node, out = []) {
+  if (!node || typeof node !== "object" || Array.isArray(node)) {
+    return out;
+  }
+  const el = node;
+  if (el.tagName === "slot") {
+    const attrs = el.attributes;
+    const rawName = attrs?.name;
+    const name = typeof rawName === "string" ? rawName.trim() : "";
+    const { children } = el;
+    out.push({
+      name,
+      ...Array.isArray(children) && children.length > 0 ? { fallback: children } : {}
+    });
+  }
+  if (Array.isArray(el.children)) {
+    for (const c of el.children) {
+      collectSlotDefs(c, out);
+    }
+  }
+  return out;
+}
+function isPropEntry(def) {
+  if (def == null) {
+    return false;
+  }
+  if (typeof def !== "object") {
+    return true;
+  }
+  const obj = def;
+  return !obj.$prototype && !obj.$handler && !obj.$compute;
+}
+function componentMetaFrom(doc, path) {
+  if (!doc || typeof doc !== "object" || Array.isArray(doc)) {
+    return null;
+  }
+  const content = doc;
+  const { tagName } = content;
+  if (typeof tagName !== "string" || !tagName.includes("-")) {
+    return null;
+  }
+  const slots = collectSlotDefs(content);
+  const state2 = content.state ?? {};
+  return {
+    $id: typeof content.$id === "string" && content.$id ? content.$id : null,
+    hasElements: Array.isArray(content.$elements) && content.$elements.length > 0,
+    path,
+    props: Object.entries(state2).filter(([, def]) => isPropEntry(def)).map(([name, def]) => {
+      if (typeof def !== "object" || def === null) {
+        return { default: def, name, type: typeof def };
+      }
+      const obj = def;
+      return {
+        default: obj.default,
+        format: obj.format,
+        name,
+        type: obj.type
+      };
+    }),
+    ...slots.length > 0 ? { slots } : {},
+    tagName
+  };
+}
+
 // ../protocol/src/problem.ts
 var PROBLEM_TYPE_BASE = "https://jxsuite.com/problems/";
 function problemSlug(type) {
@@ -29098,7 +29163,41 @@ function createCloudPlatform(project) {
       return data.result;
     },
     async discoverComponents() {
-      return [];
+      const SKIP = new Set(["node_modules", "dist", ".git", ".claude", ".obsidian", "build"]);
+      const MAX_FILES = 400;
+      const MAX_DEPTH = 6;
+      const jsonPaths = [];
+      const walk = async (dir, depth) => {
+        if (depth > MAX_DEPTH || jsonPaths.length >= MAX_FILES) {
+          return;
+        }
+        let entries;
+        try {
+          entries = await platform.listDirectory(dir);
+        } catch {
+          return;
+        }
+        const dirs = [];
+        for (const entry of entries) {
+          if (entry.type === "directory") {
+            if (!SKIP.has(entry.name) && !entry.name.startsWith(".")) {
+              dirs.push(entry.path);
+            }
+          } else if (entry.name.endsWith(".json") && jsonPaths.length < MAX_FILES) {
+            jsonPaths.push(entry.path);
+          }
+        }
+        await Promise.all(dirs.map(async (d) => walk(d, depth + 1)));
+      };
+      await walk("", 0);
+      const metas = await Promise.all(jsonPaths.map(async (path) => {
+        try {
+          return componentMetaFrom(JSON.parse(await platform.readFile(path)), path);
+        } catch {
+          return null;
+        }
+      }));
+      return metas.filter((m) => m !== null);
     },
     async codeService() {
       return null;
@@ -58591,9 +58690,9 @@ function renderDefsEditor(container) {
 
 // src/version.ts
 var APP_NAME = "Jx Studio";
-var VERSION = "2.4.1";
-var BUILD_DATE = "2026-08-24T11:52:26.010Z";
-var GIT_COMMIT = "eb4fe5d";
+var VERSION = "2.4.3";
+var BUILD_DATE = "2026-08-25T03:20:06.206Z";
+var GIT_COMMIT = "624ef53";
 var LINKS = {
   github: "https://github.com/jxsuite/jx",
   docs: "https://github.com/jxsuite/jx#readme",
@@ -59670,7 +59769,7 @@ async function openProjectSettings(section) {
   showSettingsDocument();
   notifySettingsDocument();
   try {
-    const { syncExtensionSettingsSections } = await import("./chunks/extension-sections-mdgmqrry.js");
+    const { syncExtensionSettingsSections } = await import("./chunks/extension-sections-0ada0xcw.js");
     await syncExtensionSettingsSections();
   } catch (error) {
     notify.warn(`Could not load extension settings sections — ${errorMessage(error)}`, {
@@ -60294,7 +60393,7 @@ function publishCommands() {
         name: "set_up_publishing"
       },
       run: async () => {
-        const { openPublishPanel } = await import("./chunks/publish-panel-b0xh7b4y.js");
+        const { openPublishPanel } = await import("./chunks/publish-panel-a0pdft5w.js");
         openPublishPanel();
       },
       title: "Set Up Publishing"
@@ -61016,7 +61115,7 @@ function i18nCommands() {
           });
           return;
         }
-        const { openFileInTab: openFileInTab2 } = await import("./chunks/files-dsh5g8j4.js");
+        const { openFileInTab: openFileInTab2 } = await import("./chunks/files-yew27sn9.js");
         await openFileInTab2(path);
       },
       title: "Open Translation"
@@ -61063,7 +61162,7 @@ function i18nCommands() {
           return;
         }
         const cut = path.lastIndexOf("/");
-        const { createFileIn: createFileIn2, openFileInTab: openFileInTab2 } = await import("./chunks/files-dsh5g8j4.js");
+        const { createFileIn: createFileIn2, openFileInTab: openFileInTab2 } = await import("./chunks/files-yew27sn9.js");
         const created = await createFileIn2({
           content,
           dir: cut === -1 ? "." : path.slice(0, cut),
@@ -61876,5 +61975,5 @@ export {
   hasUnsavedTabs
 };
 
-//# debugId=C20E21297FE0976064756E2164756E21
+//# debugId=980E02AF5DBA79D264756E2164756E21
 //# sourceMappingURL=studio.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jxsuite/studio",
-  "version": "2.4.1",
+  "version": "2.4.3",
   "description": "Jx Studio — visual builder for Jx documents",
   "license": "MIT",
   "repository": {
@@ -57,14 +57,14 @@
   "dependencies": {
     "@atlaskit/pragmatic-drag-and-drop": "^3.0.0",
     "@atlaskit/pragmatic-drag-and-drop-hitbox": "^2.1.0",
-    "@jxsuite/ai": "^0.36.2",
-    "@jxsuite/collab": "^0.8.1",
-    "@jxsuite/create": "^1.3.5",
-    "@jxsuite/formulas": "^0.0.11",
-    "@jxsuite/markup": "^0.4.5",
-    "@jxsuite/protocol": "^1.2.0",
-    "@jxsuite/runtime": "^2.0.4",
-    "@jxsuite/schema": "^1.8.0",
+    "@jxsuite/ai": "^0.36.3",
+    "@jxsuite/collab": "^0.8.2",
+    "@jxsuite/create": "^1.3.6",
+    "@jxsuite/formulas": "^0.0.13",
+    "@jxsuite/markup": "^0.4.6",
+    "@jxsuite/protocol": "^1.2.1",
+    "@jxsuite/runtime": "^2.0.5",
+    "@jxsuite/schema": "^1.8.1",
     "@spectrum-web-components/accordion": "^1.12.2",
     "@spectrum-web-components/action-bar": "1.12.2",
     "@spectrum-web-components/action-button": "^1.12.2",

package/src/canvas/canvas-origin.ts

@@ -42,12 +42,24 @@ export function canvasBaseOrigin(): string {
  * @returns {string} A base URL ending in `/`, safe to pass to `new URL(relativePath, base)`.
  */
 export function documentBase(projectRoot?: string): string {
+  const origin = canvasBaseOrigin();
   const declared = hasPlatform() ? getPlatform().documentBaseUrl : undefined;
   if (declared) {
-    return declared.endsWith("/") ? declared : `${declared}/`;
+    const withSlash = declared.endsWith("/") ? declared : `${declared}/`;
+    /*
+     * ABSOLUTE, ALWAYS. The caller uses this as `new URL(documentPath, base)`, and a `base` that is
+     * itself relative throws `Failed to construct 'URL': Invalid base URL` — which is not a failed
+     * fetch but a failed MOUNT: the canvas renders nothing at all.
+     *
+     * Jx Cloud declares a root-relative base (`/api/v1/p/:owner/:repo/:branch/studio/raw/`), which
+     * is the natural thing to declare and must keep working. Resolving it against the canvas origin
+     * here means a platform may declare either shape. An already-absolute URL passes through
+     * unchanged, because that is what `new URL` does with one.
+     */
+    return new URL(withSlash, `${origin}/`).href;
   }
   const root = projectRoot || "";
-  return `${canvasBaseOrigin()}/${root ? `${root}/` : ""}`;
+  return `${origin}/${root ? `${root}/` : ""}`;
 }
 
 /**

package/src/canvas/iframe-inline-edit.ts

@@ -38,6 +38,7 @@ import { adjacentBlock, blocksInOrder } from "./iframe-position";
 import { isTagActiveInSelection, toggleInlineFormat } from "../editor/inline-format";
 import { applyLink, insertTemplateToken, linkStateForSelection } from "../editor/inline-link";
 import { restoreTemplateExpressions } from "../utils/edit-display";
+import { RESERVED_KEYS, camelToKebab } from "@jxsuite/runtime";
 import { rectOfRange } from "../utils/geometry";
 import { getNodeAtPath } from "../state";
 import { parseJxPath, serializeJxPath } from "./path-mapping";
@@ -86,6 +87,77 @@ function ownerInstanceOf(el: HTMLElement): HTMLElement | null {
   return null;
 }
 
+/**
+ * Whether the instance node delivers `prop` by some route OTHER than `$props` — in which case
+ * "absent from `$props`" does not mean "unset", and a `$props` write would add a SECOND source for
+ * one rendered value.
+ *
+ * The routes are the property bridge's own, in the order `connectedCallback` reads them
+ * (`compiler.md` §4.4) — a `data-jx-props` payload, literal `props.*` attributes, then JS
+ * properties set before connection — plus the one that reaches that third source without going
+ * through `$props`. Each was reproduced against the real runtime:
+ *
+ * 1. `attributes: { "data-jx-props": "{…}" }` — the compiler's pre-rendered payload, parsed into state
+ *    before anything else. Studio edits source documents rather than build output, so this is the
+ *    rare one; it is here because the bridge reads it.
+ * 2. The JSON shorthand `attributes: { "props.text": "…" }`. `connectedCallback` collects `props.*`
+ *    attributes into state, so the marker renders that text while `$props` is empty. This repo's
+ *    own site carries 95 of them.
+ * 3. A prop whose name collides with a REFLECTED HTMLElement property — `title`, `role`, `id`, `lang`,
+ *    `dir`, `slot`, `hidden`. `setAttribute("title", …)` writes the JS property as a side effect,
+ *    and the merge `key in this && this[key] !== undefined` picks it up. 41 shipped starter
+ *    components declare `title` or `role` as state. Matched the way `instanceSupplies` matches:
+ *    attribute names are case-insensitive, and an ARIA-style reflection carries a kebab attribute
+ *    for a camelCase property (`ariaLabel` → `aria-label`).
+ * 4. A TOP-LEVEL key on the instance node — `{ "tagName": "x-card", "heading": "Local" }`. This is the
+ *    property-first interface written straight onto the node: `applyProperties` sets every
+ *    non-reserved key as a JS property, which is exactly what the merge then reads back off `this`.
+ *    Reserved keys (`name`, `items`, `children`, …) are skipped there and so are skipped here —
+ *    refusing on one would block a prop that the key never delivered.
+ *
+ * Editing any of them writes `$props[prop]` and leaves the other value standing. For case 3 the
+ * attribute WINS (applyAttributes runs after the $props assignment) so the edit is simply
+ * invisible; for the rest `$props` wins and the stale value waits — clearing the prop later
+ * resurrects it. Refusing keeps the properties panel, which edits the real source, as the one way
+ * in.
+ */
+function deliveredOutsideProps(node: JxMutableNode | undefined, prop: string): boolean {
+  if (!node) {
+    return false;
+  }
+  const attrs = node.attributes as Record<string, unknown> | undefined;
+  if (attrs) {
+    if (attrs[`props.${prop}`] !== undefined) {
+      return true;
+    }
+    const reflected = new Set([prop.toLowerCase(), camelToKebab(prop).toLowerCase()]);
+    for (const [name, val] of Object.entries(attrs)) {
+      if (val !== undefined && reflected.has(name.toLowerCase())) {
+        return true;
+      }
+    }
+    const payload = attrs["data-jx-props"];
+    if (typeof payload === "string" && payloadNames(payload, prop)) {
+      return true;
+    }
+  }
+  // `$`-prefixed keys are scope bindings, never DOM properties — `applyProperties` skips them too.
+  if (RESERVED_KEYS.has(prop) || prop.startsWith("$")) {
+    return false;
+  }
+  return (node as Record<string, unknown>)[prop] !== undefined;
+}
+
+/** Whether a `data-jx-props` JSON payload carries `prop`. Unparseable payloads deliver nothing. */
+function payloadNames(payload: string, prop: string): boolean {
+  try {
+    const parsed: unknown = JSON.parse(payload);
+    return typeof parsed === "object" && parsed !== null && prop in parsed;
+  } catch {
+    return false;
+  }
+}
+
 /** Locate the rendered element for a document path via its stamped `data-jx-path`. */
 function elementForPath(container: HTMLElement, path: JxPath): HTMLElement | null {
   const serialized = serializeJxPath(path);
@@ -267,10 +339,12 @@ export function startIframeInlineEdit(
   };
 
   /**
-   * Whether the instance's RAW `$props[prop]` value (from the pre-edit-display shadow doc) is
-   * plain-text editable. Template-valued (`"${...}"`) and `$ref`-valued props render display sugar,
-   * not the value — committing typed text would silently destroy the binding, so they're blocked.
-   * An absent getShadowDoc is permissive (tests, same contract as getMode).
+   * Whether the instance's prop (read from the pre-edit-display shadow doc) is plain-text editable
+   * AND `$props` is the place it lives — a value the instance delivers by another route belongs to
+   * that route, and `deliveredOutsideProps` refuses it. Template-valued (`"${...}"`) and
+   * `$ref`-valued props render display sugar, not the value — committing typed text would silently
+   * destroy the binding, so they're blocked. An absent getShadowDoc is permissive (tests, same
+   * contract as getMode).
    */
   const propEditableAt = (hostPath: JxPath, prop: string): boolean => {
     const shadowDoc = opts?.getShadowDoc?.();
@@ -278,27 +352,7 @@ export function startIframeInlineEdit(
       return true;
     }
     const node = getNodeAtPath(shadowDoc, hostPath) as JxMutableNode | undefined;
-    /*
-     * `$props` IS NOT THE ONLY PLACE A PROP VALUE LIVES, and "absent from $props" is therefore not
-     * the same question as "unset". Two shapes deliver one through `attributes` instead, and both
-     * were reproduced against the real runtime:
-     *
-     *   1. The JSON shorthand `attributes: { "props.text": "…" }`. `connectedCallback` collects
-     *      `props.*` attributes into state, so the marker renders that text while `$props` is
-     *      empty. This repo's own site carries 95 of them.
-     *   2. A prop whose name collides with a REFLECTED HTMLElement property — `title`, `role`,
-     *      `id`, `lang`, `dir`, `slot`, `hidden`. `setAttribute("title", …)` writes the JS property
-     *      as a side effect, and the merge `key in this && this[key] !== undefined` picks it up.
-     *      41 shipped starter components declare `title` or `role` as state.
-     *
-     * Editing either would write `$props[prop]` and leave the attribute standing — two sources for
-     * one rendered value. In case 2 the attribute WINS (applyAttributes runs after the $props
-     * assignment), so the edit is simply invisible; in case 1 clearing the prop later resurrects
-     * the old text. Refusing keeps the properties panel, which edits the attribute itself, as the
-     * one way in.
-     */
-    const attrs = node?.attributes as Record<string, unknown> | undefined;
-    if (attrs?.[`props.${prop}`] !== undefined || attrs?.[prop] !== undefined) {
+    if (deliveredOutsideProps(node, prop)) {
       return false;
     }
     const raw = (node?.$props as Record<string, unknown> | undefined)?.[prop];

package/src/platforms/cloud.ts

@@ -15,8 +15,10 @@ import { negotiateCollab } from "@jxsuite/collab/negotiate";
 import type { CollabNegotiation } from "@jxsuite/collab/negotiate";
 import type { WsCollabConnection } from "@jxsuite/collab/client";
 import type { ProjectConfig } from "@jxsuite/schema/types";
+import { componentMetaFrom } from "@jxsuite/schema/component-meta";
 import type {
   AccountStatus,
+  ComponentMeta,
   CreateProjectDestination,
   DirEntry,
   ExtensionsInfo,
@@ -518,9 +520,66 @@ export function createCloudPlatform(project: CloudProject | null): StudioPlatfor
 
     // ─── Components / code services (cloud: static-only posture) ──────────
 
+    /**
+     * Component discovery, by READING rather than executing.
+     *
+     * This returned `[]` under "no execution of project JS in the cloud", and the cost was not the
+     * loss of discovery — it was the canvas. `canvas-live-render` injects the `$elements` a
+     * document's tags need only when the registry is non-empty, so an empty registry meant nothing
+     * was ever registered, no component was ever fetched, and every component instance rendered as
+     * an unregistered custom element: an empty inline box. A page built from components came up as
+     * blank space between the layout's chrome.
+     *
+     * Discovery does not need to execute anything. For a JSON component it is a file read and a
+     * property lookup — `componentMetaFrom` is that function, shared with the two Bun backends so
+     * "which `state` entries are props" has one answer. Non-JSON component formats DO need a
+     * project-supplied parser, and those stay out: the posture is kept where it actually applies
+     * rather than across the whole feature.
+     *
+     * Bounded rather than unbounded: the walk skips the directories a scan has no business in and
+     * stops at a depth and a file count, because this runs against a remote session over HTTP and a
+     * pathological tree must not turn opening a project into thousands of requests.
+     */
     async discoverComponents() {
-      // No execution of project JS in the cloud (MVP security posture).
-      return [];
+      const SKIP = new Set(["node_modules", "dist", ".git", ".claude", ".obsidian", "build"]);
+      const MAX_FILES = 400;
+      const MAX_DEPTH = 6;
+      const jsonPaths: string[] = [];
+
+      const walk = async (dir: string, depth: number): Promise<void> => {
+        if (depth > MAX_DEPTH || jsonPaths.length >= MAX_FILES) {
+          return;
+        }
+        let entries: DirEntry[];
+        try {
+          entries = await platform.listDirectory(dir);
+        } catch {
+          return; // A directory that vanished mid-walk is not a discovery failure.
+        }
+        const dirs: string[] = [];
+        for (const entry of entries) {
+          if (entry.type === "directory") {
+            if (!SKIP.has(entry.name) && !entry.name.startsWith(".")) {
+              dirs.push(entry.path);
+            }
+          } else if (entry.name.endsWith(".json") && jsonPaths.length < MAX_FILES) {
+            jsonPaths.push(entry.path);
+          }
+        }
+        await Promise.all(dirs.map(async (d) => walk(d, depth + 1)));
+      };
+      await walk("", 0);
+
+      const metas = await Promise.all(
+        jsonPaths.map(async (path) => {
+          try {
+            return componentMetaFrom(JSON.parse(await platform.readFile(path)), path);
+          } catch {
+            return null; // Not JSON, not readable, or not a component — all the same answer here.
+          }
+        }),
+      );
+      return metas.filter((m): m is NonNullable<typeof m> => m !== null) as ComponentMeta[];
     },
 
     async codeService() {

package/src/types.ts

@@ -195,7 +195,9 @@ export interface StudioPlatform {
    * every `$ref` fetch landed on the SPA fallback — which answers HTML at **200**, so `res.ok`
    * passed and the parse died on `Unexpected token '<'`. Images failed the same way in silence.
    *
-   * Must end in `/`; a project-relative path is appended to it verbatim.
+   * May be absolute or root-relative — a root-relative value is resolved against the canvas origin,
+   * because the canvas uses this as `new URL(path, base)` and a relative BASE throws. A missing
+   * trailing `/` is added: without it `new URL` drops the last segment.
    */
   documentBaseUrl?: string;
   activate: (root?: string) => Promise<void>;