# Schematex

> Open-source text-to-SVG diagram renderer and controlled React editor for 50 industry-standard diagram types. Every interactive edit persists as ordinary Schematex DSL.

Canonical site: https://schematex.js.org
Source: https://github.com/SchemaTex/SchemaTex
npm: https://www.npmjs.com/package/schematex

## Start here

- [Getting started](https://schematex.js.org/docs/getting-started.md): Install Schematex and render your first diagram in under a minute.
- [Interactive editing](https://schematex.js.org/docs/interactive-editing.md): Embed the open-source React or Vanilla Schematex editor, understand its complete API, and persist safe DSL edits.
- [API reference](https://schematex.js.org/docs/api.md): Schematex JavaScript/TypeScript API — strict render/parse calls, preview-safe result APIs, config options, and tree-shakable imports.
- [Using Schematex with AI](https://schematex.js.org/docs/ai-integration.md): Integrate Schematex into AI agents via the Vercel AI SDK, the hosted MCP endpoint, or the @schematex/mcp npm package.

## Machine-readable resources

- [Complete documentation corpus](https://schematex.js.org/llms-full.txt): all English docs as processed Markdown.
- [Interactive capability registry](https://schematex.js.org/api/interactive-capabilities): exact text and position editing support for every diagram type.
- [Hosted MCP endpoint](https://schematex.js.org/mcp): Streamable HTTP MCP with discovery, syntax, validation, rendering, inspection, and atomic edit tools.
- Any canonical docs URL has a Markdown mirror by appending `.md`, for example `/docs/circuit.md`.

## Package entry points

- `schematex`: render, parse, result APIs, types, and capability discovery.
- `schematex/react`: `SchematexDiagram` and controlled `InteractiveSchematexDiagram`.
- `schematex/interactive`: low-level Vanilla DOM editing primitives.
- `schematex/ai`: framework-neutral discovery, validation, inspection, and atomic edit functions.
- `schematex/ai/sdk`: Vercel AI SDK tool adapters.
- `schematex/browser`: strict and preview-safe DOM render helpers.

## Installation

```bash
npm install schematex
```

## All documentation

- [Block diagram](https://schematex.js.org/docs/block.md)
- [Bowtie Risk Diagram](https://schematex.js.org/docs/bowtie.md)
- [BPMN / Business Process](https://schematex.js.org/docs/bpmn.md)
- [Breadboard / Physical Wiring](https://schematex.js.org/docs/breadboard.md)
- [Causal Loop Diagram](https://schematex.js.org/docs/causalloop.md): System-dynamics feedback diagrams — the engine enumerates every feedback loop and classifies it reinforcing or balancing by polarity.
- [Circuit schematic](https://schematex.js.org/docs/circuit.md)
- [Comparison & Decision Matrix](https://schematex.js.org/docs/comparison.md)
- [Contributing a new diagram type](https://schematex.js.org/docs/contributing.md): Step-by-step guide for adding a new diagram plugin to Schematex — from standard spec to published website example.
- [Decision tree diagram](https://schematex.js.org/docs/decisiontree.md)
- [Ecomap](https://schematex.js.org/docs/ecomap.md)
- [Entity structure diagram](https://schematex.js.org/docs/entity.md)
- [EPC (Event-driven Process Chain)](https://schematex.js.org/docs/epc.md): ARIS business-process diagrams — alternating events and functions wired by AND/OR/XOR connectors, with structural well-formedness validation.
- [ERD (Entity-Relationship Diagram)](https://schematex.js.org/docs/erd.md)
- [Event Tree Analysis](https://schematex.js.org/docs/eventtree.md): Inductive forward risk analysis — one initiating event branches success/failure through safety functions to quantified end states.
- [Fault Tree Analysis](https://schematex.js.org/docs/faulttree.md)
- [Fishbone diagram](https://schematex.js.org/docs/fishbone.md)
- [Floor plan](https://schematex.js.org/docs/floorplan.md)
- [Flowchart](https://schematex.js.org/docs/flowchart.md)
- [FMEA Worksheet](https://schematex.js.org/docs/fmea.md): Failure Mode and Effects Analysis — the engine computes RPN and AIAG-VDA Action Priority from a nested item → mode → effect/cause tree.
- [Function Block Diagram (FBD)](https://schematex.js.org/docs/fbd.md)
- [Genogram](https://schematex.js.org/docs/genogram.md)
- [Git Graph](https://schematex.js.org/docs/gitgraph.md): Mermaid-compatible commit-history graphs — branches, merges, tags, cherry-picks — rendered from a replayed sequence of git operations.
- [IDEF0 Function Model](https://schematex.js.org/docs/idef0.md): Structured-analysis activity models — function boxes wired by ICOM arrows (Input/Control/Output/Mechanism), correct by construction.
- [Introduction](https://schematex.js.org/docs.md): Every diagram a doctor, engineer, or lawyer would actually use. Free. Fully open source. Made for AI. Industry-standard diagrams — genogram to fault tree — from a text DSL.
- [Ladder logic](https://schematex.js.org/docs/ladder.md)
- [Logic gate diagram](https://schematex.js.org/docs/logic.md)
- [Markov Chain](https://schematex.js.org/docs/markov.md): State-transition diagrams where the engine validates the stochastic matrix, classifies states, and computes the stationary or absorption answer.
- [Matrix / Quadrant diagram](https://schematex.js.org/docs/matrix.md)
- [Mind map](https://schematex.js.org/docs/mindmap.md)
- [Network Topology](https://schematex.js.org/docs/network.md)
- [Org chart](https://schematex.js.org/docs/orgchart.md)
- [P&ID (Piping & Instrumentation Diagram)](https://schematex.js.org/docs/pid.md)
- [Pedigree](https://schematex.js.org/docs/pedigree.md)
- [PERT / CPM Network](https://schematex.js.org/docs/pert.md)
- [Petri Net](https://schematex.js.org/docs/petri.md)
- [Phylogenetic tree](https://schematex.js.org/docs/phylo.md)
- [PRISMA 2020 flow diagram](https://schematex.js.org/docs/prisma.md)
- [Reliability Block Diagram](https://schematex.js.org/docs/rbd.md)
- [Sequential Function Chart (SFC)](https://schematex.js.org/docs/sfc.md)
- [Single-line diagram (SLD)](https://schematex.js.org/docs/sld.md)
- [Site plan](https://schematex.js.org/docs/siteplan.md)
- [Sociogram](https://schematex.js.org/docs/sociogram.md)
- [Sports playbook](https://schematex.js.org/docs/playbook.md)
- [State diagram](https://schematex.js.org/docs/state.md)
- [Threat Model (STRIDE DFD)](https://schematex.js.org/docs/threatmodel.md): Security data-flow diagrams where the engine maps STRIDE threats per element and flags every trust-boundary crossing.
- [Timeline diagram](https://schematex.js.org/docs/timeline.md)
- [Timing diagram](https://schematex.js.org/docs/timing.md)
- [UML Class Diagram](https://schematex.js.org/docs/umlclass.md)
- [UML Sequence Diagram](https://schematex.js.org/docs/sequence.md)
- [UML Use Case Diagram](https://schematex.js.org/docs/usecase.md)
- [Venn / Euler diagram](https://schematex.js.org/docs/venn.md)
- [Welding symbol diagram](https://schematex.js.org/docs/welding.md)