feat(docs): draw the landing diagram from the engine, with ports

.github/workflows/pages.yml

@@ -45,6 +45,13 @@ jobs:
           go-version-file: go.mod
           cache: true
 
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+          cache: npm
+          cache-dependency-path: editors/vscode/package-lock.json
+
       - name: Install documentation toolchain
         run: make docs-install
 
@@ -56,6 +63,9 @@ jobs:
       - name: Build the in-browser engine
         run: make docs-engine-assets
 
+      - name: Build the landing-page diagram
+        run: make docs-landing-assets
+
       - name: Build documentation site
         run: make docs
 

.github/workflows/pr.yml

@@ -961,6 +961,10 @@ jobs:
       - name: Package the VS Code extension
         run: make vscode-package
 
+      - name: Build landing-page diagram bundle
+        working-directory: editors/vscode
+        run: npm run build:landing
+
       - name: Upload VS Code extension artifact
         uses: actions/upload-artifact@v4
         with:
@@ -1027,9 +1031,19 @@ jobs:
           go-version-file: go.mod
           cache: true
 
+      - name: Set up Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+          cache: npm
+          cache-dependency-path: editors/vscode/package-lock.json
+
       - name: Install documentation toolchain
         run: make docs-install
 
+      - name: Build the landing-page diagram
+        run: make docs-landing-assets
+
       - name: Check documentation links
         run: python3 scripts/check-doc-links.py
 

.gitignore

@@ -17,6 +17,7 @@
 /docs/assets/sysml-repl.wasm*
 /docs/assets/repl-examples/
 /docs/assets/wasm_exec.js
+/docs/assets/landing/
 
 # Julia package environments resolve locally; the pinned deps are in Project.toml.
 client/julia/**/Manifest.toml

Makefile

@@ -1,4 +1,4 @@
-.PHONY: all build build-sysml build-prod build-wasm-prod build-lsp build-grpc build-engine build-core build-syntax build-sysml-wasm build-release-wasm build-wasm build-wasm-wasip1 build-wasm-js wasm-check static-check windows-versioninfo-check man man-check install-tree pgo-profile conformance conformance-pkg conformance-rust conformance-julia conformance-matlab test test-shard coverage lint clean install help ontology-table ontology-table-check python-metamodel python-metamodel-check fuml-expected python-test python-coverage scripts-coverage node-coverage python-install proto proto-buf python-proto proto-ts proto-rust proto-lint proto-breaking vscode-grammar vscode-build vscode-package docs docs-install docs-serve docs-engine-assets docs-counts docs-check changelog-check changelog-render self-model
+.PHONY: all build build-sysml build-prod build-wasm-prod build-lsp build-grpc build-engine build-core build-syntax build-sysml-wasm build-release-wasm build-wasm build-wasm-wasip1 build-wasm-js wasm-check static-check windows-versioninfo-check man man-check install-tree pgo-profile conformance conformance-pkg conformance-rust conformance-julia conformance-matlab test test-shard coverage lint clean install help ontology-table ontology-table-check python-metamodel python-metamodel-check fuml-expected python-test python-coverage scripts-coverage node-coverage python-install proto proto-buf python-proto proto-ts proto-rust proto-lint proto-breaking vscode-grammar vscode-build vscode-package docs docs-install docs-serve docs-engine-assets docs-landing-assets docs-counts docs-check changelog-check changelog-render self-model
 
 # Version information
 # Only release tags describe a build; the moving `nightly` tag is not a version.
@@ -526,7 +526,7 @@ docs: ## Build the documentation site, failing on a broken link
 	$(PYTHON) -m mkdocs build --strict --site-dir $(SITE_DIR)
 	@echo "✓ Built $(SITE_DIR)/"
 
-# The cli page's in-browser REPL fetches these two assets; they are built, never
+# The cli page's in-browser REPL fetches these assets; they are built, never
 # vendored. The Pages job runs this target before `docs`; a local `make docs` or
 # `docs-serve` preview wants the same target first or the REPL cannot load.
 docs-engine-assets: ## Build the in-browser engine assets into docs/assets
@@ -540,7 +540,12 @@ docs-engine-assets: ## Build the in-browser engine assets into docs/assets
 	@cp "$$(go env GOROOT)/lib/wasm/wasm_exec.js" docs/assets/
 	@echo "✓ Built docs/assets/sysml-engine.wasm.gz, sysml-repl.wasm.gz, repl-examples/ + wasm_exec.js"
 
-docs-serve: docs-install ## Serve the documentation site with live reload
+# The landing page's diagram and router assets are built from the extension's
+# source rather than vendored; Pages and local previews need both bundles.
+docs-landing-assets: ## Build the landing-page diagram assets into docs/assets
+	cd $(VSCODE_DIR) && npm ci && npm run build:landing
+
+docs-serve: docs-install ## Serve docs with live reload (build docs-engine-assets and docs-landing-assets first)
 	$(PYTHON) -m mkdocs serve --strict
 
 help: ## Show this help message

changes/unreleased/diagram-port-route-gap.fixed.md

