Monorepo for node-based graph/flow editor libraries. Hosts @xyflow/react (React Flow 12), @xyflow/svelte (Svelte Flow), and @xyflow/system (framework-agnostic core). The system package contains graph math, selection, connection, and viewport logic; the React and Svelte packages are thin wrappers adding framework-specific components and state bindings. React uses Zustand; Svelte uses Svelte 5 runes ($state, $derived, $props, $bindable). Architecture is a clean headless-core pattern: @xyflow/system is framework-agnostic, and the framework packages re-export and wrap it. Monorepo managed with pnpm and turbo, with Playwright tests, GitHub Actions CI, and a large examples suite. Actively maintained with frequent releases. Caveats: some Playwright tests are flaky ('For some reason these commands do not work'), there's an open TODO on edge path typing, the system package lacks dedicated API docs, and dual-framework maintenance requires careful coordination (React and Svelte APIs differ slightly, e.g., multiSelectionKeyCode vs multiSelectionKey). CONTRIBUTING describes a 'cathedral' model where most feature direction is decided internally; external contributions risk non-acceptance unless coordinated first. Overall a high-quality, production-grade library. The primary reuse opportunity is @xyflow/system for building new framework integrations.
Mermaid is a mature, browser-oriented TypeScript monorepo that renders Markdown-like text definitions into SVG diagrams. In production it supports over 20 diagram families (flowchart, sequence, class, state, gantt, mindmap, pie, git, ER, C4, sankey, block, agentflow, and more), with a pipeline that detects diagram type from text, lazily loads a parser, builds a diagram-specific data model, and renders through a shared rendering-util layer. Parsing is split across Langium, Chevrotain, and legacy JISON grammars; layout is provided by dagre, ELK, a custom swimlane/orthogonal router, and tidy-tree plugins. The public API (initialize/run/parse/registerExternalDiagrams) makes this a plugin-extensible library rather than a standalone application, though it also ships a local editor, dev-explorer, and extensive e2e tooling. The codebase shows high engineering craft: CI is extensive with Vitest, Playwright visual regression, code coverage, security scanning, dependency automation, and changesets for versioning. Accessibility, XSS sanitization, and config validation are treated as first-class concerns. The theme system is particularly well-structured, managing multiple looks and color palettes through a centralized color-theme gate. The primary weaknesses are scale-driven: mixed parser ecosystems, a very large config surface, many beta diagram types, and highly intricate layout code that is expensive to change. It is neither a data-research repository nor a service; its research-like components are the layout algorithms and geometry validation, which remain embedded in a library architecture.
GoJS is a commercial JavaScript/TypeScript diagramming library for building interactive graphs, flowcharts, org charts, and data-visualization editors in the browser. This repository is the distribution/SDK point: it ships prebuilt core bundles (release/go.js, release/go-module.js, release/go-debug.js, release/go.mjs), TypeScript declarations (release/go.d.ts), and an extensive extension kit in both classic script (extensions/) and ES-module/TypeScript (extensionsJSM/) forms. The actual core source tree is excluded (src/ is git-ignored); users consume GoJS as an npm package or script tag and build diagram templates with a fluent API backed by GraphLinksModel/TreeModel JSON data. In production the library is a model-driven rendering and editing engine: applications push node/link data into a go.Model, declarative templates and bindings map that data to Parts, and GoJS handles canvas/SVG rendering, layout, hit-testing, undo/redo, selection, and interactive tools. There are no server endpoints or standalone executables. The extension kit is intentionally sample-grade: every file warns that APIs can change in point releases and advises copying code into the consumer's project. Despite that, the extensions demonstrate sophisticated, well-structured algorithms—circle/rectangle packing, distance-transform heatmaps, quadtree spatial indexing, SCC-based swimlane routing, and table/flow layouts—and follow consistent patterns such as option-object constructors, transaction-safe mutations, and clone-protected subclasses. No test suite is present, and the same extension is duplicated across TS, ESM JS, and classic JS, creating drift risk. License is not open-source: evaluation, non-commercial, and commercial tiers are defined in the license HTML files.
Foblex Flow is an Angular-native library for building visual node editors, workflow builders, diagram editors, and AI pipeline UIs. It provides a comprehensive set of components and directives (f-flow, f-canvas, f-node, f-connection, f-connector, f-draggable, f-minimap, f-selection-area, etc.) along with plugins for managed state (undo/redo), accessibility (keyboard navigation), layout engines (dagre, elk), reflow-on-resize, and control schemes. The repository is a monorepo (NX) containing the core library, layout packages, a markdown renderer, a documentation portal with SSR, and multiple example applications (call center, schema designer, tournament bracket, UML diagram, marketing automation). The library is production-ready, actively maintained, and demonstrates high craftsmanship with decoupled architecture (mediator pattern), signal-based state management, Web Worker offloading for connection rendering, and extensive E2E testing.
drawio-skill is a comprehensive toolkit for generating, manipulating, validating, and publishing draw.io architecture diagrams from natural language, codebases, infrastructure-as-code, API specifications, and other structured sources. It provides a unified CLI (`diagramctl.py`) and an optional MCP server (`diagramctl_mcp.py`) that expose workflows for building, syncing, viewing, testing, reviewing, querying, what-if analysis, story generation, and publishing diagrams. The system uses a formal Diagram Intermediate Representation (IR) to separate semantic meaning from geometry, enabling incremental reconciliation, multi-view projection, architecture contract enforcement, and accessible HTML story output. It includes 15+ importers for languages (Python, JS, Go, Rust), IaC (Terraform, Kubernetes, Docker Compose), schemas (SQL, OpenAPI, AsyncAPI, Protobuf, GraphQL), and live infrastructure (Docker, Terraform state). The project is packaged as an AI agent skill compatible with Claude Code, Cursor, Copilot, and other Agent Skills hosts, and ships with GitHub Actions for CI integration. While primarily an application, it also bundles curated icon indices and style presets that could be considered data assets.
FlowGram is a comprehensive, production-grade visual workflow development framework from ByteDance. The codebase implements two distinct editing paradigms — fixed-layout (automatic positioning with composite nodes like loops, branches) and free-layout (node-position-free with lines) — both built on a shared plugin architecture using inversify for dependency injection. The framework includes a form engine with reactive fields, validation, and effects; a variable engine with AST-based type inference and scoped lifecycle; and a runtime engine capable of executing workflows with executors for LLM, HTTP, code (QuickJS sandbox), and conditions. The repository contains over 40 packages managed via Rush monorepo, encompassing core libraries, plugins (history, minimap, auto-layout, group, snap, clipboard, export), UI material libraries (Semi UI, Ant Design), a CLI tool for scaffolding, multiple demo applications, and comprehensive documentation. The system is actively maintained with regular commits, CI workflows, and E2E tests. Notable technical decisions include a local fork of the use-gesture library for canvas interaction, heavy decorator-based IoC, and support for both React 17 and 18. While the architecture is well-structured and extensible, the codebase shows signs of duplication between fixed and free layouts, numerous demo-specific components, and some deprecated APIs that indicate ongoing refactoring.
Heimer is a cross-platform desktop mind map editor built with Qt (C++17). It provides a graphical interface for creating, editing, and organizing mind maps with features like adjustable grid, automatic layout optimization, undo/redo, copy/paste, image embedding, and export to PNG/SVG. The architecture follows a layered design: domain layer (Graph, MindMapData, LayoutOptimizer), application layer (services, state machine, settings proxy), view layer (Qt widgets, QGraphicsScene/View, dialogs), and infrastructure layer (file I/O, XML serialization). Key entry points include main.cpp, Application class, MainWindow, EditorView, and EditorService. Data flows from user interactions through EditorView to EditorService, which manipulates the MindMapData (graph) and triggers serialization via AlzFileIO. External dependencies are limited to Qt (5 or 6) and two bundled small libraries (SimpleLogger for logging, Argengine for CLI argument parsing). The layout optimizer uses simulated annealing to arrange nodes, and undo/redo is implemented via snapshot-based state capture. The codebase demonstrates solid engineering practices with unit tests, CI/CD pipelines, and multi-language support.
flowchart.js is a JavaScript library for rendering SVG flowcharts from a text-based DSL. It parses user-defined flowchart syntax into a chart object, positions symbols with collision avoidance, and draws connectors using Raphael.js for cross-browser SVG abstraction. The library supports standard flowchart symbols (start, end, operation, input/output, subroutine, condition, parallel) with flowstate styling (past/current/future), custom link annotations, and click handlers. Architecture-wise, it follows a modular UMD pattern: index.js serves as the entry point exporting FlowChart.parse, while src/ contains separate modules for parsing (flowchart.parse.js), chart management (flowchart.chart.js), symbol base class (flowchart.symbol.js), symbol-type implementations, drawing utilities (flowchart.functions.js), helpers (flowchart.helpers.js), and defaults (flowchart.defaults.js). A jQuery plugin (jquery-plugin.js) enables DOM integration. The code demonstrates clean separation of concerns but relies on the outdated Raphael 2.3.0 dependency and uses a legacy Webpack 1.x build system, indicating moderate technical drift.