@jxsuite/studio 6.1.0 → 6.1.2

package/src/surfaces/menu.ts

@@ -20,7 +20,6 @@
  * @docs studio/interface/canvas
  * @docs studio/interface/preferences
  */
-import type { JxDocument } from "@jxsuite/schema/types";
 import type { JxScope } from "@jxsuite/runtime/types";
 import { ensureCaret } from "@jxsuite/ui/behaviors/menu";
 import { reactive } from "../reactivity";
@@ -29,7 +28,7 @@ import { mountSurface, registerSurface } from "../ui/surface";
 import { rectOf } from "../utils/geometry";
 import menuDoc from "./menu.json";
 
-registerSurface("menu", menuDoc as unknown as JxDocument);
+registerSurface("menu", menuDoc);
 
 /**
  * What a row prints: a projection of one command record, decided by the adapter that opens the
@@ -65,12 +64,12 @@ export interface OpenMenuOptions {
   /** The menu's accessible name. */
   label: string;
   /** Where the panel opens, in viewport pixels, when `place` is not given. */
-  origin?: { x: number; y: number };
+  origin?: ViewportPoint;
   /**
    * Where the panel opens as a function of its measured box: run once the popover is shown and
    * again a frame later, so a menu that hangs off a control can put its bottom flush with a floor.
    */
-  place?: (box: DOMRect) => { x: number; y: number };
+  place?: (box: DOMRect) => ViewportPoint;
   /** The lowest edge the menu and its submenus may reach; the viewport by default. */
   floor?: () => number;
   /**
@@ -113,6 +112,12 @@ export interface MenuHandle {
   readonly setRows: (rows: readonly MenuRowProjection[]) => void;
 }
 
+/** A point in viewport pixels: where a floating panel's corner sits. */
+export interface ViewportPoint {
+  x: number;
+  y: number;
+}
+
 type MenuElement = HTMLElement & {
   open?: boolean;
   x?: number;
@@ -140,7 +145,7 @@ type ProjectedRow = Omit<
 };
 
 /** The scope shape `menu.json` reads. */
