Install the Lean 4 VS Code extension
Create a diagram and view it in the InfoView:
def zCnotZ : ZXDiagram :=
.ofList [
.input 0, .spider .Z ⟨1, 1⟩, .spider .Z ⟨0, 1⟩, .spider .Z ⟨1, 1⟩, .output 0,
.input 1, .spider .X ⟨0, 1⟩, .output 1
]
[⟨0, 1⟩, ⟨1, 2⟩, ⟨2, 3⟩, ⟨3, 4⟩, ⟨2, 6⟩, ⟨5, 6⟩, ⟨6, 7⟩]
#html zCnotZ.toHtmlInstall prek and run
prek --install
The InfoView widget lives in zx_view_widget/src/.
It is a React component written in TypeScript, bundled with rollup. Layout and graph-JSON conversion are implemented in zxRender.ts, and rendering uses a vendored copy of pyzx's D3 viewer.
lake handles npm install and the JS bundle automatically:
lake build