@jxsuite/studio 6.1.1 → 6.1.2

package/src/panels/block-action-bar.ts

@@ -34,7 +34,7 @@
  * @docs studio/interface/canvas
  */
 
-import { displayTagName } from "@jxsuite/schema/guards";
+import { displayTagName, isMappedArray, isNonNullObject, isNumber } from "@jxsuite/schema/guards";
 import { focusItem } from "@jxsuite/ui/behaviors/action-group";
 import { draggable } from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
 import { disableNativeDragPreview } from "@atlaskit/pragmatic-drag-and-drop/element/disable-native-drag-preview";
@@ -49,6 +49,7 @@ import {
 } from "../store";
 import { activeTab } from "../workspace/workspace";
 import { activeCanvasSurface, stageContaining } from "../canvas/canvas-surface";
+import { stageOf } from "../canvas/surface-registry";
 import { panelOfSurface } from "../canvas/canvas-helpers";
 import { primarySelection, structuralBatch } from "../tabs/selection";
 import {
@@ -235,7 +236,7 @@ function barPosition(anchor: {
      pointing at a node the card is covering. Everywhere else there is no scroller and the stage is
      the viewport, as it always was. */
   const surface = activeCanvasSurface();
-  const viewport = panelOfSurface(surface)?.scrollContainer ?? surface.wrap;
+  const viewport = panelOfSurface(surface)?.scrollContainer ?? stageOf(surface);
   const box = viewport ? rectOf(viewport) : null;
   if (box && (anchor.top + anchor.height < box.top || anchor.top > box.bottom)) {
     return null;
@@ -324,23 +325,28 @@ export function formatCommands(): AnyCommand[] {
     title: string,
     icon: string,
     keybinding?: string,
-  ): AnyCommand => ({
-    category: "Edit",
-    group: "6_format",
-    icon,
-    id: `format.${command}`,
-    ...(keybinding === undefined ? {} : { keybinding }),
-    keyScope: "caret",
-    level: "selection",
-    menus: ["blockbar/format", "palette"],
-    requires: "a text caret in the canvas",
-    run: () => {
-      postApplyFormat({ command });
-    },
-    title,
-    undo: "document",
-    when: (ctx: CommandContext) => ctx.caret.inCanvas,
-  });
+  ): AnyCommand => {
+    const entry: AnyCommand = {
+      category: "Edit",
+      group: "6_format",
+      icon,
+      id: `format.${command}`,
+      keyScope: "caret",
+      level: "selection",
+      menus: ["blockbar/format", "palette"],
+      requires: "a text caret in the canvas",
+      run: () => {
+        postApplyFormat({ command });
+      },
+      title,
+      undo: "document",
+      when: (ctx: CommandContext) => ctx.caret.inCanvas,
+    };
+    if (keybinding !== undefined) {
+      entry.keybinding = keybinding;
+    }
+    return entry;
+  };
 
   return [
     record("bold", "Bold", "text-b", "mod+b"),
@@ -493,7 +499,7 @@ function structuralTarget(path: JxPath | null = commandTargetPath()): Structural
   }
   const index = childIndex(path);
   const parentPath = parentElementPath(path);
-  if (typeof index !== "number" || !parentPath) {
+  if (!isNumber(index) || !parentPath) {
     return null;
   }
   const parentNode = getNodeAtPath(tab.doc.document, parentPath);
@@ -510,7 +516,7 @@ function structuralTarget(path: JxPath | null = commandTargetPath()): Structural
  * block, not a container, and nesting a block inside it produces invalid markup.
  */
 function isContainerNode(node: JxMutableNode | string | null | undefined): boolean {
-  if (!node || typeof node !== "object") {
+  if (!isNonNullObject(node)) {
     return false;
   }
   if (VOID_ELEMENTS.has((displayTagName(node.tagName) || "div").toLowerCase())) {
@@ -521,11 +527,10 @@ function isContainerNode(node: JxMutableNode | string | null | undefined): boole
     return false;
   }
   if (!Array.isArray(children)) {
-    return (children as unknown as Record<string, unknown>).$prototype === "Array";
+    return isMappedArray(children);
   }
   return (
-    children.length === 0 ||
-    children.some((c) => typeof c === "object" && c !== null && !isInlineElement(c, node))
+    children.length === 0 || children.some((c) => isNonNullObject(c) && !isInlineElement(c, node))
   );
 }
 
@@ -549,7 +554,7 @@ function canMoveOut(): boolean {
   return (
     target !== null &&
     parentElementPath(target.parentPath) !== null &&
-    typeof childIndex(target.parentPath) === "number"
+    isNumber(childIndex(target.parentPath))
   );
 }
 
@@ -598,7 +603,7 @@ function moveTargetOut(): void {
   }
   const grandparent = parentElementPath(target.parentPath);
   const parentIndex = childIndex(target.parentPath);
-  if (!grandparent || typeof parentIndex !== "number") {
+  if (!grandparent || !isNumber(parentIndex)) {
     return;
   }
   transactDoc(target.tab, (t) => mutateMoveNode(t, target.path, grandparent, parentIndex + 1));
@@ -1040,7 +1045,7 @@ export function showCommandOverflow(
     commands.map((command, index) => {
       const chord = registry.keymap.formatBinding(command.id);
       const reason = registry.disabledReason(command.id);
-      return {
+      const row: MenuRowProjection = {
         destructive: command.destructive === true,
         disabled: reason !== undefined,
         dividerAbove: index > 0 && command.destructive === true,
@@ -1049,9 +1054,14 @@ export function showCommandOverflow(
           runCommand(registry, command.id, target);
         },
         title: command.title,
-        ...(chord ? { chord } : {}),
-        ...(reason === undefined ? {} : { requires: reason }),
       };
+      if (chord) {
+        row.chord = chord;
+      }
+      if (reason !== undefined) {
+        row.requires = reason;
+      }
+      return row;
     });
   const rows = target ? withCommandTarget(target, project) : project();
   _overflowHandle = openMenu({
@@ -1079,7 +1089,7 @@ export function showCommandOverflow(
 function returnFocusToCanvas(): void {
   // The FOCUSED pane's stage: the keyboard came from there and is going back there. Resolving it
   // From the active tab answered with whichever pane displays that document first.
-  const stage = activeCanvasSurface().wrap;
+  const stage = stageOf(activeCanvasSurface());
   const iframe = stage?.querySelector<HTMLElement>("iframe.jx-canvas-iframe");
   (iframe ?? stage)?.focus();
 }
@@ -1118,9 +1128,9 @@ export function handleBlockBarEntryKey(e: KeyboardEvent): void {
  * The tags this node may be converted into — empty for a component instance and for a repeater,
  * whose content is a `map` template rather than a tag.
  *
- * @param {JxMutableNode | null} node
+ * @param {JxMutableNode | null | undefined} node
  */
-function convertTargetsFor(node: JxMutableNode | null): SlashCommand[] {
+function convertTargetsFor(node: JxMutableNode | null | undefined): SlashCommand[] {
   if (!node) {
     return [];
   }
@@ -1130,10 +1140,11 @@ function convertTargetsFor(node: JxMutableNode | null): SlashCommand[] {
     return [];
   }
   const children = childList(node);
+  const [first] = children;
   const isEmpty =
     !node.textContent &&
     (children.length === 0 ||
-      (children.length === 1 && typeof children[0] === "object" && children[0]?.tagName === "br"));
+      (children.length === 1 && isNonNullObject(first) && first.tagName === "br"));
   return getConvertTargets((literal || "div").toLowerCase(), isEmpty);
 }
 
@@ -1173,7 +1184,7 @@ function openConvertMenu(anchor: HTMLElement): void {
  */
 function openMergeTagMenu(anchor: HTMLElement): void {
   const tab = activeTab.value;
-  const state = (tab?.doc.document.state ?? {}) as Record<string, unknown>;
+  const state = tab?.doc.document.state ?? {};
   // The live resolved scope lives inside the iframe realm and is not threaded out, so the parent
   // Offers only top-level `state.*` tokens (buildMergeTags tolerates the null scopes).
   const tags = buildMergeTags(state, null, null);
@@ -1186,7 +1197,7 @@ function openMergeTagMenu(anchor: HTMLElement): void {
   if (arrayNode && tab) {
     const tokens = resolveRepeaterItemFields(
       arrayNode,
-      tab.doc.document.state as Record<string, unknown>,
+      tab.doc.document.state,
       projectState?.projectConfig,
     );
     tags.push(...buildRepeaterTagsFromFields(tokens));

package/src/panels/bottom-dock.ts

@@ -37,7 +37,7 @@
  * registered from here, like every other tab of this dock.
  */
 
-import { render as litRender, nothing } from "lit-html";
+import { render, nothing } from "lit-html";
 import { effect, effectScope } from "../reactivity";
 import {
   BOTTOM_TAB_IDS,
@@ -141,6 +141,8 @@ export function activeBottomPanel(ctx: CommandContext = panelContext()): PanelRe
  */
 function bottomContext(): NavigatorPanelContext {
   return {
+    /* SAFETY: no Bottom dock panel reads `deps` (see above): Problems and Activity render from their
+       own stores and Logic from `activeTab`, so this empty stand-in is never dereferenced. */
     deps: {} as NavigatorPanelDeps,
     doc: null,
     rerender: renderBottomDock,
@@ -296,7 +298,7 @@ function paintBody(): void {
     return;
   }
   const active = activeBottomPanel();
-  litRender(
+  render(
     active
       ? active.render(bottomContext())
       : emptyState(host, { message: "Nothing to show here yet." }),
@@ -394,7 +396,7 @@ export function unmountBottomDock(): void {
     _host.removeAttribute(REGION_ATTR);
     /* The document's dispose removed its own root; this clears anything a caller left beside it,
        so the host is `:empty` again and the shell's sheet takes the dock out of the grid. */
-    litRender(nothing, _host);
+    render(nothing, _host);
     _host.textContent = "";
     runAfterRender(_host);
     _host = null;

package/src/panels/canvas-dnd-bridge.ts

@@ -42,19 +42,15 @@ import { parentCursorToIframe } from "../canvas/iframe-overlay";
 import { clearDragGhost, moveDragGhost, setDragGhost } from "./drag-ghost";
 import { getNodeAtPath } from "../store";
 import { activeTab } from "../workspace/workspace";
-import type { DragHost } from "../canvas/iframe-host";
+import type { HostState } from "../canvas/iframe-host";
+import type { ElementDragPayload } from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
 import type { Tab } from "../tabs/tab";
 import type { DragSrcKind, ParentToIframe } from "../canvas/iframe-protocol";
 import type { JxMutableNode } from "@jxsuite/schema/types";
-
-/** A parent-viewport pointer position (pragmatic's `location.current.input`). */
-interface Cursor {
-  x: number;
-  y: number;
-}
+import type { ViewportPoint } from "../surfaces/menu";
 
 interface MonitorDragArgs {
-  source: { data: Record<string, unknown> };
+  source: { data: ElementDragPayload["data"] };
   location: {
     current: { input: { clientX: number; clientY: number } };
     // Pragmatic resets `current` back to `initial` when a drag is CANCELLED (Escape / dropped on no
@@ -64,6 +60,12 @@ interface MonitorDragArgs {
   };
 }
 
+/** The two leg messages one cursor position yields. */
+export interface DragMessages {
+  move: ParentToIframe;
+  drop: ParentToIframe;
+}
+
 /**
  * PURE: build the `dragMove` + `drop` parent→iframe messages for a cursor, given the session id and
  * the target iframe's EMPIRICAL `scale` + `rect` (both injected so this is testable without a DOM).
@@ -72,11 +74,11 @@ interface MonitorDragArgs {
  * the move-preview and the authoritative drop never use a divergent coordinate transform.
  */
 export function buildDragMessages(
-  cursor: Cursor,
+  cursor: ViewportPoint,
   dragSeq: number,
   scale: number,
   iframeRect: { left: number; top: number },
-): { move: ParentToIframe; drop: ParentToIframe } {
+): DragMessages {
   const local = parentCursorToIframe(cursor, iframeRect, scale);
   return {
     drop: { cursor: local, dragSeq, kind: "drop" },
@@ -85,7 +87,7 @@ export function buildDragMessages(
 }
 
 /** The cursor of a monitor event in parent-viewport coords. */
-function cursorOf(location: MonitorDragArgs["location"]): Cursor {
+function cursorOf(location: MonitorDragArgs["location"]): ViewportPoint {
   return { x: location.current.input.clientX, y: location.current.input.clientY };
 }
 
@@ -97,11 +99,13 @@ function cursorOf(location: MonitorDragArgs["location"]): Cursor {
  * the iframe's `canDrop` rejects ancestor/self targets). Anything else (e.g. a row missing a path)
  * is ignored.
  */
-function dragSrcOf(data: Record<string, unknown>): DragSrcKind | null {
+function dragSrcOf(data: ElementDragPayload["data"]): DragSrcKind | null {
   if (data.type === "block") {
     return { type: "block" };
   }
   if (data.type === "tree-node" && Array.isArray(data.path)) {
+    /* SAFETY: both minters of a "tree-node" payload, an Outline row's `getInitialData` and the block
+       action bar's drag handle, set `path` to the dragged node's JxPath. */
     return { path: data.path as (string | number)[], type: "tree-node" };
   }
   return null;
@@ -120,20 +124,22 @@ function dragSrcOf(data: Record<string, unknown>): DragSrcKind | null {
  *
  * @param {Tab | null} tab The document the source path is addressed in.
  * @param {DragSrcKind} src
- * @param {Record<string, unknown>} data
+ * @param {ElementDragPayload["data"]} data
  * @returns {string}
  */
 export function ghostLabel(
   tab: Tab | null,
   src: DragSrcKind,
-  data: Record<string, unknown>,
+  data: ElementDragPayload["data"],
 ): string {
   if (src.type === "block") {
+    /* SAFETY: every "block" payload minter (the palette and component cards in dnd.ts, the asset
+       file drop) sets `fragment` to the JxMutableNode the drop inserts. */
     const fragment = data.fragment as JxMutableNode | undefined;
     return displayTagName(fragment?.tagName) || "block";
   }
-  const doc = tab?.doc.document as JxMutableNode | undefined;
-  const node = doc ? (getNodeAtPath(doc, src.path) as JxMutableNode | undefined) : undefined;
+  const doc = tab?.doc.document;
+  const node = doc ? getNodeAtPath(doc, src.path) : undefined;
   return displayTagName(node?.tagName) || "node";
 }
 
@@ -150,9 +156,9 @@ const DROP_RESULT_TIMEOUT = 250;
  */
 interface CoordSession {
   src: DragSrcKind;
-  srcData: Record<string, unknown>;
+  srcData: ElementDragPayload["data"];
   /** The host whose iframe currently holds the session, or null while off-canvas. */
-  host: DragHost | null;
+  host: HostState | null;
   /** The session id the bound host was started with (for move/drop tagging). */
   seq: number;
   /** The drag ghost's label (computed once at start; the dragged thing doesn't change). */
@@ -161,9 +167,9 @@ interface CoordSession {
 
 /** Begin a session bound to `host`: bump+post dragStart, show the ghost, record the seq. */
 function startSession(
-  host: DragHost,
+  host: HostState,
   src: DragSrcKind,
-  srcData: Record<string, unknown>,
+  srcData: ElementDragPayload["data"],
 ): CoordSession {
   const seq = beginDragSession(host, src, srcData);
   // The label names a node in the TARGET pane's document — `host` is the artboard the cursor is
@@ -180,7 +186,7 @@ function startSession(
  *   new panel's iframe drives the rest.
  * - No host (inside→outside) → dragEnd the old + unbind; the ghost keeps following off-canvas.
  */
-function sessionDrag(session: CoordSession, cursor: Cursor): void {
+function sessionDrag(session: CoordSession, cursor: ViewportPoint): void {
   moveDragGhost(cursor.x, cursor.y);
   const target = liveDragHostAt(cursor);
   if (target === session.host) {
@@ -212,7 +218,7 @@ function sessionDrag(session: CoordSession, cursor: Cursor): void {
  * the affordances if no reply arrives (iframe reloaded mid-drag). Drops off-canvas release retained
  * data.
  */
-function sessionDrop(session: CoordSession, cursor: Cursor): void {
+function sessionDrop(session: CoordSession, cursor: ViewportPoint): void {
   const target = liveDragHostAt(cursor);
   // Migrate first if the drop landed on a different panel than the last move bound.
   if (target && target !== session.host) {
@@ -281,7 +287,7 @@ export function registerCanvasDndBridge(): () => void {
   let session: CoordSession | null = null;
   // The in-flight pragmatic source (set in onDragStart, cleared in onDrop) so a nativeDragEnter can
   // Bind a session for a drag whose cursor entered an iframe before the parent ever bound a host.
-  let pending: { src: DragSrcKind; srcData: Record<string, unknown> } | null = null;
+  let pending: Pick<CoordSession, "src" | "srcData"> | null = null;
 
   // Bind/migrate the live pragmatic session when its NATIVE stream enters an unclaimed iframe:
   // Chromium delivers dragover to the frame under the cursor, so a drag from the palette/layers
@@ -353,7 +359,8 @@ export function registerCanvasDndBridge(): () => void {
         return;
       }
       pending = null;
-      const cursor = location.current.input ? cursorOf(location) : { x: 0, y: 0 };
+      // Pragmatic's DragLocation always carries an `input`, cancelled drags included.
+      const cursor = cursorOf(location);
       if (!session) {
         // Never bound a host (dropped off every canvas) — just hide the ghost; nothing to apply.
         clearDragGhost();

package/src/panels/data-explorer.ts

@@ -2,6 +2,15 @@
 // ─── Data Explorer ──────────────────────────────────────────────────────────
 
 import { nothing } from "lit-html";
+import {
+  isBigInt,
+  isBoolean,
+  isFunction,
+  isNonNullObject,
+  isNumber,
+  isString,
+  isSymbol,
+} from "@jxsuite/schema/guards";
 import { activeTab } from "../workspace/workspace";
 import { booleanArg, stringArg, stringProperty } from "../commands/command-args";
 import { renderDataTreeSurface } from "../surfaces/panel-data";
@@ -9,6 +18,8 @@ import { registerPanel } from "./panel-registry";
 import type { PanelBody } from "./panel-registry";
 import type { DataTreeRow } from "../surfaces/panel-data";
 import type { AnyCommand, CommandRegistry } from "../commands/registry";
+import type { CommandArgValues } from "../commands/command-args";
+import type { ScopeRecord, ScopeValue } from "../editor/merge-tags";
 
 /**
  * The focused tab's expansion record, created on first write.
@@ -22,7 +33,7 @@ function rowsUi(): Record<string, boolean> | null {
   if (!ui) {
     return null;
   }
-  return (ui.dataRows ??= {});
+  return ui.dataRows;
 }
 
 /*
@@ -44,7 +55,7 @@ function limitsUi(): Record<string, number> | null {
   if (!ui) {
     return null;
   }
-  return (ui.dataLimits ??= {});
+  return ui.dataLimits;
 }
 
 /** The cap for one marker: the default, plus whatever the reader has asked for. */
@@ -89,34 +100,60 @@ function moreRow(
   };
 }
 
-/** A value as the tree prints it, capped at `max` characters. `undefined` prints as nothing. */
-function valueText(value: unknown, max: number): string {
-  if (typeof value === "string" && value.length > max) {
+/**
+ * A value as the tree prints it, capped at `max` characters. `undefined` prints as nothing, and so
+ * do a function and a symbol: those are the values `JSON.stringify` answers with no text at all.
+ */
+function valueText(value: ScopeValue, max: number): string {
+  if (isString(value) && value.length > max) {
     return `"${value.slice(0, max)}…"`;
   }
-  return JSON.stringify(value) ?? "";
+  return value === undefined || isFunction(value) || isSymbol(value) ? "" : JSON.stringify(value);
+}
+
+/** Each primitive kind, in the spelling `typeof` gives it, with the guard that establishes it. */
+const PRIMITIVE_KINDS: readonly (readonly [string, (value: ScopeValue) => boolean])[] = [
+  ["string", isString],
+  ["number", isNumber],
+  ["boolean", isBoolean],
+  ["bigint", isBigInt],
+  ["symbol", isSymbol],
+  ["function", isFunction],
+];
+
+/** The `typeof` name of a value that is neither `null` nor an object. */
+function primitiveKind(value: ScopeValue): string {
+  return PRIMITIVE_KINDS.find(([, test]) => test(value))?.[0] ?? "undefined";
 }
 
 /** Which colour a value takes. `null` and a summary label are the two the tree actually paints. */
-function toneOf(value: unknown): string {
-  return value === null ? "null" : typeof value;
+function toneOf(value: ScopeValue): string {
+  return value === null ? "null" : primitiveKind(value);
+}
+
+/**
+ * A value the tree can open: an array or a record. `isNonNullObject` is a `typeof "object"` test,
+ * so it already refuses a function; this predicate is what tells the type checker so.
+ */
+function isOpenable(value: ScopeValue): value is ScopeValue[] | ScopeRecord {
+  return isNonNullObject(value);
 }
 
 /** `Array(3)` or `{2}` — what a value you can open says while it is closed. */
-function summaryLabel(value: object): string {
+function summaryLabel(value: ScopeValue[] | ScopeRecord): string {
   return Array.isArray(value) ? `Array(${value.length})` : `{${Object.keys(value).length}}`;
 }
 
 /** Unwrap a Vue ref (has .value and .__v_isRef) to get the underlying value. */
-export function unwrapSignal(value: unknown) {
-  if (value && typeof value === "object" && (value as Record<string, unknown>).__v_isRef) {
-    return (value as Record<string, unknown>).value;
+export function unwrapSignal(value: ScopeValue): ScopeValue {
+  if (isOpenable(value) && !Array.isArray(value) && value.__v_isRef) {
+    return value.value;
   }
   return value;
 }
 
 /** Type label for a signal value in the data explorer. */
-export function dataTypeLabel(value: unknown) {
+export function dataTypeLabel(value: ScopeValue): string {
   const v = unwrapSignal(value);
   if (v === null) {
     return "null";
@@ -127,10 +164,10 @@ export function dataTypeLabel(value: unknown) {
   if (Array.isArray(v)) {
     return `Array(${v.length})`;
   }
-  if (typeof v === "object") {
+  if (isOpenable(v)) {
     return `{${Object.keys(v).length}}`;
   }
-  return typeof v;
+  return primitiveKind(v);
 }
 
 /* THE VALUE LIST IS GONE, AND ITS ROWS ARE THE DEFINITION ROWS — `panels/signals-panel.ts`.
@@ -148,14 +185,14 @@ export function dataTypeLabel(value: unknown) {
  * each carry their own indent. Nothing else changed: the caps are the same caps, the text is
  * truncated at the same lengths, and a capped list still ends in a marker.
  *
- * @param {unknown} value The resolved value to read.
+ * @param {ScopeValue} value The resolved value to read.
  * @param {number} depth How deep this call already is; the indent is derived from it.
  * @param {number} [maxDepth] The default depth cap, before whatever the reader has raised.
  * @param {string} path This subtree's path, which is what a raised limit is remembered against.
  * @returns {DataTreeRow[]}
  */
 export function dataTreeRows(
-  value: unknown,
+  value: ScopeValue,
   depth: number,
   maxDepth = 5,
   path = "",
@@ -182,21 +219,21 @@ export function dataTreeRows(
   if (value === null || value === undefined) {
     return [row("", String(value), "null", path)];
   }
-  if (typeof value !== "object") {
+  if (!isOpenable(value)) {
     return [row("", valueText(value, 200), toneOf(value), path)];
   }
 
   const array = Array.isArray(value);
-  const entries: [string, string, unknown][] = array
+  const entries: [string, string, ScopeValue][] = array
     ? value.map((item, i) => [`${i}`, `[${i}] `, item])
-    : Object.keys(value).map((key) => [key, `${key}: `, (value as Record<string, unknown>)[key]]);
+    : Object.keys(value).map((key) => [key, `${key}: `, value[key]]);
   const limit = array ? "items" : "keys";
   const cap = capFor(path, limit, array ? 20 : 30);
 
   const rows: DataTreeRow[] = [];
   for (const [segment, label, item] of entries.slice(0, cap)) {
     const childPath = `${path}/${segment}`;
-    if (item === null || item === undefined || typeof item !== "object") {
+    if (!isOpenable(item)) {
       rows.push(row(label, valueText(item, 80), toneOf(item), childPath));
       continue;
     }
@@ -222,14 +259,14 @@ export function dataTreeRows(
  * repaint instead of this sweeping per host.
  *
  * @param {HTMLElement} host The node the tree is drawn into.
- * @param {unknown} value What the canvas resolved this entry to.
+ * @param {ScopeValue} value What the canvas resolved this entry to.
  * @param {string} path The subtree's path, which is what a raised limit is remembered against.
  * @param {() => void} rerender Repaint the panel, so that a raised limit is drawn.
  * @param {number} [maxDepth] The default depth cap, before whatever the reader has raised.
  */
 export function paintDataTree(
   host: HTMLElement,
-  value: unknown,
+  value: ScopeValue,
   path: string,
   rerender: () => void,
   maxDepth = 5,
@@ -327,7 +364,7 @@ export function dataExplorerCommands(deps: DataExplorerCommandDeps): AnyCommand[
       group: "5_data",
       requires: "an open document that defines data",
       when: (ctx) => ctx.document.open,
-      run: (_commandCtx, args) => {
+      run: (_commandCtx, args: CommandArgValues) => {
         const name = stringArg("data.expandRow", args, "name");
         const defined = definedDataNames();
         if (!defined.includes(name)) {
@@ -336,7 +373,7 @@ export function dataExplorerCommands(deps: DataExplorerCommandDeps): AnyCommand[
               `document — it defines: ${defined.length > 0 ? defined.join(", ") : "nothing"}`,
           );
         }
-        const { expanded } = args as { expanded?: unknown };
+        const { expanded } = args;
         // `expanded` defaults to true but is never COERCED: `{ expanded: "no" }` would otherwise
         // Read as a collapse, which is the class of silent wrong answer this whole record exists
         // To stop.

package/src/panels/data-grid.ts

@@ -26,7 +26,7 @@ import { openGridSourcePicker } from "../grid/grid-open";
 import type { DataActionsSurfaceHandle, DataActionsView } from "../surfaces/data-actions";
 import type { DialogSurfaceHandle } from "../surfaces/dialog";
 import type { PushPlanSurfaceHandle, PushPlanView } from "../surfaces/push-plan";
-import type { DataConnectionTestResult, DataPushResult } from "../types";
+import type { DataConnectionTestResult, DataPushRequest, DataPushResult } from "../types";
 import type { SectionActionsContext } from "../settings/contributed-section";
 
 // ─── Grid opening (delegates to the grid-tab source picker) ──────────────────
@@ -75,7 +75,7 @@ function noteRows(texts: readonly string[], prefix: string) {
 }
 
 /** What the body lists: the dry run until it has been applied, then what actually happened. */
-function planView(state: PushDialogState): PushPlanView {
+function planView(state: Pick<PushDialogState, "dryRun" | "phase" | "result">): PushPlanView {
   const shown = state.phase === "done" ? state.result : state.dryRun;
   return {
     errors: noteRows(shown?.errors ?? [], "error"),
@@ -129,27 +129,28 @@ export async function startPush(connection: string | undefined, onDone: () => vo
   if (pushDialog) {
     return;
   }
-  const state: PushDialogState = {
+  /* The dialog's callbacks need the state record and the record needs the dialog's handle, so the
+     record is built first and completed with the handle below; it stays one object throughout. */
+  const pending: Omit<PushDialogState, "handle"> = {
     connection,
     dryRun: null,
-    handle: null as unknown as DialogSurfaceHandle,
     onDone,
     phase: "loading",
     plan: null,
     result: null,
   };
-  state.handle = openDialogSurface({
+  const handle = openDialogSurface({
     cancelLabel: "Cancel",
     confirmLabel: "",
     headline: connection ? `Push Schema — ${connection}` : "Push Schema",
     island: (host) => {
-      state.plan = mountPushPlanSurface(host, planView(state));
+      pending.plan = mountPushPlanSurface(host, planView(pending));
     },
     layer: layerHost("dialog"),
     message: "Compiling plan…",
     onCancel: closePushDialog,
     onClosed: () => {
-      if (pushDialog === state) {
+      if (pushDialog === pending) {
         closePushDialog();
       }
     },
@@ -158,12 +159,14 @@ export async function startPush(connection: string | undefined, onDone: () => vo
     },
     region: "data/push",
   });
+  const state: PushDialogState = Object.assign(pending, { handle });
   pushDialog = state;
 
-  const plan = await pushSchema({
-    dryRun: true,
-    ...(connection === undefined ? {} : { connection }),
-  });
+  const request: DataPushRequest = { dryRun: true };
+  if (connection !== undefined) {
+    request.connection = connection;
+  }
+  const plan = await pushSchema(request);
   if (pushDialog !== state) {
     return;
   }