@jxsuite/studio 5.5.0 → 5.7.0

package/src/studio.ts

@@ -94,7 +94,6 @@ import { runInsertZoneAction } from "./editor/insert-zone-action";
 import { canvasSlashHandler } from "./editor/canvas-slash-bridge";
 import { makeCanvasContextMenuHandler } from "./editor/canvas-context-menu";
 import { mountStatusbar, renderStatusbar } from "./surfaces/statusbar";
-import { mountJumpBar } from "./panels/jump-bar";
 import { cellForPane, paneGridReady } from "./panels/pane-grid";
 import { notify } from "./services/notify";
 import { createLiveSurfaceSaver } from "./services/live-surfaces";
@@ -126,8 +125,10 @@ import {
   openLastSessionOrHome,
   registerFileTreeDnD,
   reloadCleanTab,
+  reloadTabsIfChanged,
 } from "./files/files";
 import { resetIgnoreCache } from "./files/gitignore";
+import { resetAssetVersions } from "./files/asset-versions";
 import { startFsSync } from "./files/fs-events";
 import { invalidateParamValues } from "./page-params";
 import {
@@ -221,6 +222,8 @@ import {
 import { initCssData } from "./panels/style-utils";
 import { initQuickSearch } from "./panels/quick-search";
 import { hydrateAccountStatus } from "./account-status";
+import { showToastNotices, wireActionReports } from "./account/action-flow";
+import { isActionRequired } from "./platform-errors";
 import { hydrateProjectList } from "./project-list";
 import { addRecentProject, hydrateRecentProjects, removeRecentProject } from "./recent-projects";
 import {
@@ -507,6 +510,9 @@ toolbarPanel.mount(toolbarEl, {
 });
 
 initLayers();
+/* Before anything reaches the backend: an `action-required` refusal (desktop.md §10.4) can be the
+   answer to the very first request, and the dialog that offers its actions needs the layers above. */
+wireActionReports();
 initQuickSearch({ openRecentProject: (root: string) => openRecentProject(root) });
 
 /* The pane's four surfaces come from its CELL, not from `document.querySelector`.
@@ -909,11 +915,9 @@ registerRenderer("seoModal", renderSeoModal);
 registerRenderer("chatPanel", () => chatPanelMod.render());
 registerRenderer("overlays", () => overlaysPanel.render());
 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();
-// The jump bar, in the pane's own grid cell above the context bar. It renders the whole address
-// — project › file › node › node — and it is the only breadcrumb in the shell: the pane context
-// Bar drew a second one, and it named a sub-document stack nothing could push onto.
-mountJumpBar(primaryCell?.jump ?? document.createElement("div"));
 mountActivityBar();
 
 /* The background-click deselect moved into `editor/shortcuts.ts`'s `installStageGestures`, beside
@@ -959,6 +963,9 @@ function ensureFsSync() {
       paneContext.resetParamValues();
     },
     onContentChange: reloadCleanTab,
+    /* A reconnect re-reads the clean, non-collab tabs, and leaves every one whose content did not
+       change untouched: most reconnects changed nothing, and a reload is a repaint per tab. */
+    onResyncContent: reloadTabsIfChanged,
     renderLeftPanel,
   });
 }
