@jxsuite/studio 6.1.1 → 8.0.0

package/src/studio.ts

@@ -21,10 +21,12 @@ import {
   registerRenderer,
   render,
   requireProjectState,
+  requireShellRef,
   setProjectState,
   toolbarEl,
   updateSession,
 } from "./store";
+import { getEffectiveRenderLocale } from "./site-context";
 
 import {
   PRIMARY_PANE,
@@ -57,6 +59,7 @@ import { isEditing } from "./editor/inline-edit";
 import { applyTransform, registerCanvasViewCommands } from "./canvas/canvas-utils";
 import { diffCommands, setDiffChromeRepaint } from "./canvas/diff-toolbar";
 import type { CanvasSurface } from "./canvas/canvas-surface";
+import type { InspectorTabId } from "./shell";
 import {
   initCanvasRender,
   registerSelectionSetCommand,
@@ -117,15 +120,15 @@ import {
 import {
   loadProject as _loadProject,
   openProject as _openProject,
-  renderFilesTemplate,
   findHomePage,
   loadDirectory,
+  loadProjectDirectories,
   openFileInPane,
   openFileInTab,
   openLastSessionOrHome,
-  registerFileTreeDnD,
   reloadCleanTab,
   reloadTabsIfChanged,
+  setSessionWorkspaceShow,
 } from "./files/files";
 import { resetIgnoreCache } from "./files/gitignore";
 import { resetAssetVersions } from "./files/asset-versions";
@@ -136,12 +139,21 @@ import {
   configureCollabParser,
   configureCollabSerializer,
 } from "./collab/collab-session";
-import { renderImportsTemplate } from "./panels/imports-panel";
-import { invalidateLayoutPickerCache, renderHeadTemplate } from "./panels/head-panel";
-import { exportCemManifest as _exportCemManifest } from "./services/cem-export";
+import { invalidateLayoutPickerCache } from "./panels/head-panel";
 import { installAutomationHook } from "./services/automation";
-import { invalidateLibrary } from "./browse/library-pane";
-import { invalidateMediaCache } from "./ui/media-picker";
+import { invalidateLibrary, resetContentView } from "./browse/library-pane";
+import { invalidateCollectionPages, resetCollectionPages } from "./content/collection-pages";
+import { invalidatePageSummaries } from "./content/page-summaries";
+import { invalidateEntrySummaries, noteSavedEntry } from "./content/entry-summaries";
+import { invalidateRepeaterSources } from "./canvas/repeater-sources";
+import { entryFields } from "./content/entry-fields";
+import { contentCacheDrops } from "./content/content-collections";
+import { resetWritingBanners } from "./content/writing-banner";
+import { resetCollectionsPanel } from "./panels/collections-panel";
+import { resetStylesPanel } from "./panels/styles-panel";
+import { resetVariablesFocus } from "./style/variables-focus";
+import { invalidateMediaCache, isMediaScanPath } from "./ui/media-picker";
+import { invalidateSiteIndex, resetSitePanel } from "./panels/site-panel";
 import { setMediaChangedHandler } from "./files/media-upload";
 import { applyFileDrop } from "./editor/file-drop-action";
 import {
@@ -171,13 +183,13 @@ import { autoSyncProjectOnOpen } from "./packages/pull-package-sync";
 import webdata from "../data/webdata.json";
 import { registerDataExplorerCommands } from "./panels/data-explorer";
 import {
-  cleanupGitPanel,
+  cleanupSourceControl,
   cloneRepository,
   loadDiffForLens,
   registerSourceControlCommands,
-  renderGitPanel,
   noteFileSaved,
-} from "./panels/git-panel";
+  setSourceControlDeps,
+} from "./publish/source-control";
 
 import { registerKit } from "./ui/kit";
 import "./ui/panel-resize.js";
@@ -188,13 +200,12 @@ import { initShortcuts, registerStudioCommands } from "./editor/shortcuts";
 import type { ProjectOpenOutcome, ProjectOpenTarget } from "./editor/shortcuts";
 import { createCommandRegistry } from "./commands/registry";
 import { chordsInScopes } from "./commands/keymap";
-import { FRAME_KEY_SCOPES } from "./canvas/iframe-keys";
+import { FRAME_KEY_SCOPES, HOST_ONLY_COMMANDS } from "./canvas/iframe-keys";
 import { createLiveContext } from "./commands/live-context";
 import { hasAiCredentials } from "./services/ai-models";
-import { mount as mountActivityBar } from "./surfaces/rail";
+import { mount } from "./surfaces/rail";
 import * as toolbarPanel from "./surfaces/commandbar";
 import * as overlaysPanel from "./panels/overlays";
-import * as frontmatterPanelMod from "./panels/frontmatter-panel";
 import * as rightPanelMod from "./panels/right-panel";
 import * as chatPanelMod from "./panels/chat-panel";
 import { setProjectAdopter } from "./services/project-adoption";
@@ -254,21 +265,38 @@ import { registerPopoverCommands } from "./services/popover-report";
 import { registerStyleCommands } from "./panels/style-panel";
 import { registerGridCommands } from "./grid/grid-open";
 import { registerExtensionCommands } from "./settings/extension-commands";
-import { registerSettingsCommands } from "./settings/settings-document";
+import {
+  registerSettingsCommands,
+  rememberStylesView,
+  showSettingsDocument,
+} from "./settings/settings-document";
+import {
+  installWorkspaceFollow,
+  revealInPane,
+  switchWorkspace,
+} from "./workspace/workspace-switch";
+import { workspaceBackCommands } from "./workspace/workspace-back";
+import type { HomeWorkspaceId, WorkspaceId } from "./workspace/workspace-ids";
+import { openWorkspaceHome, placeWorkspaceHome } from "./workspace/workspace-home";
 import { registerPreferencesCommands } from "./settings/preferences-dialog";
 import { registerAboutCommands } from "./about/about-modal";
 import { registerCollabCommands } from "./collab/collab-commands";
-import { registerLibraryCommands } from "./browse/library-commands";
+import { registerContentViewCommands } from "./browse/library-commands";
 import { registerFileFormatCommands } from "./format/convert-file";
 import { registerPublishCommands } from "./publish/publish-commands";
 import { registerGridViewCommands } from "./grid/grid-panel";
 import { registerRedirectsCommands } from "./grid/redirects-grid";
 import { registerContentCommands } from "./content/entry-commands";
+import { registerAddNewCommands } from "./create/add-new-commands";
+import { registerMediaCommands } from "./media/media-commands";
+import { focusMediaHome, resetMediaLibrary } from "./media/media-library";
+import { focusPublishHome } from "./publish/publish-workspace";
 import { registerI18nCommands } from "./i18n/i18n-commands";
 import { convertToComponent } from "./editor/convert-to-component";
 import type { GitDiffState } from "./types";
+import { PROJECT_CONFIG_PATH } from "./tabs/tab";
 import type { Tab } from "./tabs/tab";
-import type { JxDocument, JxMutableNode, ProjectConfig } from "@jxsuite/schema/types";
+import type { JxDocument, ProjectConfig } from "@jxsuite/schema/types";
 import { setBundleBase } from "./services/bundle-base";
 import { mountBootFailureTree, mountShellTree } from "./shell/tree";
 
@@ -299,8 +327,8 @@ setBundleBase(import.meta.url);
  *
  * `loadDiff` is here rather than in `workspace/pane-derive.ts` because that module owns no I/O —
  * which is what lets its whole decision-making half be tested with no platform. It is the same pair
- * of reads `panels/git-panel.ts` makes for a row click; an added file has no `HEAD` copy, so its
- * "original" is the empty string rather than a `gitShow` that would throw.
+ * of reads `publish/source-control.ts` makes for a Before and after; an added file has no `HEAD`
+ * copy, so its "original" is the empty string rather than a `gitShow` that would throw.
  */
 const derivationDeps: DerivationDeps = {
   /*
@@ -373,6 +401,10 @@ function setCanvasMode(tab: Tab | null, mode: string) {
     shell.git.diffState = null;
   }
   tab.session.ui.canvasMode = mode;
+  // The Styles home view follows the author's own switches between Variables and Elements.
+  if (tab.documentPath === PROJECT_CONFIG_PATH) {
+    rememberStylesView(mode);
+  }
 }
 
 // ─── Component registry ───────────────────────────────────────────────────────
@@ -499,7 +531,7 @@ initShellRefs();
 mountShell();
 
 // Mount extracted panel modules
-toolbarPanel.mount(toolbarEl, {
+toolbarPanel.mount(requireShellRef(toolbarEl, "toolbar"), {
   closeFunctionEditor: () => closeFunctionEditor(),
   getCanvasMode,
   openProject: () => openProject(),
@@ -527,11 +559,26 @@ const primaryCell = cellForPane(PRIMARY_PANE);
 
 tabStrip.mount(primaryCell?.strip ?? document.createElement("div"));
 
+/**
+ * Give the keyboard to the home a Back landed on (`workspace/workspace-back.ts`): the media tile
+ * that was opened, the change whose comparison it was. One function for the Back control and for
+ * Escape, so the two land in the same place.
+ */
+function focusWorkspaceHome(paneId: string, id: WorkspaceId): void {
+  if (id === "media") {
+    focusMediaHome(paneId);
+  } else if (id === "publish") {
+    focusPublishHome(paneId);
+  }
+}
+
 paneContext.mount(primaryCell?.chrome ?? document.createElement("div"), {
   exportFile,
   // No `getCanvasMode`: the bar is drawn once per pane and asks its own pane. See `PaneContextCtx`.
   parseMediaEntries,
   setCanvasMode,
+  closeTab: tabStrip.requestClose,
+  focusHome: focusWorkspaceHome,
 });
 /* The diff's Visual/Code switch decides whether the zoom pod is drawn, and the half it writes is
    not reactive — so the switch repaints the chrome as well as the stage. See `setDiffChromeRepaint`. */
@@ -561,6 +608,7 @@ setFileDropHandler(applyFileDrop);
 setMediaChangedHandler(async (dir) => {
   invalidateMediaCache();
   invalidateLibrary();
+  invalidateSiteIndex();
   await loadDirectory(dir);
   renderLeftPanel();
 });
@@ -585,7 +633,7 @@ setStylebookHitHandler((tag, media) => {
    1. Commit-on-parent-click: it ends the live inline-edit session, which the iframe cannot observe
       itself (layers panel, tab strip, right panel…).
    2. The block action bar goes with it. The bar is `position: fixed` and clamped into the window,
-      so it can sit over the Document Header card, the pane context bar and the docks; an author
+      so it can sit over the pane context bar, the Inspector and the docks; an author
       working in the Inspector's Logic tab reported it "blocking a part of the interface that the
       user needs to utilize". It is SUPPRESSED, not dismissed — a plain dismiss flashes back on the
       next snapshot or overlay repaint — and it comes back the moment the canvas takes a pointer or
@@ -641,9 +689,8 @@ window.addEventListener("beforeunload", (e: BeforeUnloadEvent) => {
   // Author may cancel the close, and the record is the same either way.
   flushSession();
   if (hasUnsavedTabs()) {
+    // The HTML standard's trigger for the leave-page prompt; the legacy `returnValue` is deprecated.
     e.preventDefault();
-    // Legacy browsers require a truthy returnValue to trigger the native confirm prompt.
-    e.returnValue = "";
   }
 });
 
@@ -743,11 +790,8 @@ function installPaneRenderEffects(paneId: string): void {
   installDerivationEffects(paneId, derivationDeps);
   effect(() => {
     const tab = tabOfPane(paneId);
-    if (tab) {
-      const doc = tab.doc.document;
-      if (doc && consumePatchedDocument(doc, paneId)) {
-        return;
-      }
+    if (tab && consumePatchedDocument(tab.doc.document, paneId)) {
+      return;
     }
     scheduleCanvasRender(paneId);
   });
@@ -781,10 +825,8 @@ function installPaneRenderEffects(paneId: string): void {
       void tab.session.ui.previewProps;
       void tab.session.ui.showLayout;
     }
-    // Project-level render inputs: the stylebook catalogue's filters and the settings section are
-    // Shell state, so a change repaints the canvas with or without a document focused.
-    void shell.settingsTab;
-    void shell.stylebook.tab;
+    // Project-level render inputs: the stylebook catalogue's filters are shell state, so a change
+    // Repaints the canvas with or without a document focused.
     void shell.stylebook.filter;
     void shell.stylebook.customizedOnly;
     scheduleCanvasRender(paneId);
@@ -803,8 +845,11 @@ function installPaneRenderEffects(paneId: string): void {
      * The other half of `i18n.switchLocale`. Without this the control moves a chip and the artboard
      * goes on drawing the same document left-to-right, which makes the verb a label rather than a
      * rendering context. Scoped to THIS pane's stage for the reason the scheme effect above gives.
+     * The document's OWN language when nothing is chosen, so an Arabic file draws right to left
+     * without being asked (`getEffectiveRenderLocale`).
      */
-    const locale = tabOfPane(paneId)?.session.ui.previewLocale ?? null;
+    const tab = tabOfPane(paneId);
+    const locale = getEffectiveRenderLocale(tab?.session.ui.previewLocale, tab?.documentPath);
     postLocaleToLiveHosts(locale, surfaceForPane(paneId).wrap);
   });
 }
@@ -849,10 +894,6 @@ rightPanelMod.mount({
   renderCanvas: () => renderCanvas(),
 });
 
-// The Document Header card — every document with frontmatter or `$head`. It has no host of its own:
-// The stage hands one over (`canvas-render.ts`), and this only starts the reactive subscription.
-frontmatterPanelMod.mount();
-
 // The assistant's create_project tool adopts freshly scaffolded projects through the same
 // Flow as the recent-projects list.
 setProjectAdopter(openRecentProject);
@@ -862,8 +903,20 @@ setImportHandoff(revealImportHandoff);
    one — see services/connection.ts for why only the chromium shell can. */
 watchConnection();
 
+/* What source control needs from the bootstrap: the two writes a comparison makes outside
+   `shell.git` (the Publish workspace's Before and after puts the file's own tab into git-diff), and
+   the clone flow, which ends by opening the project it cloned. */
+setSourceControlDeps({
+  cloneRepository: () => {
+    void cloneRepository({ openRecentProject });
+  },
+  setCanvasMode,
+  setGitDiffState: (state: GitDiffState | null) => {
+    shell.git.diffState = state;
+  },
+});
+
 leftPanelMod.mount({
-  cloneRepository: () => cloneRepository({ openRecentProject }),
   defBadgeLabel,
   defCategory,
   defaultDef,
@@ -871,7 +924,6 @@ leftPanelMod.mount({
   navigateToComponent,
   registerComponentsDnD,
   registerElementsDnD,
-  registerFileTreeDnD,
   registerLayersDnD,
   renderCanvas: () => renderCanvas(),
   // The Data panel's Refresh: a canvas re-render that ALSO lets automatic `Request` state entries
@@ -894,15 +946,8 @@ leftPanelMod.mount({
     }
     renderCanvas(paneId);
   },
-  renderFilesTemplate,
-  renderGitPanel,
-  renderHeadTemplate,
-  renderImportsTemplate,
   mountSignalsPanel,
   setCanvasMode,
-  setGitDiffState: (state: GitDiffState | null) => {
-    shell.git.diffState = state;
-  },
   webdata,
 });
 
@@ -911,7 +956,6 @@ leftPanelMod.mount({
 registerRenderer("leftPanel", () => leftPanelMod.render());
 registerRenderer("canvas", () => renderCanvas());
 registerRenderer("rightPanel", () => rightPanelMod.render());
-registerRenderer("frontmatterPanel", () => frontmatterPanelMod.render());
 registerRenderer("seoModal", renderSeoModal);
 registerRenderer("chatPanel", () => chatPanelMod.render());
 registerRenderer("overlays", () => overlaysPanel.render());
@@ -919,7 +963,7 @@ renderStatusbar();
 // The status bar mounts the jump bar too: the focused pane's breadcrumb trail is its DOCUMENT
 // Field, and the only breadcrumb in the shell.
 mountStatusbar();
-mountActivityBar();
+mount();
 
 /* The background-click deselect moved into `editor/shortcuts.ts`'s `installStageGestures`, beside
    the wheel and the middle-drag, because it is a STAGE gesture: it compared against the app's one
@@ -957,9 +1001,32 @@ function ensureFsSync() {
        of them wrong, and it is the same event for all four. The bar's memo is separate from
        `page-params`' because it is keyed per DOCUMENT rather than globally; leaving it behind kept
        a stale candidate list in the picker after the collection changed. */
-    invalidateDerivedCaches: () => {
+    invalidateDerivedCaches: (paths, structural = true) => {
       invalidatePageRouteCache();
       invalidateLayoutPickerCache();
+      invalidateSiteIndex(paths);
+      /* The Content workspace's three: the scan its collections are filtered from, the pages that
+         say where each collection is published, and the entry list the Collections panel draws.
+         Each is dropped only by a batch that can make it wrong, so a save does not re-walk the
+         project or blank the Collections panel (`contentCacheDrops`). */
+      const drops = contentCacheDrops(paths, structural);
+      if (drops.scan) {
+        invalidateLibrary();
+      }
+      if (drops.pages) {
+        invalidateCollectionPages();
+        invalidatePageSummaries();
+      }
+      if (drops.entries) {
+        invalidateEntrySummaries();
+        invalidateRepeaterSources();
+      }
+      /* The media listing is a walk of `public/` and every collection's `images/`, so only a batch
+         under one of them (or one that cannot say what changed) can make it wrong: a file added by
+         git, the OS or a Files-panel delete. */
+      if (paths === undefined || paths.some((path) => isMediaScanPath(path))) {
+        invalidateMediaCache();
+      }
       invalidateParamValues();
       paneContext.resetParamValues();
     },
@@ -975,18 +1042,18 @@ const _urlParams = new URLSearchParams(location.search);
 const _projectParam = _urlParams.get("project") || _urlParams.get("open");
 
 if (!_projectParam) {
-  // Electrobun (and other non-?project= hosts) load their project over RPC, so the ?project= branch
+  // The desktop app (and other non-?project= hosts) load their project over RPC, so the ?project= branch
   // Below — which is the only place that calls platform.activate() — is skipped. Kick off activate()
-  // Here UNCONDITIONALLY so this window's loopback canvasUrl is fetched on boot (the canvas iframe
-  // Needs it); a render() once it resolves lets ensureHost swap an early default iframe for the
-  // Loopback one (see iframe-host ensureHost's canvasUrl-changed rebuild).
+  // Here UNCONDITIONALLY so this window's canvasUrl is fetched on boot (the canvas iframe
+  // Needs it); a render() once it resolves lets ensureHost rebuild against it if it differs from
+  // The default (see iframe-host ensureHost's canvasUrl-changed rebuild).
   const _bootPlatform = getPlatform();
   // oxlint-disable-next-line unicorn/prefer-top-level-await -- fire-and-forget: must not block the initial render
   void _bootPlatform
-    .activate?.()
+    .activate()
     // No project is bound yet, so this call only warms the canvasUrl; a backend that refuses it
     // Still gets the render below rather than an unhandled rejection.
-    ?.catch((error: unknown) => {
+    .catch((error) => {
       // A refusal that offers an action is the action flow's to explain; it is not a fault.
       if (!isActionRequired(error)) {
         console.error("Boot activation failed:", error);
@@ -1018,18 +1085,14 @@ if (_projectParam) {
       // Report a bare `Error: <message>` because the only identifying fact was still block-scoped.
       let fileRelPath = _urlParams.get("file") || _projectParam;
       try {
-        const siteCtx = platform.resolveSiteContext
-          ? await platform.resolveSiteContext(_projectParam)
-          : { sitePath: null };
+        const siteCtx = await platform.resolveSiteContext(_projectParam);
 
         if (siteCtx.sitePath) {
           // Set PAL project root to absolute path so file ops work
           if (siteCtx.sitePath) {
             platform.projectRoot = siteCtx.sitePath;
             // Await activation so the server resolves project-relative static files
-            if (platform.activate) {
-              await platform.activate();
-            }
+            await platform.activate();
           }
 
           resetIgnoreCache();
@@ -1053,31 +1116,9 @@ if (_projectParam) {
           await ensureDependenciesInstalled();
           await loadComponentRegistry();
 
-          // Load directory tree and populate projectDirs from conventional dirs found
-          const conventionalDirs = new Set([
-            "pages",
-            "layouts",
-            "components",
-            "content",
-            "data",
-            "public",
-            "styles",
-          ]);
-          /* Through `loadDirectory`, not `platform.listDirectory`: this is the second copy of the
-             conventional-dir walk (the first is `openProject` in files/files.ts), and the loader is
-             what reads the `.gitignore` chain governing each directory. Listing around it left the
-             `?project=` boot as the one door into a project whose tree knew no ignore rules. */
-          await loadDirectory(".");
-          const dirEntries = requireProjectState().dirs.get(".") ?? [];
-          const foundDirs = [];
-          for (const e of dirEntries) {
-            if (e.type === "directory" && conventionalDirs.has(e.name)) {
-              foundDirs.push(e.name);
-              requireProjectState().expanded.add(e.path || e.name);
-              await loadDirectory(e.path || e.name);
-            }
-          }
-          requireProjectState().projectDirs = foundDirs;
+          /* Through `loadDirectory` (inside `loadProjectDirectories`), not `platform.listDirectory`:
+             the loader is what reads the `.gitignore` chain governing each directory. */
+          await loadProjectDirectories();
           void maybePromptJxsuiteUpdate(siteCtx.sitePath);
         }
 
@@ -1144,7 +1185,7 @@ if (_projectParam) {
           openTab({
             id: fileRelPath,
             documentPath: fileRelPath,
-            document: parsedDoc as JxMutableNode,
+            document: parsedDoc,
             ...(frontmatter != null && { frontmatter }),
             layout,
             sourceFormat: fileFormat?.name ?? null,
@@ -1294,10 +1335,32 @@ async function openProject(target: ProjectOpenTarget = "thisWindow"): Promise<Pr
   if (!(await tabStrip.confirmCloseAll("Opening another project"))) {
     return "cancelled";
   }
-  const opened = await _openProject({ renderLeftPanel });
+  const opened = await _openProject({ renderLeftPanel, resetProjectCaches });
   ensureFsSync();
   return opened ? "opened" : "cancelled";
 }
+/**
+ * The one project-switch reset of the caches panels keep for the project being left: the Site
+ * panel's index and filter, the media listing it and every image field read, and the Media
+ * workspace's own filter, search and selection. Both open paths run it (this file's
+ * `openRecentProject`, and `files.ts`'s `openProject` behind ⌘O, the toolbar and the welcome
+ * screen), so neither can show the previous project's pages or media.
+ */
+function resetProjectCaches(): void {
+  resetSitePanel();
+  resetContentView();
+  resetCollectionPages();
+  invalidatePageSummaries();
+  invalidateEntrySummaries();
+  invalidateRepeaterSources();
+  resetCollectionsPanel();
+  resetStylesPanel();
+  resetVariablesFocus();
+  resetWritingBanners();
+  invalidateMediaCache();
+  resetMediaLibrary();
+}
+
 async function openRecentProject(root: string) {
   // One entry for the whole sequence, not three surfaces for its three phases. Opening a project
   // Used to chain a blocking spinner (dependencies), a transient status line (git sync) and a
@@ -1355,9 +1418,10 @@ async function openRecentProject(root: string) {
     platform.projectRoot = root;
     // Source control, the stylebook selection and the settings tab describe the project being
     // Left behind; carrying them over showed the previous repository's branch and file count
-    // Under the new project's name. The poll timer is re-armed by the panel's next render.
-    cleanupGitPanel();
+    // Under the new project's name. The poll timer is re-armed by the Publish workspace's next mount.
+    cleanupSourceControl();
     resetProjectShell();
+    resetProjectCaches();
     // The format registry is cached per project — the previous root's registry (often empty on a
     // Fresh desktop launch) must not answer for this project, or non-JSON documents fail with
     // "No format class imported" until a reload. Mirrors openProject in files.ts.
@@ -1365,6 +1429,9 @@ async function openRecentProject(root: string) {
     void loadFormats();
     refreshExtensionUi(platform);
     const content = await platform.readFile("project.json");
+    /* SAFETY: This is `project.json` at the root the user chose to open, the project's own config
+       file whose schema is ProjectConfig; Studio edits it in that shape and does not re-validate it
+       on open, as the folder-picker path in `platforms/devserver.ts` does not either. */
     const config = JSON.parse(content) as ProjectConfig;
 
     closeAllTabs();
@@ -1389,28 +1456,11 @@ async function openRecentProject(root: string) {
     activity.step("Install dependencies");
     await ensureDependenciesInstalled();
     activity.step("Read the project");
-    await loadDirectory(".");
+    await loadProjectDirectories();
     await loadComponentRegistry();
 
-    const conventionalDirs = new Set([
-      "pages",
-      "layouts",
-      "components",
-      "content",
-      "data",
-      "public",
-      "styles",
-    ]);
-    const entries = requireProjectState().dirs.get(".") || [];
-    for (const e of entries) {
-      if (e.type === "directory" && conventionalDirs.has(e.name)) {
-        requireProjectState().expanded.add(e.path || e.name);
-        await loadDirectory(e.path || e.name);
-      }
-    }
-
     addRecentProject(requireProjectState().name, root);
-    setActivityTab("files");
+    // The Navigator shows the panel the workspace frame chose as the project opened (§22.3).
     renderLeftPanel();
     // The project's name is now permanent state in the status bar's PROJECT field.
 
@@ -1511,7 +1561,16 @@ registerStudioCommands(
 );
 
 // Tab navigation (⌃Tab MRU cycling, ⌘⇧T reopen-closed) is defined beside the tab model it drives.
-registerTabCommands(commandRegistry, { openFile: openFileInTab, openFileInPane });
+/* `pane.compareWith` opens into the other pane without moving the keyboard; a compared document of
+   another workspace would land hidden by that pane's strip, so it is revealed, which enters its
+   workspace (`workspace/workspace-switch.ts`). */
+registerTabCommands(commandRegistry, {
+  openFile: openFileInTab,
+  openFileInPane: async (paneId, path) => {
+    await openFileInPane(paneId, path);
+    revealInPane(paneId, path);
+  },
+});
 
 /* The derivation's own two verbs (§18.4), beside the `PaneDerivation` they read and write rather
    than in `paneCommands()`. `tests/app-commands-composition.test.ts` is the guard that this line
@@ -1527,6 +1586,28 @@ commandRegistry.registerAll(derivationCommands(derivationDeps));
  * available or what it does — that would be the second definition site the design exists to prevent
  * (§13).
  */
+/* The workspace's two halves (`workspace/workspace-switch.ts`): the follow, which enters a tab's
+   workspace whenever a tab is activated, and the switch `view.setWorkspace` runs, which puts a
+   workspace's tabs (or its home) on screen. The homes are handed in, so the switch imports
+   neither the homes' surfaces nor the settings document. */
+const workspaceDeps = {
+  openHome: (id: HomeWorkspaceId) => {
+    openWorkspaceHome(id);
+  },
+  // The Styles home: the view it was left in, Variables on a first visit (§7.1).
+  openStyles: () => {
+    showSettingsDocument();
+  },
+  placeHome: placeWorkspaceHome,
+  setInspectorTab: (tab: InspectorTabId) => rightPanelMod.setInspectorTab(tab),
+};
+installWorkspaceFollow(workspaceDeps);
+/** Show a workspace with the bootstrap's homes: what `view.setWorkspace` and a reopen both run. */
+function showWorkspaceWithHomes(id: WorkspaceId): void {
+  switchWorkspace(id, workspaceDeps);
+}
+// A project reopens in the workspace it was left in, once its documents are open (§22.1).
+setSessionWorkspaceShow(showWorkspaceWithHomes);
 registerShellViewCommands(commandRegistry, {
   // The registry's own answer, so a gated-off panel cannot be persisted as a showing tab.
   panelAvailable: (id) => {
@@ -1534,8 +1615,20 @@ registerShellViewCommands(commandRegistry, {
     return panel ? (panel.when?.(commandRegistry.context()) ?? true) : true;
   },
   inspectorTab: () => rightPanelMod.inspectorTab(),
+  restingInspectorTab: () => rightPanelMod.restingInspectorTab(),
   setInspectorTab: (tab) => rightPanelMod.setInspectorTab(tab),
+  showWorkspace: showWorkspaceWithHomes,
 });
+/* Back to a strip-less workspace's home (Media, Styles, Publish): the pane context bar's Back
+   control and Escape. The close goes through the strip's guarded close, so a view with unsaved
+   work still asks first. */
+commandRegistry.registerAll(
+  workspaceBackCommands({
+    closeTab: tabStrip.requestClose,
+    focusHome: focusWorkspaceHome,
+    setCanvasMode,
+  }),
+);
 registerCanvasViewCommands(commandRegistry, {
   getCanvasMode,
   renderPane: renderCanvas,
@@ -1546,7 +1639,7 @@ registerCanvasViewCommands(commandRegistry, {
 });
 /* A save moves the working tree under any comparison of that file, and nothing about a
    comparison notices on its own — see `noteFileSaved`. Injected rather than imported: `file-ops`
-   must not pull the Source Control panel into its graph. */
+   must not pull source control into its graph. */
 /* The second listener is the live chrome lane: a saved surface document or kit component re-mounts
    the roots it draws in THIS shell (studio-ui-guidelines.md §9.3). Inert for every project but the
    two the chrome comes from, by the saved path alone. */
@@ -1559,9 +1652,17 @@ const liveChrome = createLiveSurfaceSaver({
    Component Settings and the Library read the props the file has now rather than the ones the scan
    saw when the project opened. The Content tab and the Library are told, because neither reads the
    registry reactively. */
-setDocumentSavedListener((path, doc) => {
+setDocumentSavedListener((path, doc, tab) => {
   void noteFileSaved(path);
-  void liveChrome(path, doc as unknown as JxDocument);
+  // Any saved file can be data a repeater on the canvas reads; the next render asks again.
+  invalidateRepeaterSources();
+  // An entry's new title or status reaches the Collections panel and the Content home at once.
+  if (noteSavedEntry(path, entryFields(tab))) {
+    renderLeftPanel();
+  }
+  /* SAFETY: The listener fires for a tab's saved ROOT document, and a root document is a
+     JxDocument held in the editor's mutable node form; `liveChrome` only acts on surface paths. */
+  void liveChrome(path, doc as JxDocument);
   if (noteComponentSaved(path, doc)) {
     renderPropertiesPanel();
     renderLeftPanel();
@@ -1575,8 +1676,8 @@ commandRegistry.registerAll(diffCommands());
 ensurePopoverRevealWatch();
 registerSelectionSetCommand(commandRegistry);
 registerInspectorCommands(commandRegistry);
-/* Search appearance, behind one record with two buttons: the Document Header card's and the Page
-   panel's. A surface that IS the capability is one the palette cannot reach. */
+/* Search appearance, behind one record the Page tab's button runs: a surface that IS the capability
+   is one the palette cannot reach. */
 registerSeoCommands(commandRegistry);
 registerA11yCommands(commandRegistry);
 registerPopoverCommands(commandRegistry);
@@ -1597,9 +1698,11 @@ registerGridCommands(commandRegistry);
 registerSettingsCommands(commandRegistry);
 registerExtensionCommands(commandRegistry);
 registerPreferencesCommands(commandRegistry);
-registerLibraryCommands(commandRegistry);
+registerContentViewCommands(commandRegistry);
 registerFileFormatCommands(commandRegistry);
 registerContentCommands(commandRegistry);
+registerAddNewCommands(commandRegistry);
+registerMediaCommands(commandRegistry);
 /* The four translation verbs: open a sibling translation, create the missing one, show the
    Languages panel, declare a language. `i18n.switchLocale` is deliberately not among them — it sets
    a rendering context, so it lives with the other axis-3 verbs in `canvasViewCommands`. */
@@ -1643,7 +1746,7 @@ initShortcuts(commandRegistry, stageContext);
    which is what makes Preferences › Keyboard reach inside the page. */
 setKeymapSource(
   () => ({
-    chords: chordsInScopes(commandRegistry.keymap, FRAME_KEY_SCOPES),
+    chords: chordsInScopes(commandRegistry.keymap, FRAME_KEY_SCOPES, HOST_ONLY_COMMANDS),
     mac: commandRegistry.keymap.mac,
   }),
   (listener) => commandRegistry.keymap.onChange(listener),