@mark1russell7/render-viewer

The live editor of render, as a React component. The type graph shows each class as data, and the canvas holds instances. An edit of an instance or of a class changes the class at once, and each instance follows it. The viewer has summaries, a formula editor, undo and redo, and saved sessions.

npm i @mark1russell7/render-viewer react react-dom

import { App } from "@mark1russell7/render-viewer";
import "@mark1russell7/render-viewer/styles.css";

// With a storage key, the viewer saves its session in the local storage of the browser
export function Editor() {
  return <App storageKey="my-render-session" />;
}

ViewerSession is the model of the viewer without React: its actions, undo and redo, save, restore and open. Try the viewer on the site.

More

• The site: the guide, live demos and the viewer.
• The API reference: the exports of each package.
• The repository: the source, the tests and the review of each known defect.

Each package of render is ESM, has TypeScript declarations, and works in Node.js 22.12 or later and in browsers. The license is MIT.