@@ -979,7 +986,10 @@ if (!_projectParam) {
     // 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) => {
-      console.error("Boot activation failed:", 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);
+      }
     })
     .then(() => {
       render();
@@ -1022,6 +1032,7 @@ if (_projectParam) {
           }
 
           resetIgnoreCache();
+          resetAssetVersions();
           setProjectState({
             dirs: new Map(),
             expanded: new Set(),
@@ -1188,6 +1199,8 @@ void hydrateProjectList().then(() => {
 // The welcome screen's install prompt. No-op on platforms without getAccountStatus.
 // oxlint-disable-next-line unicorn/prefer-top-level-await -- deliberate fire-and-forget: hydration must not block initial render
 void hydrateAccountStatus().then(() => {
+  // After the status: the platform's one-time notices ride on it (desktop.md §10.4).
+  showToastNotices();
   render();
 });
 
@@ -1355,6 +1368,7 @@ async function openRecentProject(root: string) {
 
     closeAllTabs();
     resetIgnoreCache();
+    resetAssetVersions();
 
     setProjectState({
       ...projectState,

package/src/surfaces/block-action-bar.json

@@ -423,7 +423,12 @@
                           "body": [
                             {
                               "stopPropagation": true
-                            },
+                            }
+                          ]
+                        },
+                        "onchange": {
+                          "$prototype": "Function",
+                          "body": [
                             {
                               "operator": "call",
                               "target": {

package/src/surfaces/dialog.ts

@@ -96,6 +96,8 @@ export interface DialogSurfacePatch {
    */
   confirmLabel?: string;
   cancelLabel?: string;
+  /** The secondary button's text; the empty string takes the button away. */
+  secondaryLabel?: string;
   /** The sentence under the headline. Cleared by the empty string. */
   message?: string;
   value?: string;
@@ -298,6 +300,9 @@ export function openDialogSurface(options: DialogSurfaceOptions): DialogSurfaceH
       if (patch.cancelLabel !== undefined) {
         scope.cancelLabel = patch.cancelLabel;
       }
+      if (patch.secondaryLabel !== undefined) {
+        scope.secondaryLabel = patch.secondaryLabel;
+      }
       if (patch.message !== undefined) {
         scope.message = patch.message;
         scope.hasMessage = patch.message !== "";

package/src/surfaces/jump-bar.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://jxsuite.com/schema/v1",
   "$id": "StudioJumpBar",
-  "$description": "The jump bar: one pane's address, outermost step first, every step a command the adapter has already resolved against the registry. A step is a button when its command can run and a readout when it cannot — an address with a hole in it is a lie about containment, so a step never disappears. A step with more than one place to go carries the chevron that opens its siblings; one alternative is not a choice and draws no control. Nothing here decides what the bar says, which step is where you are, or what a chevron opens.",
+  "$description": "The jump bar: the focused pane's address as a breadcrumb trail, the document first and the selected element last, every step a command the adapter has already resolved against the registry. It is the status bar's DOCUMENT field, mounted into the slot `surfaces/statusbar.json` leaves for it. A step is a button when its command can run and a readout when it cannot — an address with a hole in it is a lie about containment, so a step never disappears. A step with more than one place to go carries the chevron that opens its siblings, upward, because the bar is the window's floor; one alternative is not a choice and draws no control. Nothing here decides what the bar says, which step is where you are, or what a chevron opens.",
   "tagName": "nav",
   "attributes": {
     "part": "bar",
@@ -10,22 +10,18 @@
     "hidden": "${state.empty ? '' : null}"
   },
   "style": {
-    "$description": "The `.jump-bar` rules the bar used to take from `styles/shell.css`, brought here and re-valued onto the kit's own layer. It scrolls rather than wraps — a deep selection must not push the stage down by a second line — and the overflow is taken at the START, because the leaf is the part being read. The height is the one number this file shares with its adapter: the stage's `--jump-bar-h` offset must be the box this rule draws.",
+    "$description": "A field of the status bar, so it takes the bar's own row, font and colour rather than drawing a band of its own. It scrolls rather than wraps, because a deep selection must not grow the status bar a second line.",
     "display": "flex",
     "alignItems": "center",
     "gap": "1px",
-    "height": "24px",
-    "padding": "0 var(--jx-space-3)",
+    "flex": "1",
+    "height": "100%",
+    "padding": "0 var(--jx-space-2)",
     "minWidth": "0",
     "overflowX": "auto",
     "scrollbarWidth": "none",
     "whiteSpace": "nowrap",
     "boxSizing": "border-box",
-    "fontFamily": "var(--jx-font-sans)",
-    "fontSize": "var(--jx-text-xs)",
-    "color": "var(--jx-fg-dim)",
-    "background": "var(--jx-bg-panel)",
-    "borderBottom": "1px solid var(--jx-border)",
     "&[hidden]": {
       "display": "none"
     },
@@ -44,7 +40,7 @@
       "opacity": "0.6"
     },
     "& [part=\"crumb\"]": {
-      "maxWidth": "28ch",
+      "maxWidth": "32ch",
       "overflow": "hidden",
       "margin": "0",
       "padding": "0 var(--jx-space-2)",
@@ -74,7 +70,8 @@
     },
     "& [part=\"crumb\"][aria-current]": {
       "$description": "Where you ARE is stated by weight, not by taking the control away: the leaf still selects, which is how a stray click in the canvas is undone without leaving the bar.",
-      "color": "var(--jx-fg)"
+      "color": "var(--jx-fg)",
+      "fontWeight": "600"
     },
     "& span[part=\"crumb\"]": {
       "$description": "A step with no runnable command is a readout, not a dead button. No hover, no pointer, no promise.",
@@ -213,7 +210,7 @@
                   "aria-label": "${$map.item.altsLabel}",
                   "title": "${$map.item.altsLabel}"
                 },
-                "textContent": "⌄",
+                "textContent": "⌃",
                 "onclick": {
                   "$prototype": "Function",
                   "body": [

package/src/surfaces/jump-bar.ts

@@ -4,19 +4,18 @@
  *
  * `jump-bar.json` is the markup, the ARIA and the style; `panels/jump-bar.ts` is the flow — which
  * pane this bar is about, what its address is, which of its steps the registry can actually run,
- * and what a chevron opens. This module is the seam between them: one scope per pane, one document
- * mounted into that pane's cell, and an `update()` that ASSIGNS rather than re-mounts.
+ * and what a chevron opens. This module is the seam between them: one scope, one document mounted
+ * into the slot the status bar leaves for it, and an `update()` that ASSIGNS rather than
+ * re-mounts.
  *
- * **One mount per pane, not one per bar.** Two cells draw two addresses, so `attachJumpBarHost`
- * hands this module a host per pane and gets a handle back. The scope is reactive, so a repaint is
- * an assignment to `segments` and the keyed `$map` reconciles: a step whose key survives keeps its
- * node, and the chevron the reader is aiming at does not move under them.
+ * The scope is reactive, so a repaint is an assignment to `segments` and the keyed `$map`
+ * reconciles: a step whose key survives keeps its node, and the chevron the reader is aiming at
+ * does not move under them.
  *
- * **The bar hides rather than un-mounts when a pane has no address.** A pane with no tab open has
- * no address to print, and the document's own `hidden` is what takes it off the screen — the mount
- * stays, because the next tab open is one assignment away and re-mounting would cost a frame of
- * blank chrome. The stage's `--jump-bar-h` offset is written by the flow, which is the one number
- * this surface and its stylesheet-free document share.
+ * **The bar hides rather than un-mounts when there is no address.** With no tab open there is
+ * nothing to print, and the document's own `hidden` takes it off the screen — the mount stays,
+ * because the next tab open is one assignment away and re-mounting would cost a frame of blank
+ * chrome.
  *
  * @docs studio/interface
  */
@@ -81,13 +80,13 @@ interface JumpBarScope extends Record<string, unknown>, JumpBarActions {
 }
 
 /**
- * Mount one pane's bar into the host its cell built for it.
+ * Mount the bar into the slot the status bar built for it.
  *
- * The host is CLEARED first: a cell hands the bar a slot of its own, and whatever was in it belongs
- * to a pane this bar is no longer drawing.
+ * The host is CLEARED first: the slot is the bar's own, and whatever was in it belongs to a mount
+ * this bar is no longer drawing.
  *
- * @param {HTMLElement} host The cell's slot for the bar.
- * @param {string} region The `data-jx-region` the bar stamps on itself — `pane.<id>/jump`.
+ * @param {HTMLElement} host The status bar's slot for the bar.
+ * @param {string} region The `data-jx-region` the bar stamps on itself — `statusbar/document`.
  * @param {JumpBarActions} actions What a press does. Read once, when the scope is made.
  * @returns {JumpBarSurface}
  */

package/src/surfaces/pane-context.json

@@ -497,7 +497,7 @@
                                       "$ref": "#/state/previewHint"
                                     }
                                   },
-                                  "onclick": {
+                                  "onchange": {
                                     "$prototype": "Function",
                                     "body": [
                                       {
@@ -1227,7 +1227,7 @@
                                 "$ref": "$map/item/hint"
                               }
                             },
-                            "onclick": {
+                            "onchange": {
                               "$prototype": "Function",
                               "body": [
                                 {

package/src/surfaces/pane-grid.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://jxsuite.com/schema/v1",
   "$id": "StudioPaneGrid",
-  "$description": "The pane grid (studio.md §18.1): one cell per pane, with a splitter before every cell but the first. Every box here is EMPTY by design — the FIVE inside a cell are hosts other modules fill (`panels/tab-strip.ts` the strip, `panels/jump-bar.ts` the jump bar, `panels/pane-context.ts` the chrome layer, `canvas/canvas-render.ts` the stage, `panels/pane-grid.ts` itself the right-edge drop zone), and the stage is an ISLAND in the studio-ui-guidelines.md §9.4 sense: the canvas host mounts a cross-origin `<iframe>` into it, so nothing this document draws may ever go inside it. What the document owns is the STRUCTURE and the STYLE — the cell's own two-row grid, the three row-2 children that share its lower cell, and the splitter — which is `styles/shell.css`'s `.pane*` block and `styles/canvas.css`'s `.pane-stage` rule, carried here and keyed on `part`. Two things are load-bearing and easy to undo. (1) **A row that moves reloads an iframe**, so the keyed `$map` is not an optimisation: `workspace.panes[0]` is always the primary and `MAX_PANES` is 2, the key is the pane id, and the runtime's forward-cursor pass therefore never moves a kept row — gaining or losing the side pane leaves the primary's node, and the frame inside it, untouched. (2) **The splitter must sit BETWEEN two cells and inside neither**, so each row is a `display: contents` wrapper holding its own leading splitter and its cell: the wrapper generates no box, so the splitter and the two cells are the grid items of `#pane-grid` in DOM order, and a pointer landing on the splitter is in no cell at all. Every selector below is a `>` chain from the root, because a pane's stage hosts other surface documents and a bare `[part=\"row\"]` descendant rule would reach into them.",
+  "$description": "The pane grid (studio.md §18.1): one cell per pane, with a splitter before every cell but the first. Every box here is EMPTY by design — the FOUR inside a cell are hosts other modules fill (`panels/tab-strip.ts` the strip, `panels/pane-context.ts` the chrome layer, `canvas/canvas-render.ts` the stage, `panels/pane-grid.ts` itself the right-edge drop zone), and the stage is an ISLAND in the studio-ui-guidelines.md §9.4 sense: the canvas host mounts a cross-origin `<iframe>` into it, so nothing this document draws may ever go inside it. What the document owns is the STRUCTURE and the STYLE — the cell's own two-row grid, the three row-2 children that share its lower cell, and the splitter — which is `styles/shell.css`'s `.pane*` block and `styles/canvas.css`'s `.pane-stage` rule, carried here and keyed on `part`. Two things are load-bearing and easy to undo. (1) **A row that moves reloads an iframe**, so the keyed `$map` is not an optimisation: `workspace.panes[0]` is always the primary and `MAX_PANES` is 2, the key is the pane id, and the runtime's forward-cursor pass therefore never moves a kept row — gaining or losing the side pane leaves the primary's node, and the frame inside it, untouched. (2) **The splitter must sit BETWEEN two cells and inside neither**, so each row is a `display: contents` wrapper holding its own leading splitter and its cell: the wrapper generates no box, so the splitter and the two cells are the grid items of `#pane-grid` in DOM order, and a pointer landing on the splitter is in no cell at all. Every selector below is a `>` chain from the root, because a pane's stage hosts other surface documents and a bare `[part=\"row\"]` descendant rule would reach into them.",
   "tagName": "div",
   "attributes": {
     "part": "grid",
@@ -27,7 +27,7 @@
       "zIndex": "10"
     },
     "& > [part=\"row\"] > [part=\"pane\"]": {
-      "$description": "ONE PANE, and one COLUMN, declared. Four children name `grid-row: 2` in order to share the lower cell, and auto-placement answers that by inventing an implicit column each: the jump bar, the chrome layer, the stage and the drop zone lined up side by side, the stage taking a third of the pane and pinning the document to the right edge. `grid-template-columns` is what makes \"share the cell\" mean it, and every row-2 child restates `grid-column: 1` so a future fifth one cannot re-open the same hole. No unit test can see this — happy-dom does no layout, so every rect is zero — which is why the screenshot lane is what caught it.",
+      "$description": "ONE PANE, and one COLUMN, declared. Three children name `grid-row: 2` in order to share the lower cell, and auto-placement answers that by inventing an implicit column each: the chrome layer, the stage and the drop zone lined up side by side (with a fourth, the jump bar, that has since moved to the status bar), the stage taking a fraction of the pane and pinning the document to the right edge. `grid-template-columns` is what makes \"share the cell\" mean it, and every row-2 child restates `grid-column: 1` so a future fourth one cannot re-open the same hole. No unit test can see this — happy-dom does no layout, so every rect is zero — which is why the screenshot lane is what caught it.",
       "display": "grid",
       "gridTemplateColumns": "minmax(0, 1fr)",
       "gridTemplateRows": "auto minmax(0, 1fr)",
@@ -44,21 +44,10 @@
       "$description": "A pane with nothing to say costs no band. The strip host is empty until `panels/tab-strip.ts` mounts a document into it, and empty again the moment it disposes.",
       "display": "none"
     },
-    "& > [part=\"row\"] > [part=\"pane\"] > [part=\"jump\"]": {
-      "$description": "The jump bar. Like the chrome layer below it this shares the pane's lower cell rather than owning a row, so the two bars stack OVER the stage instead of pushing it down. `align-self: start` is what keeps it the height of its own content instead of the height of the cell, so the bar never covers the stage it sits above.",
-      "gridRow": "2",
-      "gridColumn": "1",
-      "alignSelf": "start",
-      "position": "relative",
-      "zIndex": "3",
-      "minWidth": "0",
-      "maxWidth": "100%"
-    },
     "& > [part=\"row\"] > [part=\"pane\"] > [part=\"chrome\"]": {
-      "$description": "The pane context bar and the floating zoom pod. The layer itself is inert and only its children take the pointer; `surfaces/pane-context.json` owns what they look like. Offset by `--jump-bar-h` for the same reason the stage is: the jump bar is stacked over this same cell, and one projection per bar is what keeps \"no tab open\" costing no dead band.",
+      "$description": "The pane context bar and the floating zoom pod. The layer itself is inert and only its children take the pointer; `surfaces/pane-context.json` owns what they look like.",
       "gridRow": "2",
       "gridColumn": "1",
-      "marginTop": "var(--jump-bar-h, 0px)",
       "position": "relative",
       "zIndex": "2",
       "minWidth": "0",
@@ -71,10 +60,10 @@
       "pointerEvents": "auto"
     },
     "& > [part=\"row\"] > [part=\"pane\"] > [part=\"pane-stage\"]": {
-      "$description": "The stage: the pane's own axis (`styles/canvas.css`) over its placement in the cell (`styles/shell.css`). Offset by the SUM of the two bars stacked over this cell — `--jump-bar-h` (written by `panels/jump-bar.ts`) and `--pane-context-h` (by `panels/pane-context.ts`), both onto the CELL, which is why this reads them by cascade — so neither ever covers the document, and by zero when no tab is open, so the welcome screen does not sit under a band nothing explains. Two variables rather than one total: each bar owns its own answer, and a bar that renders nothing writes 0 without knowing the other exists.",
+      "$description": "The stage: the pane's own axis (`styles/canvas.css`) over its placement in the cell (`styles/shell.css`). Offset by the context bar stacked over this cell — `--pane-context-h`, written by `panels/pane-context.ts` onto the CELL, which is why this reads it by cascade — so the bar never covers the document, and by zero when no tab is open, so the welcome screen does not sit under a band nothing explains. A pane's address used to be a second bar stacked here (`--jump-bar-h`); it is the status bar's breadcrumb trail now, and costs the stage nothing.",
       "gridRow": "2",
       "gridColumn": "1",
-      "marginTop": "calc(var(--jump-bar-h, 0px) + var(--pane-context-h, 0px))",
+      "marginTop": "var(--pane-context-h, 0px)",
       "position": "relative",
       "overflow": "auto",
       "background": "var(--bg-panel)",
@@ -84,7 +73,7 @@
       "alignItems": "flex-start"
     },
     "& > [part=\"row\"] > [part=\"pane\"] > [part=\"drop-zone\"]": {
-      "$description": "The right-edge target that creates a second pane (§18.1). Sits ABOVE the stage (`z-index: 4` against the stage's own stacking, jump's 3, chrome's 2) so a drag reaches it before it reaches the cross-origin iframe underneath, which would otherwise swallow every drag event with no affordance to say so. `pointer-events: none` when unarmed — a mouse doing anything other than dragging a tab or a file must pass straight through to the stage — and `auto` only while `data-armed` is set, which `panels/pane-grid.ts`'s own arming monitor writes for the DURATION of a drag it recognises, never for a click.",
+      "$description": "The right-edge target that creates a second pane (§18.1). Sits ABOVE the stage (`z-index: 4` against the stage's own stacking, chrome's 2) so a drag reaches it before it reaches the cross-origin iframe underneath, which would otherwise swallow every drag event with no affordance to say so. `pointer-events: none` when unarmed — a mouse doing anything other than dragging a tab or a file must pass straight through to the stage — and `auto` only while `data-armed` is set, which `panels/pane-grid.ts`'s own arming monitor writes for the DURATION of a drag it recognises, never for a click.",
       "gridRow": "2",
       "gridColumn": "1",
       "position": "relative",
@@ -108,7 +97,7 @@
   },
   "children": [
     {
-      "$description": "Keyed on the PANE ID, and that is the whole of §18.1 rule 1's structural half: the key is what makes the runtime MOVE a kept row rather than rebuild it, and re-parenting is not a move for an `<iframe>` — it reloads, dropping its `iframe-channel` connection, its shadow document and every `ready` panel with it. A row renders complete (its cell, its five hosts and its splitter) inside the row's own effect scope before it is inserted, so there is no frame in which a cell exists with no stage inside it.",
+      "$description": "Keyed on the PANE ID, and that is the whole of §18.1 rule 1's structural half: the key is what makes the runtime MOVE a kept row rather than rebuild it, and re-parenting is not a move for an `<iframe>` — it reloads, dropping its `iframe-channel` connection, its shadow document and every `ready` panel with it. A row renders complete (its cell, its four hosts and its splitter) inside the row's own effect scope before it is inserted, so there is no frame in which a cell exists with no stage inside it.",
       "$prototype": "Array",
       "items": { "$ref": "#/state/rows" },
       "key": { "$ref": "$map/item/id" },
@@ -181,13 +170,7 @@
                 }
               },
               {
-                "$description": "The jump bar and the context bar are HANDED this box rather than resolving a region into it. They cannot resolve one the way the strip does: nothing inside the strip re-stamps `pane.<id>/tabs`, while both bars stamp `pane.<id>/jump` and `pane.<id>/context` on markup they render INSIDE these two divs — so a region on the wrapper as well would put the same id on two nested elements, and `resolveRegion` takes the LAST match. Sixty shots crop `pane.primary/context`; a second, larger element carrying it is a silently widened crop.",
-                "tagName": "div",
-                "attributes": {
-                  "part": "jump"
-                }
-              },
-              {
+                "$description": "The context bar is HANDED this box rather than resolving a region into it. It cannot resolve one the way the strip does: nothing inside the strip re-stamps `pane.<id>/tabs`, while the context bar stamps `pane.<id>/context` on markup it renders INSIDE this div — so a region on the wrapper as well would put the same id on two nested elements, and `resolveRegion` takes the LAST match. Sixty shots crop `pane.primary/context`; a second, larger element carrying it is a silently widened crop.",
                 "tagName": "div",
                 "attributes": {
                   "part": "chrome"

package/src/surfaces/pane-grid.ts

@@ -35,10 +35,10 @@ registerSurface("pane-grid", paneGridDoc as unknown as JxDocument);
 /**
  * The `part` a pane's CELL carries.
  *
- * `panels/jump-bar.ts` and `panels/pane-context.ts` both write a `--*-h` custom property onto the
- * cell so the stage can read it back by cascade, and each is handed a box inside the cell rather
- * than the cell itself — so both resolve it with {@link PANE_SELECTOR}. It replaces a `.pane`
- * class: a converted surface emits none, and a `part` is the hook a document offers instead.
+ * `panels/pane-context.ts` writes a `--*-h` custom property onto the cell so the stage can read it
+ * back by cascade, and it is handed a box inside the cell rather than the cell itself — so it
+ * resolves the cell with {@link PANE_SELECTOR}. It replaces a `.pane` class: a converted surface
+ * emits none, and a `part` is the hook a document offers instead.
  */
 export const PANE_PART = "pane";
 
@@ -63,13 +63,12 @@ export const PANE_SELECTOR = `[part="${PANE_PART}"]`;
  */
 export const STAGE_SELECTOR = `[part="${STAGE_PART}"]`;
 
-/** The six boxes a cell is made of, in the order the document draws them. */
-export type PaneCellPart = "pane" | "strip" | "jump" | "chrome" | "stage" | "dropZone";
+/** The five boxes a cell is made of, in the order the document draws them. */
+export type PaneCellPart = "pane" | "strip" | "chrome" | "stage" | "dropZone";
 
 const CELL_PARTS: ReadonlyMap<string, PaneCellPart> = new Map([
   ["pane", "pane"],
   ["strip", "strip"],
-  ["jump", "jump"],
   ["chrome", "chrome"],
   ["pane-stage", "stage"],
   ["drop-zone", "dropZone"],
@@ -234,7 +233,7 @@ export function mountPaneGridSurface(
   const ready = mountSurface("pane-grid", scope, host, {
     /* No `instanceof` narrowing and no "is there a pane" guard, and both absences are structural.
        `pane-grid.json` draws no text and no `textContent`, so every node the runtime reports here
-       is an element; and the six cell parts exist only inside the repeater's rows, so a `$map`
+       is an element; and the five cell parts exist only inside the repeater's rows, so a `$map`
        scope is always there to name the pane. A guard on either would be a branch the document
        cannot reach — which is a line no test could ever cover, which is a claim nothing checks. */
     onNodeCreated: (element, _path, def, state) => {

package/src/surfaces/statusbar.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://jxsuite.com/schema/v1",
   "$id": "StudioStatusbar",
-  "$description": "The status bar: ambient state in the shell's level order, PROJECT then DOCUMENT then SELECTION. The adapter hands in `fields`, each with its region and its items; an item with a command is a button that runs it through `run`, and an item without one is a readout. Nothing here decides what the bar says.",
+  "$description": "The status bar: ambient state in the shell's level order, PROJECT then DOCUMENT then SELECTION. The adapter hands in the fields either side of the DOCUMENT field (`leading` and `trailing`), each with its region and its items; an item with a command is a button that runs it through `run`, and an item without one is a readout. The DOCUMENT field between them is the `trail` slot, an empty box `panels/jump-bar.ts` mounts the breadcrumb trail into. Nothing here decides what the bar says.",
   "tagName": "div",
   "attributes": { "part": "bar" },
   "style": {
@@ -17,7 +17,17 @@
       "padding": "0 var(--jx-space-3)"
     },
     "& > [part=\"field\"]:last-child": { "overflow": "hidden" },
-    "& > [part=\"field\"] + [part=\"field\"]": { "borderLeft": "1px solid var(--jx-border)" },
+    "& > :not([hidden]) ~ :not([hidden])": {
+      "$description": "A rule between fields rather than a run of \"|\" characters: the boundary between PROJECT, DOCUMENT and SELECTION is structural. Every visible field after a visible field draws one, so a hidden DOCUMENT slot leaves no doubled rule behind.",
+      "borderLeft": "1px solid var(--jx-border)"
+    },
+    "& > [part=\"trail\"]": {
+      "$description": "The DOCUMENT field, filled by `panels/jump-bar.ts`. It takes the width the other two fields leave, so a deep trail scrolls inside it instead of pushing the SELECTION field off the bar.",
+      "display": "flex",
+      "flex": "1",
+      "minWidth": "0"
+    },
+    "& > [part=\"trail\"][hidden]": { "display": "none" },
     "& [part=\"item\"], & [part=\"state\"]": {
       "maxWidth": "32ch",
       "overflow": "hidden",
@@ -43,7 +53,65 @@
   "children": [
     {
       "$prototype": "Array",
-      "items": { "$ref": "#/state/fields" },
+      "items": { "$ref": "#/state/leading" },
+      "key": { "$ref": "$map/item/id" },
+      "map": {
+        "tagName": "div",
+        "attributes": { "part": "field", "data-jx-region": "${$map.item.region}" },
+        "children": [
+          {
+            "$prototype": "Array",
+            "items": { "$ref": "$map/item/items" },
+            "key": { "$ref": "$map/item/key" },
+            "map": {
+              "tagName": "span",
+              "attributes": { "part": "slot" },
+              "style": { "display": "contents" },
+              "$switch": { "$ref": "$map/item/kind" },
+              "cases": {
+                "button": {
+                  "tagName": "button",
+                  "attributes": {
+                    "part": "item",
+                    "type": "button",
+                    "title": "${$map.item.title}",
+                    "disabled": { "$ref": "$map/item/disabled" }
+                  },
+                  "textContent": "${$map.item.label}",
+                  "onclick": {
+                    "$prototype": "Function",
+                    "body": [
+                      {
+                        "operator": "call",
+                        "target": { "$ref": "#/state/run" },
+                        "value": [{ "$ref": "$map/item/key" }]
+                      }
+                    ]
+                  }
+                },
+                "state": {
+                  "tagName": "span",
+                  "attributes": { "part": "state", "title": "${$map.item.title}" },
+                  "textContent": "${$map.item.label}"
+                }
+              }
+            }
+          }
+        ]
+      }
+    },
+    {
+      "$description": "The DOCUMENT field's slot. Empty by design: the jump bar is handed this box and mounts its own document into it, so nothing here may ever render a child. `aria-live=\"off\"` because the bar's host is the app's polite status region, and a trail that changes on every click in the canvas would be read aloud on every click; the trail is a `nav` a reader visits, not news.",
+      "tagName": "div",
+      "attributes": {
+        "part": "trail",
+        "aria-live": "off",
+        "hidden": "${state.hasDocument ? null : ''}"
+      }
+    },
+    {
+      "$prototype": "Array",
+      "items": { "$ref": "#/state/trailing" },
       "key": { "$ref": "$map/item/id" },
       "map": {
         "tagName": "div",