-interface MenuScope extends Record<string, unknown> {
+interface MenuScope {
   rows: ProjectedRow[];
   label: string;
   x: number;
@@ -167,7 +172,7 @@ export function placementOf(
  * Where a menu with no coordinates of its own opens on an engine that cannot anchor it: below its
  * opener, leading edges aligned — the same corner the placement names.
  */
-function belowOpener(opener: HTMLElement | null | undefined): { x: number; y: number } {
+function belowOpener(opener: HTMLElement | null | undefined): ViewportPoint {
   if (!opener) {
     return { x: 0, y: 0 };
   }
@@ -205,17 +210,6 @@ function rowById(rows: readonly ProjectedRow[], id: string): ProjectedRow | unde
   return undefined;
 }
 
-const ZERO_BOX = {
-  bottom: 0,
-  height: 0,
-  left: 0,
-  right: 0,
-  top: 0,
-  width: 0,
-  x: 0,
-  y: 0,
-} as DOMRect;
-
 /**
  * Open a menu.
  *
@@ -242,15 +236,20 @@ export function openMenu(options: OpenMenuOptions): MenuHandle {
     options.onClosed?.(handle);
   };
 
+  /* `place` is first asked before anything is laid out, so it is handed an empty box: a real
+     `DOMRect` whose every edge and dimension is zero. */
   const initial = options.place
-    ? options.place(ZERO_BOX)
+    ? options.place(new DOMRect())
     : (options.origin ?? belowOpener(options.opener));
-  const scope: MenuScope = reactive({
+  const scope: MenuScope = reactive<MenuScope>({
     floor: options.floor?.() ?? 0,
     label: options.label,
     placement: placementOf(options),
     rows: options.rows.map((row) => project(row)),
     select: (_scope: JxScope, event: Event) => {
+      /* SAFETY: `menu.json` binds this handler to `onselect` alone, and a row's `select` is raised
+         by the runtime's `dispatchEvent` statement in `jx-menu-item.json`, which always constructs
+         a `CustomEvent` whose `detail` is the row's value. */
       const id = String((event as CustomEvent).detail);
       const row = rowById(scope.rows, id);
       if (!row) {
@@ -267,7 +266,7 @@ export function openMenu(options: OpenMenuOptions): MenuHandle {
     },
     x: initial.x,
     y: initial.y,
-  }) as MenuScope;
+  });
 
   /** Put the panel where `place` says, from its box as laid out now. */
   const place = (): void => {
@@ -279,18 +278,25 @@ export function openMenu(options: OpenMenuOptions): MenuHandle {
     scope.y = at.y;
   };
 
+  /* Read through a call, not the property path: `close()` can abort the controller while the menu
+     is awaiting `jx-ready`, and a direct test after that `await` would be narrowed to the value the
+     test before it saw. */
+  const aborted = (): boolean => controller.signal.aborted;
+
   const ready = (async () => {
     const mounted = await mountSurface("menu", scope, slot, { signal: controller.signal });
-    if (controller.signal.aborted) {
+    if (aborted()) {
       // Closed before the document finished mounting; the runtime already disposed it.
       return;
     }
     ({ dispose } = mounted);
     // The document's root IS the menu, and a custom element connects asynchronously: `jx-ready` is
     // The menu saying its `popover` attribute is on and it may be shown.
+    // SAFETY: `menu.json`'s root definition carries `tagName: "jx-menu"`, so the mounted root is
+    // The kit's menu element, which reflects `open`, `x` and `y` and inherits `showPopover`.
     menu = mounted.root as MenuElement;
     menu.addEventListener("toggle", (event) => {
-      if ((event as { newState?: string }).newState === "closed") {
+      if (event.newState === "closed") {
         finish();
       }
     });
@@ -299,7 +305,7 @@ export function openMenu(options: OpenMenuOptions): MenuHandle {
         menu!.addEventListener("jx-ready", () => resolve(), { once: true });
       });
     }
-    if (controller.signal.aborted) {
+    if (aborted()) {
       return;
     }
     const source =

package/src/surfaces/navigator-dock.ts

@@ -16,14 +16,15 @@
  * @docs studio/interface
  */
 
+import { isJsonObject, isString } from "@jxsuite/schema/guards";
 import { reactive } from "../reactivity";
 import { mountSurface, registerSurface } from "../ui/surface";
 import navigatorDockDoc from "./navigator-dock.json";
-import type { JxDocument, JxElement } from "@jxsuite/schema/types";
+import type { JsonObject, JxElement } from "@jxsuite/schema/types";
 import type { JxScope } from "@jxsuite/runtime/types";
 import type { SurfaceHandle } from "../ui/surface";
 
-registerSurface("navigator-dock", navigatorDockDoc as unknown as JxDocument);
+registerSurface("navigator-dock", navigatorDockDoc);
 
 /** The panel showing, as the document draws it. */
 export interface NavigatorPanelView {
@@ -65,19 +66,17 @@ export interface NavigatorDockHandle {
   dispose: () => void;
 }
 
-interface NavigatorDockScope extends Record<string, unknown>, NavigatorDockValues {}
-
 /** The `part` a node was declared with, or the empty string. */
 function partOf(def: JxElement | string): string {
-  const part = typeof def === "string" ? undefined : def.attributes?.["part"];
-  return typeof part === "string" ? part : "";
+  const part = isString(def) ? undefined : def.attributes?.["part"];
+  return isString(part) ? part : "";
 }
 
 /** The `$map` item a node was rendered inside, if it was rendered inside one. */
-function mapItem(state: JxScope | undefined): Record<string, unknown> | null {
-  const map = state?.["$map"] as { item?: unknown } | undefined;
-  const item = map?.item;
-  return item !== null && typeof item === "object" ? (item as Record<string, unknown>) : null;
+function mapItem(state: JxScope | undefined): JsonObject | null {
+  const map = state?.["$map"];
+  const item = isJsonObject(map) ? map["item"] : undefined;
+  return isJsonObject(item) ? item : null;
 }
 
 /**
@@ -91,7 +90,7 @@ export function mountNavigatorDock(
   values: NavigatorDockValues,
   options: NavigatorDockOptions,
 ): NavigatorDockHandle {
-  const scope = reactive<NavigatorDockScope>({ panels: values.panels }) as NavigatorDockScope;
+  const scope: NavigatorDockValues = reactive<NavigatorDockValues>({ panels: values.panels });
 
   container.textContent = "";
   // @ts-expect-error -- _$litPart$ is lit's private render-part marker, not in the DOM types
@@ -105,7 +104,7 @@ export function mountNavigatorDock(
         return;
       }
       const key = mapItem(state)?.["key"];
-      if (typeof key === "string") {
+      if (isString(key)) {
         options.onContent(key, element);
       }
     },

package/src/surfaces/new-project.ts

@@ -31,22 +31,17 @@
  * @docs studio/projects/create
  */
 
+import { isString } from "@jxsuite/schema/guards";
 import { reactive } from "../reactivity";
 import { mountSurface, registerSurface } from "../ui/surface";
 import { overlayRegion, REGION_ATTR } from "../ui/regions";
-import { close as closeDialog, showModal } from "@jxsuite/ui/behaviors/dialog";
+import { close, showModal } from "@jxsuite/ui/behaviors/dialog";
 import { whenReady } from "./dialog";
 import newProjectDoc from "./new-project.json";
-import type { SurfaceHandle } from "../ui/surface";
-import type { JxDocument, JxElement } from "@jxsuite/schema/types";
+import type { SurfaceHandle, SurfaceOption } from "../ui/surface";
+import type { JxElement } from "@jxsuite/schema/types";
 
-registerSurface("new-project", newProjectDoc as unknown as JxDocument);
-
-/** One row of a kit `jx-select`, and of the tab strip: a value and what it reads. */
-export interface NewProjectRow {
-  value: string;
-  label: string;
-}
+registerSurface("new-project", newProjectDoc);
 
 /** One card in the starter gallery — including the one that is not a starter. */
 export interface NewProjectCard {
@@ -80,7 +75,7 @@ export interface NewProjectView {
   showTabs: boolean;
   /** The chosen tab's value, and the strip's rows. */
   tab: string;
-  tabs: NewProjectRow[];
+  tabs: SurfaceOption[];
   /** Which body to draw. */
   body: NewProjectBody;
   /** The sentence above a closed AI gate: the two tabs ask for the same thing differently. */
@@ -110,10 +105,10 @@ export interface NewProjectView {
   browsing: boolean;
   browseLabel: string;
   owner: string;
-  owners: NewProjectRow[];
+  owners: SurfaceOption[];
   /** `"private"` or `"public"` — a value rather than a flag, because a select holds one. */
   visibility: string;
-  visibilities: NewProjectRow[];
+  visibilities: SurfaceOption[];
   /** The owner already has a repository of this name. Empty says nothing. */
   repoTaken: string;
   /** `Creates` or `Repository`, and the destination itself. */
@@ -127,12 +122,12 @@ export interface NewProjectView {
   maxDepth: string;
   maxPages: string;
   breakpointMode: string;
-  breakpointModes: NewProjectRow[];
+  breakpointModes: SurfaceOption[];
   breakpointCount: string;
   maxBreakpoints: string;
   breakpointWidths: string;
   breakpointRounding: string;
-  roundings: NewProjectRow[];
+  roundings: SurfaceOption[];
   /** What the chosen mode says will happen. */
   breakpointHint: string;
   aiNaming: boolean;
@@ -233,8 +228,7 @@ interface NewProjectFlags {
   hasInstallUrl: boolean;
 }
 
-interface NewProjectScope
-  extends Record<string, unknown>, NewProjectView, NewProjectFlags, NewProjectActions {}
+interface NewProjectScope extends NewProjectView, NewProjectFlags, NewProjectActions {}
 
 /** The view plus the flags the document renders from. */
 function derive(view: NewProjectView): NewProjectView & NewProjectFlags {
@@ -260,8 +254,8 @@ function derive(view: NewProjectView): NewProjectView & NewProjectFlags {
 
 /** A node's authored `part`, which is how an island announces which one it is. */
 function partOf(def: JxElement | string): string {
-  const part = typeof def === "string" ? undefined : def.attributes?.["part"];
-  return typeof part === "string" ? part : "";
+  const part = isString(def) ? undefined : def.attributes?.["part"];
+  return isString(part) ? part : "";
 }
 
 /**
@@ -294,6 +288,10 @@ export function openNewProjectSurface(options: NewProjectSurfaceOptions): NewPro
     closed = true;
     options.actions.closed();
   };
+  /* Read through a call, not the bare binding: `close()` can run while the mount is awaiting the
+     element, and a direct `closed` test after that `await` would be narrowed to the value the test
+     before it saw. */
+  const isClosed = (): boolean => closed;
 
   /** The island boxes the document has announced, by part. Replaced as the bodies come and go. */
   const boxes = new Map<string, HTMLElement>();
@@ -325,14 +323,14 @@ export function openNewProjectSurface(options: NewProjectSurfaceOptions): NewPro
     }
   };
 
-  const scope = reactive({
+  const scope: NewProjectScope = reactive<NewProjectScope>({
     ...derive(options.view),
     ...options.actions,
     browse: () => {
       options.actions.browse();
     },
     closed: finish,
-  }) as NewProjectScope;
+  });
 
   let mounted: SurfaceHandle | null = null;
   const ready = mountSurface("new-project", scope, slot, {
@@ -345,13 +343,16 @@ export function openNewProjectSurface(options: NewProjectSurfaceOptions): NewPro
     },
   }).then(async (surface) => {
     mounted = surface;
+    /* SAFETY: `new-project.json`'s root definition carries `tagName: "jx-dialog"`, so the runtime
+       mounts an HTMLElement; a `Text` root only comes from a document whose root is a bare
+       string. */
     const element = surface.root as HTMLElement;
-    if (closed) {
+    if (isClosed()) {
       surface.dispose();
       return element;
     }
     await whenReady(element);
-    if (closed) {
+    if (isClosed()) {
       return element;
     }
     /* The region goes on the platform's own `<dialog>`, which is the one element here that HAS a
@@ -375,7 +376,7 @@ export function openNewProjectSurface(options: NewProjectSurfaceOptions): NewPro
       const element = mounted?.root;
       if (element instanceof HTMLElement) {
         // The platform's close first, so focus goes back where it came from; then the document.
-        closeDialog(element);
+        close(element);
       }
       // A mount that has not landed yet is disposed by `ready` when it does — `finish` tells it so.
       mounted?.dispose();
@@ -394,8 +395,8 @@ export function openNewProjectSurface(options: NewProjectSurfaceOptions): NewPro
          move. Measurement and a focus move are the two imperative things a surface may still do
          (ui.md §2 rule 5). */
       requestAnimationFrame(() => {
-        element.querySelector('[part="dialog"]')?.scrollTo?.(0, 0);
-        element.querySelector<HTMLElement>('[part="name"] [part="input"]')?.focus?.();
+        element.querySelector('[part="dialog"]')?.scrollTo(0, 0);
+        element.querySelector<HTMLElement>('[part="name"] [part="input"]')?.focus();
       });
     },
     host: slot,

package/src/surfaces/pane-context.ts

@@ -28,21 +28,17 @@
  * @docs studio/interface/tabs
  */
 
-import { close as closePopover, openAt } from "@jxsuite/ui/behaviors/popover";
+import { close, openAt } from "@jxsuite/ui/behaviors/popover";
+import { isString } from "@jxsuite/schema/guards";
 import { reactive } from "../reactivity";
 import { mountSurface, registerSurface } from "../ui/surface";
 import { rectOf } from "../utils/geometry";
 import paneContextDoc from "./pane-context.json";
-import type { JxDocument, JxElement } from "@jxsuite/schema/types";
-import type { SurfaceHandle } from "../ui/surface";
+import type { JxElement } from "@jxsuite/schema/types";
+import type { SurfaceHandle, SurfaceOption } from "../ui/surface";
+import type { ViewportPoint } from "./menu";
 
-registerSurface("pane-context", paneContextDoc as unknown as JxDocument);
-
-/** One row of a `jx-select`: the value it writes and the word it prints. */
-export interface PaneContextOption {
-  value: string;
-  label: string;
-}
+registerSurface("pane-context", paneContextDoc);
 
 /**
  * One segment of a radio group — a size, a scheme, a view, a language.
@@ -74,7 +70,7 @@ export interface PaneContextParam {
   name: string;
   label: string;
   value: string;
-  options: PaneContextOption[];
+  options: SurfaceOption[];
 }
 
 /** One component test prop: a field, and the region id the screenshot pipeline addresses it by. */
@@ -108,7 +104,7 @@ export interface PaneContextView {
   editorMode: "static" | "picker";
   editorLabel: string;
   editorValue: string;
-  editorOptions: PaneContextOption[];
+  editorOptions: SurfaceOption[];
 
   viewState: "shown" | "hidden";
   views: PaneContextChoice[];
@@ -143,7 +139,7 @@ export interface PaneContextView {
   zoomLabel: string;
   fitState: "shown" | "hidden";
   fitValue: string;
-  fitOptions: PaneContextOption[];
+  fitOptions: SurfaceOption[];
 }
 
 /** What a control can ask the pane to do. Every one of them is a decision the flow owns. */
@@ -205,8 +201,7 @@ interface PopoverState {
   resolvingOpen: boolean;
 }
 
-interface PaneContextScope
-  extends Record<string, unknown>, PaneContextView, PaneContextActions, PopoverState {
+interface PaneContextScope extends PaneContextView, PaneContextActions, PopoverState {
   /** The two panel doors the document calls, which the mount owns rather than the flow. */
   openContext: (anchor: HTMLElement) => void;
   openResolving: (anchor: HTMLElement) => void;
@@ -307,8 +302,8 @@ export function emptyPaneContextView(): PaneContextView {
  * undefined at that moment and the two panels would both be filed under the same empty key.
  */
 function attrOf(def: JxElement | string, name: string): string {
-  const value = typeof def === "string" ? undefined : def.attributes?.[name];
-  return typeof value === "string" ? value : "";
+  const value = isString(def) ? undefined : def.attributes?.[name];
+  return isString(value) ? value : "";
 }
 
 /**
@@ -325,7 +320,7 @@ function attrOf(def: JxElement | string, name: string): string {
  * platform against the trigger it was opened from (ui.md §6) and these coordinates are ignored;
  * they stand for the engines that cannot.
  */
-function placeBelow(anchor: HTMLElement, panel: HTMLElement | null): { x: number; y: number } {
+function placeBelow(anchor: HTMLElement, panel: HTMLElement | null): ViewportPoint {
   const box = rectOf(anchor);
   const width = panel ? rectOf(panel).width : 0;
   const right = Math.max(0, box.right - width);
@@ -352,7 +347,7 @@ export function mountPaneContextSurface(
      module finds an invoker from a panel — so two panes mounting this surface under one id would
      hand the second pane's trigger the first pane's panel. */
   const uid = `pane-context-${paneId}`;
-  const scope = reactive<PaneContextScope>({
+  const scope: PaneContextScope = reactive<PaneContextScope>({
     ...emptyPaneContextView(),
     ...actions,
     contextOpen: false,
@@ -369,7 +364,7 @@ export function mountPaneContextSurface(
     resolvingPopoverId: `${uid}-resolving`,
     resolvingX: 0,
     resolvingY: 0,
-  }) as PaneContextScope;
+  });
   project(scope, view);
 
   const nodes = new Map<string, HTMLElement>();
@@ -378,7 +373,7 @@ export function mountPaneContextSurface(
 
   /** The panel a `data-popover` key names, once the document has drawn it. */
   const panelOf = (kind: "context" | "resolving"): PopoverElement | null =>
-    (nodes.get(`popover:${kind}`) as PopoverElement | undefined) ?? null;
+    nodes.get(`popover:${kind}`) ?? null;
 
   /**
    * Show a panel from its trigger, positioning it before and after the show.
@@ -391,7 +386,7 @@ export function mountPaneContextSurface(
     if (!panel) {
       return;
     }
-    const write = (at: { x: number; y: number }): void => {
+    const write = (at: ViewportPoint): void => {
       if (kind === "context") {
         scope.contextX = at.x;
         scope.contextY = at.y;
@@ -418,7 +413,7 @@ export function mountPaneContextSurface(
     }
     const panel = panelOf(kind);
     if (panel) {
-      closePopover(panel);
+      close(panel);
     }
   };
 
@@ -454,7 +449,7 @@ export function mountPaneContextSurface(
              `hidePopover()` queues its toggle: `canvas.setResolvingOpen { open: false }` has to be
              true of `isResolvingOpen()` on the line after it, not a task later. */
           element.addEventListener("toggle", (event) => {
-            const open = (event as Event & { newState?: string }).newState === "open";
+            const open = event.newState === "open";
             if (kind === "context") {
               scope.contextOpen = open;
             } else {
@@ -483,7 +478,7 @@ export function mountPaneContextSurface(
     },
     /* A mount still in flight has nothing in the host to ask about, and answering "no" would make
        the next repaint tear down the mount it is waiting for and start a second one. */
-    connected: () => !disposed && (mounted === null || (mounted.root as Node).parentNode === host),
+    connected: () => !disposed && (mounted === null || mounted.root.parentNode === host),
     dispose() {
       disposed = true;
       hidePanel("context");

package/src/surfaces/pane-grid.ts

@@ -23,14 +23,15 @@
  * @docs studio/interface
  */
 
+import { isJsonObject, isString } from "@jxsuite/schema/guards";
 import { reactive } from "../reactivity";
 import { mountSurface, registerSurface } from "../ui/surface";
 import paneGridDoc from "./pane-grid.json";
-import type { JxDocument, JxElement } from "@jxsuite/schema/types";
+import type { JxElement } from "@jxsuite/schema/types";
 import type { JxScope } from "@jxsuite/runtime/types";
 import type { SurfaceHandle } from "../ui/surface";
 
-registerSurface("pane-grid", paneGridDoc as unknown as JxDocument);
+registerSurface("pane-grid", paneGridDoc);
 
 /**
  * The `part` a pane's CELL carries.
@@ -80,7 +81,7 @@ const CELL_PARTS: ReadonlyMap<string, PaneCellPart> = new Map([
  * Every field is a finished value. The document asks no question about a pane — not which index it
  * is at, not how many there are — so a projection cannot disagree with what is drawn.
  */
-export interface PaneGridRow extends Record<string, unknown> {
+export interface PaneGridRow {
   /** The pane id. The repeater's key, and what every action is addressed with. */
   id: string;
   /** `"shown"` for every row but the first. The `$switch` the leading splitter hangs off. */
@@ -165,7 +166,7 @@ export interface PaneGridSurface {
 }
 
 /** The scope `pane-grid.json` reads. */
-interface PaneGridScope extends Record<string, unknown>, PaneGridDragState {
+interface PaneGridScope extends PaneGridDragState {
   rows: PaneGridRow[];
   /** `jx-split`'s `value`. */
   paneSplit: number;
@@ -180,8 +181,8 @@ interface PaneGridScope extends Record<string, unknown>, PaneGridDragState {
 
 /** The `part` a node's definition carries, or `""` for a text node or an unmarked element. */
 function partOf(def: JxElement | string): string {
-  const part = typeof def === "string" ? undefined : def.attributes?.["part"];
-  return typeof part === "string" ? part : "";
+  const part = isString(def) ? undefined : def.attributes?.["part"];
+  return isString(part) ? part : "";
 }
 
 /**
@@ -192,8 +193,10 @@ function partOf(def: JxElement | string): string {
  * object the projection put in `rows`.
  */
 function paneOf(state: JxScope | undefined): string {
-  const row = (state?.["$map"] as { item?: { id?: unknown } } | undefined)?.item;
-  return typeof row?.id === "string" ? row.id : "";
+  const map = state?.["$map"];
+  const row = isJsonObject(map) ? map["item"] : undefined;
+  const id = isJsonObject(row) ? row["id"] : undefined;
+  return isString(id) ? id : "";
 }
 
 /**
@@ -215,7 +218,7 @@ export function mountPaneGridSurface(
   actions: PaneGridActions,
 ): PaneGridSurface {
   host.replaceChildren();
-  const scope = reactive<PaneGridScope>({
+  const scope: PaneGridScope = reactive<PaneGridScope>({
     armed: false,
     edgePane: "",
     move: actions.move,
@@ -226,7 +229,7 @@ export function mountPaneGridSurface(
     splitGap: split.gap,
     splitMax: split.max,
     splitMin: split.min,
-  }) as PaneGridScope;
+  });
 
   let mounted: SurfaceHandle | null = null;
   let disposed = false;
@@ -239,6 +242,8 @@ export function mountPaneGridSurface(
     onNodeCreated: (element, _path, def, state) => {
       const cellPart = CELL_PARTS.get(partOf(def));
       if (cellPart) {
+        /* SAFETY: `pane-grid.json` declares no text children and no SVG, so every node carrying
+           one of the five cell parts is an HTML element the runtime created from a tagName. */
         actions.cellPart(paneOf(state), cellPart, element as HTMLElement);
       }
     },

package/src/surfaces/panel-activity.ts

@@ -31,10 +31,9 @@ import { effect, effectScope, reactive } from "../reactivity";
 import { mountSurface, registerSurface } from "../ui/surface";
 import activityDoc from "./panel-activity.json";
 import type { EffectScope } from "@vue/reactivity";
-import type { JxDocument } from "@jxsuite/schema/types";
 import type { SurfaceHandle } from "../ui/surface";
 
-registerSurface("panel-activity", activityDoc as unknown as JxDocument);
+registerSurface("panel-activity", activityDoc);
 
 /** One declared phase of an operation, as the surface reads it. */
 export interface ActivityStepView {
@@ -98,7 +97,7 @@ export interface ActivitySurfaceDeps {
 }
 
 /** The scope the document reads: the projection, flattened, beside the three callbacks. */
-interface ActivityScope extends Record<string, unknown> {
+interface ActivityScope {
   rows: ActivityRowView[];
   hasRows: boolean;
   hasFinished: boolean;
@@ -127,7 +126,7 @@ function standingIn(container: HTMLElement): boolean {
     return false;
   }
   // Still mounting into this very container: a second call must not start a second mount.
-  return _handle === null ? _mount !== null : (_handle.root as Node).parentNode === container;
+  return _handle === null ? _mount !== null : _handle.root.parentNode === container;
 }
 
 /**
@@ -142,7 +141,7 @@ export function mountActivitySurface(container: HTMLElement, deps: ActivitySurfa
   }
   disposeActivitySurface();
   _container = container;
-  const scope = reactive<ActivityScope>({
+  const scope: ActivityScope = reactive<ActivityScope>({
     cancel: deps.cancel,
     clearFinished: deps.clearFinished,
     clearLabel: "",
@@ -150,7 +149,7 @@ export function mountActivitySurface(container: HTMLElement, deps: ActivitySurfa
     hasRows: false,
     rows: [],
     toggleLog: deps.toggleLog,
-  }) as ActivityScope;
+  });
   _scope = effectScope();
   _scope.run(() => {
     effect(() => {

package/src/surfaces/panel-data.ts

@@ -22,10 +22,9 @@
 import { reactive } from "../reactivity";
 import { mountSurface, registerSurface } from "../ui/surface";
 import dataTreeDoc from "./panel-data.json";
-import type { JxDocument } from "@jxsuite/schema/types";
 import type { SurfaceHandle } from "../ui/surface";
 
-registerSurface("panel-data", dataTreeDoc as unknown as JxDocument);
+registerSurface("panel-data", dataTreeDoc);
 
 /**
  * One line of a value tree, as the document reads it.
@@ -69,7 +68,7 @@ export interface DataTreeActions {
 }
 
 /** The scope the document reads. */
-interface DataTreeScope extends Record<string, unknown>, DataTreeActions {
+interface DataTreeScope extends DataTreeActions {
   rows: DataTreeRow[];
 }
 
@@ -113,7 +112,7 @@ export function renderDataTreeSurface(
   }
   takeDown(host, existing);
   host.textContent = "";
-  const scope = reactive({ rows, showMore: actions.showMore }) as DataTreeScope;
+  const scope: DataTreeScope = reactive<DataTreeScope>({ rows, showMore: actions.showMore });
   const record: Mounted = { disposed: false, handle: null, scope };
   mounts.set(host, record);
   /* No race to arbitrate: a repaint arriving while this is in flight takes the branch above — a