@zenfg/inspector

@zenfg/inspector is an embeddable, renderer-independent DOM workbench for ZenFG Snapshot data. It depends on @zenfg/snapshot, Cytoscape, and ELK, but has no WebGPU, wgpu, engine, or host-UI dependency.

Installation

npm install @zenfg/inspector@0.2.0

Agent Skills

This development package includes an English zenfg-inspector Skill for workbench embedding, live capture, import, themes, and cleanup. Skills support is unreleased: the published 0.2.0 package does not include it. Use a release that explicitly ships Skills, or a tarball built from this branch.

With pnpm 12.11.0 or later (verified with 12.11.2), first install that package as a direct dependency of your application. Then run:

pnpm approve
pnpm install

Approve this package's Skills in the interactive prompt; build-script permission is separate. pnpm links approved Skills into supported project agent directories. If no suitable directory exists, configure skills.dirs before installing. See pnpm Agent Skills for directory selection and approval details. The agent reads the linked Skill and its package-local references.

Quick start

Read the complete Quick Start for imports, caller-owned inputs and the execution lifecycle.

Guides

• Themes and style customization

• Common tasks

• Common mistakes

• Further reading

• CPU and GPU capture

• Analyze and verify a frame

• Workbench behavior

• Timing and memory interpretation

• Frame Flow interaction

• Usage references

• Complete usage guide
• Themes
• Upgrade notes

Documentation and versions

The package manifest declares @zenfg/inspector 0.2.0. Registry badges show the current published channel, not your installed version.

• Exact installed APIs: follow package.json → exports → dist/*.d.ts; declaration maps point to the included src/. Only declared export paths are public.
• Online guide (development branch). The site may describe changes newer than this package.
• TypeScript API (development branch).
• Source and documentation for this release.
• Usage contracts are maintained in this package; follow its local guides. Historical source links describe the named release, which may precede current development changes.
• Package upgrade notes.
• Plain Markdown documentation index (development branch).
• Local guides: workbench and themes.