JS Runtime Inspector renders values of all cells


I’m embedding some notebooks using runtime.

import { Runtime, Inspector } from "https://cdn.jsdelivr.net/npm/@observablehq/runtime@5/dist/runtime.js";
import define from "https://api.observablehq.com/@nxrix/name.js?v=4";
new Runtime().module(define, Inspector.into("main"));

It works, but elements that have viewof still show the inspect element for their value.
I tried hiding them with CSS, but that broke some other things.

I found older discussion about the same issue: Embedded notebook shows input value at bottom of cell.
However, it doesn’t seem to have a good solution.

this renders properly, you have to handle viewof, mutable and imports all as special cases.

You have to group variables into cells. This notebook does it

My notes on how things works are here

Its definitely not complete!

Notebook Kit Notebooks 2.0 have potential for a cleaner model for the JS part, but then imports are a bit weird currently so that potential is not banked yet and I am stuck on Notebook 1.0 for a while (I have a Notebook 2.0 decompiler in my stash though!)