@jxsuite/studio 6.1.0 → 6.1.2

package/src/surfaces/seo.ts

@@ -33,13 +33,12 @@
 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 seoDoc from "./seo.json";
 import type { SurfaceHandle } from "../ui/surface";
-import type { JxDocument } from "@jxsuite/schema/types";
 
-registerSurface("seo", seoDoc as unknown as JxDocument);
+registerSurface("seo", seoDoc);
 
 /** How a field's provenance is drawn — §6.7's vocabulary, reduced to three shapes and an absence. */
 export type SeoChipKind = "none" | "dot" | "static" | "link";
@@ -65,8 +64,9 @@ export interface SeoFieldView {
   chipTitle: string;
 }
 
-/** One named warning. A list, never a total. */
+/** A named thing that is wrong, or absent. Never summed: the list IS the report. */
 export interface SeoWarningView {
+  /** Stable id, so a test and a shot name the same warning. */
   id: string;
   /** The head key it is about, so the row can carry it as code. */
   field: string;
@@ -154,17 +154,17 @@ export interface SeoSurfaceHandle {
 type LineState = "text" | "unset";
 
 /** One field row with the flags the document branches on. */
-interface SeoFieldRow extends SeoFieldView, Record<string, unknown> {
+interface SeoFieldRow extends SeoFieldView {
   valueState: LineState;
 }
 
 /** One editable row with the flags the document branches on. */
-interface SeoEditRow extends SeoEditRowView, Record<string, unknown> {
+interface SeoEditRow extends SeoEditRowView {
   hasThumb: boolean;
 }
 
 /** One group with its rows already flagged. */
-interface SeoGroupRow extends Record<string, unknown> {
+interface SeoGroupRow {
   key: string;
   title: string;
   note: string;
@@ -196,12 +196,12 @@ interface SeoFlags {
   groups: SeoGroupRow[];
 }
 
-interface SeoScope extends Record<string, unknown>, SeoFlags {
+interface SeoScope extends SeoFlags {
   documentLabel: string;
   edit: (key: string, value: string) => void;
   commit: (key: string, value: string) => void;
   upload: (key: string) => void;
-  browse: (key: string, anchor: unknown) => void;
+  browse: (key: string, anchor: EventTarget | null) => void;
   openDonor: (key: string) => void;
   closed: () => void;
 }
@@ -268,9 +268,9 @@ export function openSeoSurface(options: SeoSurfaceOptions): SeoSurfaceHandle {
     options.onClosed();
   };
 
-  const scope = reactive({
+  const scope: SeoScope = reactive<SeoScope>({
     ...derive(options.view),
-    browse: (key: string, anchor: unknown) => {
+    browse: (key: string, anchor: EventTarget | null) => {
       if (anchor instanceof HTMLElement) {
         options.onBrowse(key, anchor);
       }
@@ -288,18 +288,24 @@ export function openSeoSurface(options: SeoSurfaceOptions): SeoSurfaceHandle {
     upload: (key: string) => {
       options.onUpload(key);
     },
-  }) as SeoScope;
+  });
 
+  /* 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;
   let mounted: SurfaceHandle | null = null;
   const ready = mountSurface("seo", scope, slot).then(async (surface) => {
     mounted = surface;
+    /* SAFETY: `seo.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;
     }
     const box = element.querySelector<HTMLElement>('dialog[part="dialog"]') ?? element;
@@ -317,7 +323,7 @@ export function openSeoSurface(options: SeoSurfaceOptions): SeoSurfaceHandle {
       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();

package/src/surfaces/settings-contexts.ts

@@ -22,10 +22,9 @@ import { reactive } from "../reactivity";
 import { mountSurface, registerSurface } from "../ui/surface";
 import contextsDoc from "./settings-contexts.json";
 
-import type { JxDocument } from "@jxsuite/schema/types";
 import type { SurfaceHandle } from "../ui/surface";
 
-registerSurface("settings-contexts", contextsDoc as unknown as JxDocument);
+registerSurface("settings-contexts", contextsDoc);
 
 /** One `$media` row, as the document draws it. */
 export interface ContextRowView {
@@ -111,7 +110,7 @@ export interface ContextsSurfaceHandle {
  * would be a second place to get it wrong. The refusal lines need none — `invalid` already says
  * which control the message belongs to.
  */
-interface ContextsScope extends Record<string, unknown>, ContextsView, ContextsActions {
+interface ContextsScope extends ContextsView, ContextsActions {
   hasSectionError: boolean;
   hasNotice: boolean;
 }
@@ -141,7 +140,7 @@ export function mountContextsSurface(
   actions: ContextsActions,
 ): ContextsSurfaceHandle {
   host.textContent = "";
-  const scope = reactive<ContextsScope>({
+  const scope: ContextsScope = reactive<ContextsScope>({
     ...emptyView(),
     add: actions.add,
     hasNotice: false,
@@ -151,17 +150,20 @@ export function mountContextsSurface(
     setBase: actions.setBase,
     setQuery: actions.setQuery,
     setScheme: actions.setScheme,
-  }) as ContextsScope;
+  });
 
   let mounted: SurfaceHandle | null = null;
   let disposed = false;
   const ready = mountSurface("settings-contexts", scope, host).then((surface) => {
+    /* SAFETY: `settings-contexts.json`'s root definition carries `tagName: "div"`, so the runtime
+       mounts an HTMLElement; a `Text` root only comes from a document whose root is a bare string. */
+    const root = surface.root as HTMLElement;
     if (disposed) {
       surface.dispose();
-      return surface.root as HTMLElement;
+      return root;
     }
     mounted = surface;
-    return surface.root as HTMLElement;
+    return root;
   });
 
   return {

package/src/surfaces/settings-contributed.ts

@@ -26,14 +26,15 @@
  * @docs studio/projects/settings
  */
 
+import { isString } from "@jxsuite/schema/guards";
 import { reactive } from "../reactivity";
 import { mountSurface, registerSurface } from "../ui/surface";
 import contributedDoc from "./settings-contributed.json";
 
-import type { JxDocument } from "@jxsuite/schema/types";
 import type { SurfaceHandle } from "../ui/surface";
+import type { JxElement } from "@jxsuite/schema/types";
 
-registerSurface("settings-contributed", contributedDoc as unknown as JxDocument);
+registerSurface("settings-contributed", contributedDoc);
 
 /** One entry key in a map-layout section's left column. */
 export interface ContributedEntryView {
@@ -101,7 +102,7 @@ export interface ContributedSurfaceHandle {
   dispose: () => void;
 }
 
-interface ContributedScope extends Record<string, unknown>, ContributedView, ContributedActions {}
+interface ContributedScope extends ContributedView, ContributedActions {}
 
 /** The view a freshly mounted surface starts on: a form layout with nothing in it. */
 function emptyView(): ContributedView {
@@ -119,10 +120,9 @@ function emptyView(): ContributedView {
 }
 
 /** The `part` a node was authored with, or `""` — the only thing this adapter asks about a node. */
-function partOf(def: unknown): string {
-  const attributes = (def as { attributes?: Record<string, unknown> } | null)?.attributes;
-  const part = attributes?.["part"];
-  return typeof part === "string" ? part : "";
+function partOf(def: JxElement | string): string {
+  const part = isString(def) ? undefined : def.attributes?.["part"];
+  return isString(part) ? part : "";
 }
 
 /**
@@ -139,7 +139,7 @@ export function mountContributedSurface(
   islands: ContributedIslands,
 ): ContributedSurfaceHandle {
   host.textContent = "";
-  const scope = reactive<ContributedScope>({ ...emptyView(), ...actions }) as ContributedScope;
+  const scope: ContributedScope = reactive<ContributedScope>({ ...emptyView(), ...actions });
 
   let mounted: SurfaceHandle | null = null;
   let disposed = false;
@@ -160,12 +160,16 @@ export function mountContributedSurface(
       }
     },
   }).then((surface) => {
+    /* SAFETY: `settings-contributed.json`'s root definition carries `tagName: "section"`, so the
+       runtime mounts an HTMLElement; a `Text` root only comes from a document whose root is a bare
+       string. */
+    const root = surface.root as HTMLElement;
     if (disposed) {
       surface.dispose();
-      return surface.root as HTMLElement;
+      return root;
     }
     mounted = surface;
-    return surface.root as HTMLElement;
+    return root;
   });
 
   return {

package/src/surfaces/settings-css-vars.ts

@@ -29,16 +29,9 @@
 import { reactive } from "../reactivity";
 import { mountSurface, registerSurface } from "../ui/surface";
 import cssVarsDoc from "./settings-css-vars.json";
-import type { SurfaceHandle } from "../ui/surface";
-import type { JxDocument } from "@jxsuite/schema/types";
+import type { SurfaceHandle, SurfaceOption } from "../ui/surface";
 
-registerSurface("settings-css-vars", cssVarsDoc as unknown as JxDocument);
-
-/** One row of the add-an-override picker. */
-export interface OverrideChoice {
-  value: string;
-  label: string;
-}
+registerSurface("settings-css-vars", cssVarsDoc);
 
 /** One of a token's per-context values. */
 export interface OverrideRowView {
@@ -91,7 +84,7 @@ export interface TokenRowView {
   overrides: OverrideRowView[];
   /** Whether the add-an-override picker is offered. */
   addState: "none" | "shown";
-  addOptions: OverrideChoice[];
+  addOptions: SurfaceOption[];
   /** What the picker currently reads. Always `""` in practice — see {@link renderCssVarsSurface}. */
   addPick: string;
   addLabel: string;
@@ -141,7 +134,7 @@ interface CssVarsFlags {
   hasError: boolean;
 }
 
-interface CssVarsScope extends Record<string, unknown>, CssVarsView, CssVarsActions, CssVarsFlags {}
+interface CssVarsScope extends CssVarsView, CssVarsActions, CssVarsFlags {}
 
 interface Mounted {
   scope: CssVarsScope;
@@ -186,7 +179,7 @@ export function renderCssVarsSurface(
   }
   existing?.handle?.dispose();
   host.textContent = "";
-  const scope = reactive({ ...derive(view), ...actions }) as CssVarsScope;
+  const scope: CssVarsScope = reactive<CssVarsScope>({ ...derive(view), ...actions });
   const record: Mounted = { handle: null, scope };
   mounts.set(host, record);
   /* No race to arbitrate: a redraw arriving while this is in flight takes the branch above — a

package/src/surfaces/settings-defs.json

@@ -158,7 +158,7 @@
             {
               "$prototype": "Array",
               "items": {
-                "$ref": "#/state/shapes"
+                "$ref": "#/state/defs"
               },
               "key": {
                 "$ref": "$map/item/name"
@@ -406,7 +406,7 @@
                           {
                             "operator": "call",
                             "target": {
-                              "$ref": "#/state/removeShape"
+                              "$ref": "#/state/removeSelected"
                             },
                             "value": []
                           }

package/src/surfaces/settings-defs.ts

@@ -26,19 +26,12 @@ import { reactive } from "../reactivity";
 import { mountSurface, registerSurface } from "../ui/surface";
 import defsDoc from "./settings-defs.json";
 
-import type { JxDocument } from "@jxsuite/schema/types";
-import type { SurfaceHandle } from "../ui/surface";
+import type { SurfaceHandle, SurfaceOption } from "../ui/surface";
 
-registerSurface("settings-defs", defsDoc as unknown as JxDocument);
-
-/** One row of a picker: a field type, a format, or a reference target. */
-export interface DefsChoice {
-  value: string;
-  label: string;
-}
+registerSurface("settings-defs", defsDoc);
 
 /** One data shape in the left column. */
-export interface DefsShapeView {
+export interface DefsEntryView {
   name: string;
   selected: boolean;
 }
@@ -87,7 +80,7 @@ export interface DefsFieldView {
 
 /** Everything the document draws, as one value. */
 export interface DefsView {
-  shapes: DefsShapeView[];
+  defs: DefsEntryView[];
   /** Whether the left column is offering the new-shape button or the form. */
   newState: "closed" | "open";
   newName: string;
@@ -95,10 +88,10 @@ export interface DefsView {
   editorState: "empty" | "editing";
   selected: string;
   fields: DefsFieldView[];
-  typeOptions: DefsChoice[];
-  formatOptions: DefsChoice[];
+  typeOptions: SurfaceOption[];
+  formatOptions: SurfaceOption[];
   /** The content types a reference field can point at. */
-  targets: DefsChoice[];
+  targets: SurfaceOption[];
   addState: "closed" | "open";
   addName: string;
   addType: string;
@@ -114,7 +107,7 @@ export interface DefsActions {
   editNew: (value: string) => void;
   createNew: () => void;
   cancelNew: () => void;
-  removeShape: () => void;
+  removeSelected: () => void;
   renameField: (key: string, value: string) => void;
   setType: (key: string, value: string) => void;
   setFormat: (key: string, value: string) => void;
@@ -149,7 +142,7 @@ export interface DefsSurfaceHandle {
   dispose: () => void;
 }
 
-interface DefsScope extends Record<string, unknown>, DefsView, DefsActions {}
+interface DefsScope extends DefsView, DefsActions {}
 
 /** The view a freshly mounted surface starts on: no shapes, and nothing chosen. */
 function emptyView(): DefsView {
@@ -160,13 +153,13 @@ function emptyView(): DefsView {
     addRequired: false,
     addState: "closed",
     addType: "string",
+    defs: [],
     editorState: "empty",
     fields: [],
     formatOptions: [],
     newName: "",
     newState: "closed",
     selected: "",
-    shapes: [],
     targets: [],
     typeOptions: [],
   };
@@ -181,17 +174,20 @@ function emptyView(): DefsView {
  */
 export function mountDefsSurface(host: HTMLElement, actions: DefsActions): DefsSurfaceHandle {
   host.textContent = "";
-  const scope = reactive<DefsScope>({ ...emptyView(), ...actions }) as DefsScope;
+  const scope: DefsScope = reactive<DefsScope>({ ...emptyView(), ...actions });
 
   let mounted: SurfaceHandle | null = null;
   let disposed = false;
   const ready = mountSurface("settings-defs", scope, host).then((surface) => {
+    /* SAFETY: `settings-defs.json`'s root definition carries `tagName: "section"`, so the runtime
+       mounts an HTMLElement; a `Text` root only comes from a document whose root is a bare string. */
+    const root = surface.root as HTMLElement;
     if (disposed) {
       surface.dispose();
-      return surface.root as HTMLElement;
+      return root;
     }
     mounted = surface;
-    return surface.root as HTMLElement;
+    return root;
   });
 
   return {
@@ -218,13 +214,13 @@ export function mountDefsSurface(host: HTMLElement, actions: DefsActions): DefsS
       scope.addRequired = view.addRequired;
       scope.addState = view.addState;
       scope.addType = view.addType;
+      scope.defs = view.defs;
       scope.editorState = view.editorState;
       scope.fields = view.fields;
       scope.formatOptions = view.formatOptions;
       scope.newName = view.newName;
       scope.newState = view.newState;
       scope.selected = view.selected;
-      scope.shapes = view.shapes;
       scope.targets = view.targets;
       scope.typeOptions = view.typeOptions;
     },

package/src/surfaces/settings-deploy.ts

@@ -19,23 +19,16 @@
 import { reactive } from "../reactivity";
 import { mountSurface, registerSurface } from "../ui/surface";
 import deployDoc from "./settings-deploy.json";
-import type { JxDocument } from "@jxsuite/schema/types";
-import type { SurfaceHandle } from "../ui/surface";
+import type { SurfaceHandle, SurfaceOption } from "../ui/surface";
 
-registerSurface("settings-deploy", deployDoc as unknown as JxDocument);
-
-/** One row of the adapter picker. */
-export interface DeployChoice {
-  value: string;
-  label: string;
-}
+registerSurface("settings-deploy", deployDoc);
 
 /** What the section says the surface should be showing right now. */
 export interface DeployValues {
   /** The adapter the project is built with. */
   adapter: string;
   /** Every adapter it may be. */
-  adapters: DeployChoice[];
+  adapters: SurfaceOption[];
   /** What the last write failed with, or `""`. */
   error: string;
 }
@@ -58,9 +51,9 @@ export interface DeploySurfaceHandle {
  * The scope the document reads. `hasError` is derived here: `$switch` is a document's only
  * conditional.
  */
-interface DeployScope extends Record<string, unknown> {
+interface DeployScope {
   adapter: string;
-  adapters: DeployChoice[];
+  adapters: SurfaceOption[];
   error: string;
   hasError: boolean;
   setAdapter: (value: string) => void;
@@ -91,13 +84,13 @@ export function mountDeploySurface(
   values: DeployValues,
   actions: DeployActions,
 ): DeploySurfaceHandle {
-  const scope = reactive<DeployScope>({
+  const scope: DeployScope = reactive<DeployScope>({
     adapter: "",
     adapters: [],
     error: "",
     hasError: false,
     setAdapter: actions.setAdapter,
-  }) as DeployScope;
+  });
   project(scope, values);
 
   container.replaceChildren();
@@ -125,7 +118,7 @@ export function mountDeploySurface(
       !disposed &&
       (mounted === null
         ? container.childNodes.length === 0
-        : (mounted.root as Node).parentNode === container),
+        : mounted.root.parentNode === container),
     dispose() {
       disposed = true;
       mounted?.dispose();

package/src/surfaces/settings-extensions.ts

@@ -26,10 +26,9 @@
 import { reactive } from "../reactivity";
 import { mountSurface, registerSurface } from "../ui/surface";
 import extensionsDoc from "./settings-extensions.json";
-import type { JxDocument } from "@jxsuite/schema/types";
 import type { SurfaceHandle } from "../ui/surface";
 
-registerSurface("settings-extensions", extensionsDoc as unknown as JxDocument);
+registerSurface("settings-extensions", extensionsDoc);
 
 /** One `project.json` key an extension owns, as the chip repeater reads it. */
 export interface ExtensionSectionView {
@@ -117,7 +116,7 @@ export interface ExtensionsSurfaceHandle {
  * value already in the view, and a view that had to keep them in step would be a second place to
  * get it wrong.
  */
-interface ExtensionsScope extends Record<string, unknown>, ExtensionsView, ExtensionsActions {
+interface ExtensionsScope extends ExtensionsView, ExtensionsActions {
   /** Whether to draw the groups or the sentence that says what this region is for. */
   listState: "empty" | "groups";
   hasError: boolean;
@@ -147,14 +146,14 @@ export function mountExtensionsSurface(
   view: ExtensionsView,
   actions: ExtensionsActions,
 ): ExtensionsSurfaceHandle {
-  const scope = reactive<ExtensionsScope>({
+  const scope: ExtensionsScope = reactive<ExtensionsScope>({
     error: "",
     groups: [],
     hasError: false,
     listState: "empty",
     remove: actions.remove,
     toggle: actions.toggle,
-  }) as ExtensionsScope;
+  });
   project(scope, view);
 
   container.replaceChildren();
@@ -182,7 +181,7 @@ export function mountExtensionsSurface(
       !disposed &&
       (mounted === null
         ? container.childNodes.length === 0
-        : (mounted.root as Node).parentNode === container),
+        : mounted.root.parentNode === container),
     dispose() {
       disposed = true;
       mounted?.dispose();