@@ -0,0 +1,2 @@
+- **Wires laid out automatically meet their port squares.** They stopped half a port short of the square in the VS Code diagram panel and on the landing page.
+- **Landing diagram boxes leave room for every shared wire lane, and rerouted wires stay inside the hero.**

changes/unreleased/diagram-short-jogs.changed.md

@@ -0,0 +1 @@
+- **Rerouted wires no longer take bends shorter than one grid square** where a straighter route is free, in the VS Code diagram panel and on the landing page.

changes/unreleased/landing-rendered-diagram.changed.md

@@ -0,0 +1 @@
+- **Render the landing-page diagram from the engine-backed model.** The site build bundles the shared diagram code and its routing assets, with wires rerouting as boxes move and dropped boxes kept clear of each other. A dropped box whose port lands just out of line with a wired port lines up with it, so the wire runs straight. Wires keep a right-angled route while a box is dragged too close for libavoid to route around.

docs/assets/opensysml-stack.sysml

@@ -61,18 +61,23 @@ package OpenSysMLStack {
     // Where one model change travels: written and run in OpenSysML, committed
     // to Flexo, pulled into sysml-toolkit and pushed back, then checked
     // against the OMG reference. Each state is named for the part it is at.
+    item def Commit;
+    item def Pull;
+    item def Check;
+    item def Push;
+
     state def ModelJourney {
         entry; then opensysml;
 
         state opensysml;
-        transition commit_change first opensysml accept commit then flexo;
+        transition commit_change first opensysml accept Commit then flexo;
 
         state flexo;
-        transition pull_change first flexo accept pull then toolkit;
-        transition check_change first flexo accept check then pilot;
+        transition pull_change first flexo accept Pull then toolkit;
+        transition check_change first flexo accept Check then pilot;
 
         state toolkit;
-        transition push_change first toolkit accept push then flexo;
+        transition push_change first toolkit accept Push then flexo;
 
         state pilot;
     }

docs/project/third-party-notices.md

@@ -0,0 +1,37 @@
+# Third-party notices
+
+The landing-page diagram uses these third-party packages:
+
+- **elkjs** 0.12.0 — licensed under EPL-2.0 OR GPL-3.0-or-later. Source:
+  https://github.com/kieler/elkjs
+- **libavoid-js** 0.4.5 — licensed under LGPL-2.1-or-later. The full
+  [licence text](../assets/landing/libavoid-js.LICENSE.txt) ships with the
+  landing-page assets. The licence covers both:
+  - `assets/landing/libavoid.wasm`: libavoid compiled to WebAssembly;
+  - the libavoid-js JavaScript bindings compiled into
+    `assets/landing/diagram.js`.
+
+  Copyright:
+  - libavoid: Copyright (C) 2004–2015 Monash University; authors Michael
+    Wybrow, Tim Dwyer and Vladyslav Hnatiuk. Its geometry code is partly based
+    on "Computational Geometry in C" (Second Edition), Copyright (C) 1998
+    Joseph O'Rourke.
+  - libavoid-js: Vladyslav Hnatiuk.
+
+  Source:
+  - libavoid-js 0.4.5:
+    https://github.com/Aksem/libavoid-js/tree/v0.4.5 (commit
+    `28a6fe20c2f1f809afdbeca8d789e65357614c4f`).
+  - libavoid as that release builds it (`ADAPTAGRAMS_VERSION = "1.0.4"` in
+    `tools/generate.py`): `cola/libavoid` in
+    https://github.com/Aksem/adaptagrams/tree/v1.0.4 (commit
+    `dd3236536399e5297b353d02c0b751eeaaf63aee`), a fork of
+    https://github.com/mjwybrow/adaptagrams.
+    Before compiling, libavoid-js's build (`tools/generate.py` at v0.4.5) adds
+    two forward declarations, `class Router;` and
+    `struct HyperedgeNewAndDeletedObjectLists;`, to
+    `cola/libavoid/hyperedgeimprover.h`; no other libavoid source is changed.
+
+To use modified libavoid sources, replace `assets/landing/libavoid.wasm` with
+one built against the libavoid-js 0.4.5 bindings. To modify the JavaScript
+bindings, rebuild `diagram.js` from source with `make docs-landing-assets`.

editors/vscode/package.json

@@ -212,8 +212,9 @@
   "scripts": {
     "grammar": "go run ./tools/gengrammar -out syntaxes",
     "build": "node esbuild.mjs",
+    "build:landing": "node tools/build-landing.mjs",
     "watch": "node esbuild.mjs --watch",
-    "typecheck": "tsc --noEmit -p tsconfig.json && tsc --noEmit -p src/webview/tsconfig.json",
+    "typecheck": "tsc --noEmit -p tsconfig.json && tsc --noEmit -p src/webview/tsconfig.json && tsc --noEmit -p src/landing/tsconfig.json",
     "test": "node tools/test.mjs",
     "package": "npm run typecheck && npm test && npm run build -- --production && vsce package --no-dependencies --out opensysml-sysml.vsix"
   },