FE-1500: switch the example embed to the Petrinaut preview

[kube]

Summary

Before this PR, /embed/examples/<slug> mounted the full read-only Petrinaut component. Every embed loaded Monaco and the language server to show a model, and offered no way to run it.

The route switches to PetrinautPreview with Quick Simulation. The compact surface loads no language tooling and runs the model's named scenarios from build-time artifacts. The embed URL contract does not change.

9448.mp4

Links

• Ticket FE-1500

Changes

• EmbeddedExamplePage lazy-loads PetrinautPreview from @hashintel/petrinaut/preview

  quickSimulation comes from the build-time HIR artifacts via loadExampleRuntime plus the catalog's parameter bounds.
  Step size and horizon use the simulation defaults.

• Embed route loads the runtime artifacts alongside the model

  Loader resolves loadExample and loadExampleRuntime together.
  Navigation applies applyPreviewNavigationUpdate to the previous search, so the URL carries the same shared subset through the preview-typed codec.

• validateSharedExampleSearch stays the route's search contract

  A fast-check property asserts the preview codec produces the same search as the shared codec on every generated input, so existing embed URLs keep working.

Review fixes

• A Preview navigation keeps the contract fields it does not own

  Writing the Preview's own projection dropped mode, view and overlay on the first selection, and an embed can arrive carrying them because oEmbed copies the source page's mode into the iframe URL.

Test coverage

• example-search.property.test.ts:

  Preview-codec laws, including the codec-equivalence property that pins the URL contract across the switch.

• navigation-search.test.ts, example-search.test.ts:

  Existing shared codec laws, unchanged.

How to test

Embed on the Preview

• Open Petrinaut /embed/examples/gases-1-pn on Vercel

  Expect compact preview instead of full editor

• Quick Simulation > Play

  Expect run to advance with the timeline

URL contract unchanged

• Open a scenario, subnet, or itemType and itemId URL from the previous embed

  Expect it to resolve identically

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
hash	Ready	Preview	Sep 5, 2026 10:27pm UTC
petrinaut	Ready	Preview	Sep 5, 2026 10:27pm UTC
petrinaut-docs	Ready	Preview	Sep 5, 2026 10:27pm UTC

1 Skipped Deployment

Project	Deployment	Actions	Updated
hashdotdesign-tokens	Ignored	Preview	Sep 5, 2026 10:27pm UTC

[cursor]

PR Summary

Low Risk
Scoped to the embed route and navigation helpers; URL contract is explicitly tested to stay backward-compatible, with no auth or data-layer changes.

Overview
Example embeds (/embed/examples/<slug>) now mount PetrinautPreview with Quick Simulation instead of the full read-only Petrinaut editor, so embeds avoid Monaco/language-server chunks and can run named scenarios from build-time runtime artifacts.

The embed route loads example and runtime together (loadExampleRuntime), passes quickSimulation (runtime + catalog parameter bounds) into the preview, and wires navigation through a preview-specific URL codec (previewSearchToNavigationState / navigationStateToPreviewSearch). URL updates use applyPreviewNavigationUpdate so preview-driven navigation only changes scenario, subnet, and selection while preserving mode, view, and overlay when they appear on the iframe URL (e.g. from oEmbed). validateSharedExampleSearch remains the route contract; property and unit tests lock preview codec equivalence and non-destructive writes.

^{Reviewed by Cursor Bugbot for commit 26f037e. Bugbot is set up for automated code reviews on this repo. Configure here.}

[Copilot]

🟡 Changes recommended

Preview navigation currently removes supported mode, view, and overlay URL parameters.

Once you've addressed the issues Copilot identified, you can request another Copilot review.

Pull request overview

Switches example embeds from the full editor to the lightweight Petrinaut Preview with Quick Simulation.

Changes:

• Loads models and generated simulation artifacts concurrently.
• Adapts shared URL navigation to Preview state.
• Adds property-based Preview codec coverage.

File summaries

File	Description
apps/petrinaut-website/src/routes/embed.examples.$slug.tsx	Loads runtime artifacts and wires Preview navigation.
apps/petrinaut-website/src/examples/navigation-search.ts	Adds Preview search-state conversion.
apps/petrinaut-website/src/examples/example-search.property.test.ts	Tests Preview codec round-tripping.
apps/petrinaut-website/src/examples/embedded-example-page.tsx	Replaces the full editor with Preview and Quick Simulation.

Review details

• Files reviewed: 4/4 changed files
• Comments generated: 1
• Review effort level: Balanced

---

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

[cursor]

Cursor Bugbot has reviewed your changes and found 1 potential issue.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

^{Reviewed by Cursor Bugbot for commit f8d9228. Configure here.}