Miragon modeler suite
The Miragon modeler platform in one repository: ONE contract every Miragon modeler implements, the
shared chrome around their canvases, and the five modelers built on the two. Each modeler is one
notation: a plain-text file is the source of truth, a diagram-js
renderer shows and edits it, and a web app and a VS Code extension put the renderer in front of
users. Every package and extension keeps its own version and its own npm or Marketplace name.
Modelers
Their libraries on npm, each in modelers/<modeler>/packages/<package>:
- Wardley Maps:
@miragon/wardley-schema-model, @miragon/wardley-dsl, @miragon/wardley-transforms, @miragon/wardley-renderer
- Event Storming:
@miragon/event-storming-schema-model, @miragon/event-storming-dsl, @miragon/event-storming-transforms, @miragon/event-storming-renderer
- Team Topologies:
@miragon/team-topologies-schema-model, @miragon/team-topologies-renderer
- Context Maps:
@miragon/context-maps-schema-model, @miragon/context-maps-cml, @miragon/context-maps-renderer
- Value Chain: ,
The schema-model, dsl, transforms and cml packages are DOM-free and run in any JavaScript
runtime; the renderer packages are the diagram-js viewers and modelers. How to embed one is in
its modeler's README.
Shared packages
| Package | Path | Status |
|---|
@miragon/modeler-api | packages/api | the collaborative-modeler contract and its conformance kit, 0 runtime dependencies |
@miragon/modeler-shell | packages/shell | the shared chrome around diagram-js modelers (menu, palette skin, zoom panel, keys, fit, VS Code plumbing), its conformance kit and a smoke-test driver for a real VS Code (also in a Linux container), 0 runtime dependencies, API |
Every renderer implements the contract and runs its conformance kit; both apps of every modeler
mount the shell and run the shell's conformance kit. The contract's laws, the conformance kit, its
versioning and its roadmap are documented in the package README. The plan
for the shell and the rollout across the modelers started in
#4 and continue in
#170.
- Shell implementation notes: how
@miragon/modeler-shell implements the chrome anatomy and the IDE-host
rules of the Miragon design system with diagram-js, VS Code and browser
APIs, section by section, with the rule each section implements.
Claude Code plugins
One marketplace, .claude-plugin/marketplace.json, serves the
plugins of the suite:
/plugin marketplace add Miragon/modeler-suite
/plugin install wardley-maps-modeler@modeler-suite
/plugin install event-storming-modeler@modeler-suite
/plugin install team-topologies-modeler@modeler-suite
/plugin install modeler-kit@modeler-suite
| Plugin | Skills | For |
|---|
wardley-maps-modeler | wardley-mapping, owm-dsl | the Wardley Mapping method and the .wmap / .owm text format |
event-storming-modeler | event-storming, storm-dsl | the Event Storming method and the .storm text format |
team-topologies-modeler | team-topologies, tt-format | the Team Topologies method and the .tt / .ttm.json format, with a checker |
modeler-kit | new-modeler | building a new Miragon modeler on these two packages, with a runnable template |
Value Chain's notation skill is a project skill in
modelers/value-chain/.claude/skills/, not a plugin.
Drift tests keep the plugins in step with the code (see CONTRIBUTING.md).
Quick start
Node ^22.22.2 or >=24.15.0 and npm. From the repository root:
npm ci
npm run build:shared # @miragon/modeler-api and @miragon/modeler-shell, which every modeler links
npm run wardley-maps dev:webapp:plain # the Wardley Maps web app on Vite, http://127.0.0.1:5180
npm run wardley-maps build # the Wardley Maps packages: its tests resolve them from dist
npm run wardley-maps test # its unit tests
npm test # the shared packages, the repository checks and every modeler's unit tests
npm run lint # type checks and ESLint, everywhere
npm run <modeler> <script> runs a script of one modeler (wardley-maps, event-storming,
team-topologies, context-maps, value-chain), npm run modelers <script> runs it for all
five. CONTRIBUTING.md lists the scripts, the dev servers, the browser, e2e and
VS Code tests, the pre-commit hook and the conventions for commits and pull requests;
docs/ci-and-releases.md explains CI and releases.
Layout
packages/
api/ @miragon/modeler-api: the collaborative-modeler contract and its conformance kit
shell/ @miragon/modeler-shell: the shared chrome, its conformance kit, the VS Code smoke driver
modelers/
wardley-maps/ ─┐ each: packages/ (npm libraries), apps/webapp, apps/vscode, e2e/,
event-storming/ │ example/, docs/, and README.md, CLAUDE.md, CONTRIBUTING.md for what
team-topologies/ │ is special to its notation
context-maps/ │
value-chain/ ─┘
tooling/ the ESLint and dependency-cruiser presets; each modeler names its DOM-free packages in package.json
plugins/modeler-kit/ the Claude Code plugin with the new-modeler skill and its template
.claude-plugin/ the suite's Claude Code marketplace
test/ repository-level checks: the modeler-kit drift test, every modeler's boundaries, Dependabot auto-merge, CI's path decisions
docs/ shell implementation notes, CI and releases
Contributing
See CONTRIBUTING.md, and for each modeler its own
Wardley Maps, Event Storming,
Team Topologies, Context Maps
and Value Chain notes. Agent-oriented rules are in
CLAUDE.md.
License
MIT
