@dskripchenko/diagrams 1.0.2 → 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/README.md +33 -5
  2. package/dist/index.cjs +15940 -5043
  3. package/dist/index.d.ts +663 -3
  4. package/dist/index.mjs +15938 -5044
  5. package/package.json +14 -2
package/README.md CHANGED
@@ -4,8 +4,8 @@
4
4
  [![npm](https://img.shields.io/npm/v/@dskripchenko/diagrams.svg)](https://www.npmjs.com/package/@dskripchenko/diagrams)
5
5
  [![license](https://img.shields.io/npm/l/@dskripchenko/diagrams.svg)](LICENSE)
6
6
 
7
- Diagrams written in Mermaid syntax, rendered to SVG — with **no runtime
8
- dependencies** and **no DOM**. A string goes in, a string of SVG comes out:
7
+ Diagrams written as text — in **Mermaid** or **PlantUML** syntax — rendered
8
+ to SVG, with **no runtime dependencies** and **no DOM**. A string goes in, a string of SVG comes out:
9
9
  the same call works in a browser, in server-side rendering and in a Node
10
10
  build script.
11
11
 
@@ -18,15 +18,29 @@ const { svg } = render(`flowchart LR
18
18
  B -->|no| D[Reject]`)
19
19
 
20
20
  element.innerHTML = svg
21
+
22
+ // PlantUML: recognised by its @startuml.
23
+ render(`@startuml
24
+ actor User
25
+ User -> API ++ : POST /orders
26
+ return 201
27
+ @enduml`)
21
28
  ```
22
29
 
23
30
  **Supported:** `flowchart` (with subgraphs and per-subgraph direction),
24
- `sequenceDiagram`, `stateDiagram-v2`, `pie`, `gantt`.
31
+ `sequenceDiagram`, `stateDiagram-v2`, `erDiagram`, `classDiagram`, C4
32
+ (`C4Context`, `C4Container`, `C4Component`, `C4Dynamic`, `C4Deployment`),
33
+ `pie`, `gantt`, `timeline`, `xychart-beta`, `mindmap`, `journey`,
34
+ `quadrantChart`, `kanban`, `requirementDiagram`, `architecture-beta`,
35
+ `sankey-beta`, `gitGraph`, `block-beta`; PlantUML sequence,
36
+ use case, component, deployment, activity (with swimlanes), class, object,
37
+ state, ER, C4 (C4-PlantUML) and timing diagrams, mind maps, WBS, Gantt
38
+ charts and Salt wireframes.
25
39
 
26
40
  ## Why another renderer
27
41
 
28
42
  - **Zero dependencies.** Mermaid pulls in d3, dagre, DOMPurify and more —
29
- megabytes. This package is one module under 60 KB gzipped before your
43
+ megabytes. This package is one module of about 100 KB gzipped before your
30
44
  bundler minifies it, layout engine included.
31
45
  - **Safe by construction.** Every label and attribute is escaped by the one
32
46
  SVG builder that produces the output; HTML in labels is shown as text.
@@ -40,7 +54,7 @@ element.innerHTML = svg
40
54
  - **Errors you can act on.** A source that cannot be read raises a
41
55
  `DiagramError` with the line, the column and, where there is one, a hint.
42
56
 
43
- The syntax is a declared subset of Mermaid's. What is supported is listed
57
+ The syntax is a declared subset of Mermaid's and PlantUML's. What is supported is listed
44
58
  per diagram type in the documentation; anything else is an error rather
45
59
  than a silently wrong picture.
46
60
 
@@ -52,8 +66,22 @@ than a silently wrong picture.
52
66
  | Flowchart | [en](docs/en/flowchart.md) | [ru](docs/ru/flowchart.md) | [de](docs/de/flowchart.md) | [zh](docs/zh/flowchart.md) |
53
67
  | Sequence diagram | [en](docs/en/sequence.md) | [ru](docs/ru/sequence.md) | [de](docs/de/sequence.md) | [zh](docs/zh/sequence.md) |
54
68
  | State diagram | [en](docs/en/state.md) | [ru](docs/ru/state.md) | [de](docs/de/state.md) | [zh](docs/zh/state.md) |
69
+ | Entity relationship diagram | [en](docs/en/er.md) | [ru](docs/ru/er.md) | [de](docs/de/er.md) | [zh](docs/zh/er.md) |
70
+ | Class diagram | [en](docs/en/class.md) | [ru](docs/ru/class.md) | [de](docs/de/class.md) | [zh](docs/zh/class.md) |
55
71
  | Pie chart | [en](docs/en/pie.md) | [ru](docs/ru/pie.md) | [de](docs/de/pie.md) | [zh](docs/zh/pie.md) |
56
72
  | Gantt chart | [en](docs/en/gantt.md) | [ru](docs/ru/gantt.md) | [de](docs/de/gantt.md) | [zh](docs/zh/gantt.md) |
73
+ | Timeline | [en](docs/en/timeline.md) | [ru](docs/ru/timeline.md) | [de](docs/de/timeline.md) | [zh](docs/zh/timeline.md) |
74
+ | XY chart | [en](docs/en/xychart.md) | [ru](docs/ru/xychart.md) | [de](docs/de/xychart.md) | [zh](docs/zh/xychart.md) |
75
+ | Mind map | [en](docs/en/mindmap.md) | [ru](docs/ru/mindmap.md) | [de](docs/de/mindmap.md) | [zh](docs/zh/mindmap.md) |
76
+ | Journey | [en](docs/en/journey.md) | [ru](docs/ru/journey.md) | [de](docs/de/journey.md) | [zh](docs/zh/journey.md) |
77
+ | Quadrant chart | [en](docs/en/quadrant.md) | [ru](docs/ru/quadrant.md) | [de](docs/de/quadrant.md) | [zh](docs/zh/quadrant.md) |
78
+ | Kanban board | [en](docs/en/kanban.md) | [ru](docs/ru/kanban.md) | [de](docs/de/kanban.md) | [zh](docs/zh/kanban.md) |
79
+ | Requirement diagram | [en](docs/en/requirement.md) | [ru](docs/ru/requirement.md) | [de](docs/de/requirement.md) | [zh](docs/zh/requirement.md) |
80
+ | Architecture diagram | [en](docs/en/architecture.md) | [ru](docs/ru/architecture.md) | [de](docs/de/architecture.md) | [zh](docs/zh/architecture.md) |
81
+ | Sankey diagram | [en](docs/en/sankey.md) | [ru](docs/ru/sankey.md) | [de](docs/de/sankey.md) | [zh](docs/zh/sankey.md) |
82
+ | Git graph | [en](docs/en/gitgraph.md) | [ru](docs/ru/gitgraph.md) | [de](docs/de/gitgraph.md) | [zh](docs/zh/gitgraph.md) |
83
+ | Block diagram | [en](docs/en/block.md) | [ru](docs/ru/block.md) | [de](docs/de/block.md) | [zh](docs/zh/block.md) |
84
+ | PlantUML | [en](docs/en/plantuml.md) | [ru](docs/ru/plantuml.md) | [de](docs/de/plantuml.md) | [zh](docs/zh/plantuml.md) |
57
85
  | Theming | [en](docs/en/theming.md) | [ru](docs/ru/theming.md) | [de](docs/de/theming.md) | [zh](docs/zh/theming.md) |
58
86
 
59
87
  ## Install