`
+ return self.createBlock(parent, 'pass', html, {}, {})
+ })
+ })
+}
diff --git a/plantuml-docs/antora-playbook.yml b/plantuml-docs/antora-playbook.yml
new file mode 100644
index 00000000..0d527d84
--- /dev/null
+++ b/plantuml-docs/antora-playbook.yml
@@ -0,0 +1,23 @@
+site:
+ title: PlantUML Alternative Docs
+ start_page: docs::index.adoc
+ robots: disallow
+ # keys:
+ # google_analytics: XX-123456
+ # url: https://plantuml.github.io/plantuml-alternative-docs/
+content:
+ sources:
+ - url: ..
+ branches: HEAD
+ start_path: plantuml-docs
+ui:
+ bundle:
+ url: _antora/ui-bundle.zip
+ snapshot: true
+ supplemental_files: _antora/supplemental-ui
+antora:
+ extensions:
+ - require: '@antora/lunr-extension'
+asciidoc:
+ extensions:
+ - ./_asciidoc/extensions/plantuml-source-block.js
\ No newline at end of file
diff --git a/plantuml-docs/antora.yml b/plantuml-docs/antora.yml
new file mode 100644
index 00000000..81686e6a
--- /dev/null
+++ b/plantuml-docs/antora.yml
@@ -0,0 +1,5 @@
+name: docs
+version: 'main'
+title: Docs
+nav:
+ - modules/ROOT/nav.adoc
diff --git a/plantuml-docs/docs_from_alphadoc/.gitkeep b/plantuml-docs/docs_from_alphadoc/.gitkeep
new file mode 100644
index 00000000..e69de29b
diff --git a/plantuml-docs/docs_from_alphadoc/a_begin_for_this_wiki.adoc b/plantuml-docs/docs_from_alphadoc/a_begin_for_this_wiki.adoc
new file mode 100644
index 00000000..055b4a53
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/a_begin_for_this_wiki.adoc
@@ -0,0 +1,364 @@
+== A begin for this wiki...
+
+__(in order to be on the top of the TOC... ;-)__
+
+
+== For starting
+
+You can read : link::start[the start page].
+
+
+== Issues: __"If you see something, say something"__
+
+For that, you can go the link::issues[issues page].
+
+
+== Improve Documentation
+
+Contribute by:
+* by improving the English PlantUML documentation
+* by translating the English pages
+* by adding new topics...
+* helping with the huge categorized list of https://github.com/plantuml/plantuml/issues/261[Undocumented plantuml features] (100-200 tasks gathered from the forum) that needs your help!
+* here is the page, on **this wiki**, for follow link::undocumented[Undocumented PlantUML features in order to document]
+
+Here's how to start:
+* go to the http://alphadoc.plantuml.com/toc/[TOC] or mini-TOC (below)
+* select your preferred wiki syntax
+* select your language __(if you want to translate)__
+* and select a topic.
+
+
+== Wiki Mini TOC
+
+This section lists all pages in a categorized listing, whereas http://alphadoc.plantuml.com/toc/markdown/en[Wiki TOC] also lists all subsections.
+
+=== This Documentation Wiki
+* link::start[Start]
+* link::a_begin_for_this_wiki[A Begin for This Wiki]
+* link::menu[Menu translation]
+* link::formatting[formatting]
+* link::syntax-asciidoc[syntax-asciidoc]
+* link::syntax-dokuwiki[syntax-dokuwiki]
+* link::syntax-markdown[syntax-markdown]
+* link::poll-about-wiki-syntax[poll-about-wiki-syntax]
+
+=== Intro
+* link::index[Index]
+* link::starting[Quick Start]
+* link::faq[FAQ]
+* http://plantuml.com/guide[PlantUML Language Reference Guide]
+* https://plantuml.com/running[Running with Other Tools]
+* link::what-is-a-software-modeling-tool[What is a Software Modeling Tool]
+
+=== Diagrams
+
+The default header/footer (or StartTag/EndTag) are `+@startuml+`/`+@enduml+`.
+
+|===
+| Diagram | Diagram Issues | Header | Keyword | Sub-diagram Keyword
+
+| link::activity-diagram-beta[Activity]
+| link::activity-diagram-issues[Activity Issues]
+|
+|
+|
+
+| link::activity-diagram-beta#vmm58ifz7wd3k362kj5w[Activity - Specification and Description Language (SDL)]
+|
+|
+|
+|
+
+| link::activity-diagram-legacy[Activity-legacy] [[#FF6600#deprecated]]
+|
+|
+|
+|
+
+| link::archimate-diagram[Archimate]
+|
+|
+|
+|
+
+| link::bpmn[Business Process Modeling Notation (BPMN)]
+|
+| @startbpm
+|
+|
+
+| link::board-diagram[Board or User Story Maps+++ +++(๐ง __under construction__)]
+|
+| @startboard
+|
+| {{board
+
+| link::class-diagram[Class]
+| link::class-diagram-issues[Class Issues]
+|
+|
+|
+
+| link::component-diagram[Component]
+| link::deployment-diagram-issues[Deployment Issue]
+|
+|
+|
+
+| link::deployment-diagram[Deployment]
+| link::deployment-diagram-issues[Deployment Issue]
+|
+|
+|
+
+| link::ebnf[EBNF+++ +++(๐ functionality)]
+| link::ebnf-issues[EBNF Issues]
+| @startebnf
+|
+| {{ebnf
+
+| link::gantt-diagram[Gantt project planning]
+|
+| @startgantt
+|
+| {{gantt
+
+| link::ie-diagram[Information Engineering (IE) / Entity Relationship (ER)]
+|
+|
+|
+|
+
+| link::json[JSON]
+| link::json-issues[JSON Issues]
+| @startjson
+|
+| {{json
+
+| link::mindmap-diagram[MindMap]
+|
+| @startmindmap
+|
+| {{mindmap
+
+| link::nwdiag[Network (nwdiag)]
+| link::nwdiag-issues[Network Issue]
+| @startnwdiag
+| nwdiag {+++ +++}
+|
+
+| link::object-diagram[Object]
+|
+|
+|
+|
+
+| link::problem-diagram[Problem diagram]
+|
+|
+|
+|
+
+| link::sequence-diagram[Sequence]
+|
+|
+|
+|
+
+| link::state-diagram[State]
+| link::state-diagram-issues[State Issue]
+|
+|
+|
+
+| link::timing-diagram[Timing]
+| link::timing-diagram-issues[Timing Issue]
+|
+|
+|
+
+| link::use-case-diagram[Use-Case]
+| link::deployment-diagram-issues[Deployment Issue]
+|
+|
+|
+
+| link::wbs-diagram[Work Breakdown Structure (WBS)]
+|
+| @startwbs
+|
+| {{wbs
+
+| link::salt[Wireframe (SALT)]
+|
+| @startsalt
+| salt+++ +++{+++ +++}
+|
+
+| link::wire-diagram[Wire or Block Diagram+++ +++(๐ __beta version to test__)]
+|
+| @startwire
+|
+| {{wire [[#00CC00#Version 1.2021.01]]
+
+| link::yaml[YAML]
+|
+| @startyaml
+|
+| {{yaml [[#00CC00#Version 1.2021.01]]
+
+|===
+
+=== Other Diagrams/Games
+
+|===
+| Diagram | Header | Keyword | Sub-diagram Keyword | Command
+
+| link::creole[Creole]
+| @startcreole
+|
+|
+|
+
+| link::ditaa[ditaa]
+| @startditaa
+| ditaa
+|
+| (--no-separation, --no-shadows, scale=)
+
+| link::dot[Dot]
+| @startdot
+| digraph {+++ +++}
+|
+|
+
+| link::ascii-math[Math]
+| @startmath
+| `++`
+|
+|
+
+| link::ascii-math[LaTeX]
+| @startlatex
+| `+...+`
+|
+|
+
+| link::oregon-trail[Oregon Trail]
+|
+|
+|
+| run oregon trail
+
+| link::sudoku[Sudoku]
+|
+|
+|
+| sudoku
+
+| link::xearth[XEarth]
+|
+|
+|
+| xearth
+
+|===
+
+=== Common/Markup/Layout
+* link::commons[commons]
+* link::ascii-math[๐งฎ AsciiMath]
+* link::color[๐ color]
+* link::creole[creole]
+* link::font[๐ค font]
+* link::gfm-support[GFM-support]
+* link::handwritten[โ handwritten]
+* link::notes[๐จ notes]
+* link::link[๐ link]
+* link::openiconic[openiconic]
+* link::skinparam[skinparam]
+* link::sprite[sprite]
+* link::style-evolution-history[style-evolution-history]
+* link::style-evolution[๐จ๐๏ธstyle-evolution (Style or CSS like style)]
+* link::using-a-citation-manager[using-a-citation-manager]
+* link::poll-about-package-and-namespace[poll-about-package-and-namespace]
+
+=== Preprocessing/Libraries
+* link::stdlib[๐ stdlib]
+* link::theme[๐ผ๏ธ theme]
+* link::theme-gallery[๐ผ๏ธ๐ theme Gallery]
+* link::preprocessing[โ preprocessing __(new)__]
+* link::preprocessing-json[preprocessing-json]
+* link::preprocessing-gallery[โ๐ Preprocessing Gallery]
+* link::preprocessing-v2[preprocessing-v2 __(old)__] [[#FF6600#deprecated]]
+* link::plantumlshell[plantumlshell __(very old)__] [[#FF6600#deprecated]]
+
+=== URL Authentication
+* link::url-authentication[URL-Authentication]
+** link::url-basicauth[URL-BasicAuth]
+** link::url-oauth[URL-OAauth]
+** link::url-tokenauth[URL-TokenAuth]
+
+=== Alternative Layouters
+* link::smetana02[Smetana]
+* link::elk[ELK]
+* link::svek[Svek]
+* link::teoz[Teoz]
+* link::vizjs[VizJs]
+
+=== Executing
+* link::command-line[Command-line]
+* link::faq-install[FAQ-install]
+* link::ftp[FTP]
+* link::gui[GUI]
+* link::graphviz-dot[Graphviz-dot]
+* link::server[Server]
+* link::sources[Sources]
+* link::security[Security]
+* link::starting[Starting]
+* link::statistics-report[Statistics-report]
+* link::text-encoding[Text-encoding]
+* link::unicode[Unicode]
+* link::versioning-scheme[Versioning-scheme]
+
+=== Alternative Output
+* link::ascii-art[ASCII-art]
+* link::eps[EPS]
+* link::latex[LaTeX]
+* link::pdf[PDF]
+* link::svg[SVG]
+
+=== Integrations
+
+__(see https://plantuml.com/running[running] for a lot more links, unfortunately that page is not on alphadocs)__
+
+* link::ant-task[Ant-task]
+* link::doclet[Doclet]
+* link::docutils[Docutils]
+* link::doxygen[Doxygen]
+* link::eclipse[Eclipse]
+* link::emacs[Emacs]
+* link::javadoc[Javadoc]
+* link::jquery[JQuery]
+* link::pmwiki[PmWiki]
+* link::word[Word]
+* link::xmi[XMI]
+
+=== Programming
+* link::developers[Developers]
+* link::api[API]
+* link::code-groovy[code-groovy]
+* link::code-javascript-asynchronous[code-javascript-asynchronous]
+* link::code-javascript-synchronous[code-javascript-synchronous]
+* link::code-php[code-php]
+
+=== Support and Appreciation
+* link::patreon-support[Patreon-support]
+* link::donors[Donors]
+* link::external-links[External-links]: Projects using PlantUML, Learn & Teach with PlantUML, etc.
+* link::professional[Professional]
+* link::issues[Wiki Issues]
+* link::dedication[Dedication]
+* link::steve[Steve Jobs]
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/activity-diagram-beta.adoc b/plantuml-docs/docs_from_alphadoc/activity-diagram-beta.adoc
new file mode 100644
index 00000000..f5943601
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/activity-diagram-beta.adoc
@@ -0,0 +1,1289 @@
+== Activity Diagram (new)
+
+Old link::activity-diagram-legacy[syntax for activity diagram] had several limitations and
+drawbacks (for example, it's difficult to maintain).
+
+So a completely new syntax and implementation is now available to users. Another advantage of this implementation is that it's done without the need of having
+Graphviz installed (as for sequence diagrams).
+
+This syntax will replace the old legacy one. However, for compatibility reason, the old syntax will still be recognized, to ensure __ascending compatibility__.
+
+Users are simply encouraged to migrate to the new syntax.
+
+
+== Simple action
+Activities label starts with `+:+` and ends with `+;+`.
+
+Text formatting can be done using link::creole[creole wiki syntax].
+
+They are implicitly linked in their definition order.
+
+@startuml
+:Hello world;
+:This is defined on
+several **lines**;
+@enduml
+
+
+
+== Start/Stop/End
+
+You can use `+start+` and `+stop+` keywords to denote the
+beginning and the end of a diagram.
+
+
+@startuml
+start
+:Hello world;
+:This is defined on
+several **lines**;
+stop
+@enduml
+
+
+You can also use the `+end+` keyword.
+
+@startuml
+start
+:Hello world;
+:This is defined on
+several **lines**;
+end
+@enduml
+
+
+
+== Conditional
+
+You can use `+if+`, `+then+` and `+else+` keywords to put tests in your diagram.
+Labels can be provided using parentheses.
+
+The 3 syntaxes are possible:
+* `+if (...) then (...)+`
+
+@startuml
+
+start
+
+if (Graphviz installed?) then (yes)
+ :process all\ndiagrams;
+else (no)
+ :process only
+ __sequence__ and __activity__ diagrams;
+endif
+
+stop
+
+@enduml
+
+
+* `+if (...) is (...) then+`
+
+@startuml
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+@enduml
+
+
+* `+if (...) equals (...) then+`
+
+@startuml
+if (counter?) equals (5) then
+:print 5;
+else
+:print not 5;
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/301/activity-diagram-beta?show=302#a302[QA-301]]__
+
+=== Several tests (horizontal mode)
+
+You can use the `+elseif+` keyword to have several tests __(by default, it is the horizontal mode)__:
+
+
+@startuml
+start
+if (condition A) then (yes)
+ :Text 1;
+elseif (condition B) then (yes)
+ :Text 2;
+ stop
+(no) elseif (condition C) then (yes)
+ :Text 3;
+(no) elseif (condition D) then (yes)
+ :Text 4;
+else (nothing)
+ :Text else;
+endif
+stop
+@enduml
+
+
+=== Several tests (vertical mode)
+
+You can use the command `+!pragma useVerticalIf on+` to have the tests in vertical mode:
+
+
+@startuml
+!pragma useVerticalIf on
+start
+if (condition A) then (yes)
+ :Text 1;
+elseif (condition B) then (yes)
+ :Text 2;
+ stop
+elseif (condition C) then (yes)
+ :Text 3;
+elseif (condition D) then (yes)
+ :Text 4;
+else (nothing)
+ :Text else;
+endif
+stop
+@enduml
+
+
+You can use the `+-P+` link::command-line[command-line] option to specify the pragma:
+
+----
+java -jar plantuml.jar -PuseVerticalIf=on
+----
+
+__[Refs. https://forum.plantuml.net/3931/please-provide-elseif-structure-vertically-activity-diagrams[QA-3931], https://github.com/plantuml/plantuml/issues/582[issue-582]]__
+
+
+== Switch and case [switch, case, endswitch]
+
+You can use `+switch+`, `+case+` and `+endswitch+` keywords to put switch in your diagram.
+
+Labels can be provided using parentheses.
+
+
+
+@startuml
+start
+switch (test?)
+case ( condition A )
+ :Text 1;
+case ( condition B )
+ :Text 2;
+case ( condition C )
+ :Text 3;
+case ( condition D )
+ :Text 4;
+case ( condition E )
+ :Text 5;
+endswitch
+stop
+@enduml
+
+
+
+== Conditional with stop on an action [kill, detach]
+
+You can stop action on a if loop.
+
+@startuml
+if (condition?) then
+ :error;
+ stop
+endif
+#palegreen:action;
+@enduml
+
+
+But if you want to stop at the precise action, you can use the `+kill+` or `+detach+` keyword:
+
+* `+kill+`
+
+@startuml
+if (condition?) then
+ #pink:error;
+ kill
+endif
+#palegreen:action;
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/265/new-activity-diagram-syntax-direction-of-links?show=306#a306[QA-265]]__
+
+* `+detach+`
+
+@startuml
+if (condition?) then
+ #pink:error;
+ detach
+endif
+#palegreen:action;
+@enduml
+
+
+
+== Repeat loop
+
+You can use `+repeat+` and `+repeatwhile+` keywords to have repeat loops.
+
+
+@startuml
+
+start
+
+repeat
+ :read data;
+ :generate diagrams;
+repeat while (more data?) is (yes)
+->no;
+stop
+
+@enduml
+
+
+It is also possible to use a full action as `+repeat+` target and insert an action in the return path using the `+backward+` keyword.
+
+
+@startuml
+
+start
+
+repeat :foo as starting label;
+ :read data;
+ :generate diagrams;
+backward:This is backward;
+repeat while (more data?)
+
+stop
+
+@enduml
+
+
+
+== Break on a repeat loop [break]
+
+You can use the `+break+` keyword after an action on a loop.
+
+@startuml
+start
+repeat
+ :Test something;
+ if (Something went wrong?) then (no)
+ #palegreen:OK;
+ break
+ endif
+ ->NOK;
+ :Alert "Error with long text";
+repeat while (Something went wrong with long text?) is (yes) not (no)
+->//merged step//;
+:Alert "Success";
+stop
+@enduml
+
+
+
+__[Ref. https://forum.plantuml.net/6105/possible-to-draw-a-line-to-another-box-via-id-or-label?show=6107#a6107[QA-6105]]__
+
+
+== Goto and Label Processing [label, goto]
+
+โ It is currently only experimental ๐ง
+
+You can use `+label+` and `+goto+` keywords to denote goto processing, with:
+* `+label +`
+* `+goto +`
+
+
+@startuml
+title Point two queries to same activity\nwith `goto`
+start
+if (Test Question?) then (yes)
+'space label only for alignment
+label sp_lab0
+label sp_lab1
+'real label
+label lab
+:shared;
+else (no)
+if (Second Test Question?) then (yes)
+label sp_lab2
+goto sp_lab1
+else
+:nonShared;
+endif
+endif
+:merge;
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/15026/[QA-15026], https://forum.plantuml.net/12526/[QA-12526] and initially https://forum.plantuml.net/1626[QA-1626]]__
+
+
+== While loop
+
+You can use `+while+` and `+endwhile+` keywords to have repeat loops.
+
+
+@startuml
+
+start
+
+while (data available?)
+ :read data;
+ :generate diagrams;
+endwhile
+
+stop
+
+@enduml
+
+
+It is possible to provide a label after the `+endwhile+` keyword, or using the `+is+` keyword.
+
+
+@startuml
+while (check filesize ?) is (not empty)
+ :read file;
+endwhile (empty)
+:close file;
+@enduml
+
+
+If you are using `+detach+` to form an infinite while loop, then you will want to also hide the partial arrow that results using `+-[hidden]->+`
+
+
+@startuml
+:Step 1;
+if (condition1) then
+ while (loop forever)
+ :Step 2;
+ endwhile
+ -[hidden]->
+ detach
+else
+ :end normally;
+ stop
+endif
+@enduml
+
+
+
+== Parallel processing [fork, fork again, end fork, end merge]
+
+You can use `+fork+`, `+fork again+` and `+end fork+` or `+end merge+` keywords to denote parallel processing.
+
+=== Simple `+fork+`
+
+@startuml
+start
+fork
+ :action 1;
+fork again
+ :action 2;
+end fork
+stop
+@enduml
+
+
+=== `+fork+` with end merge
+
+@startuml
+start
+fork
+ :action 1;
+fork again
+ :action 2;
+end merge
+stop
+@enduml
+
+__[Ref. https://forum.plantuml.net/5320/please-provide-fork-without-join-with-merge-activity-diagrams?show=5321#a5321[QA-5320]]__
+
+
+@startuml
+start
+fork
+ :action 1;
+fork again
+ :action 2;
+fork again
+ :action 3;
+fork again
+ :action 4;
+end merge
+stop
+@enduml
+
+
+
+@startuml
+start
+fork
+ :action 1;
+fork again
+ :action 2;
+ end
+end merge
+stop
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/13731[QA-13731]]__
+
+=== Label on `+end fork+` (or UML joinspec):
+
+@startuml
+start
+fork
+ :action A;
+fork again
+ :action B;
+end fork {or}
+stop
+@enduml
+
+
+@startuml
+start
+fork
+ :action A;
+fork again
+ :action B;
+end fork {and}
+stop
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/5346/please-inplement-joinspec-for-join-nodes?show=5348#a5348[QA-5346]]__
+
+=== Other example
+
+@startuml
+
+start
+
+if (multiprocessor?) then (yes)
+ fork
+ :Treatment 1;
+ fork again
+ :Treatment 2;
+ end fork
+else (monoproc)
+ :Treatment 1;
+ :Treatment 2;
+endif
+
+@enduml
+
+
+
+== Split processing
+
+=== Split
+You can use `+split+`, `+split again+` and `+end split+` keywords to denote split processing.
+
+
+@startuml
+start
+split
+ :A;
+split again
+ :B;
+split again
+ :C;
+split again
+ :a;
+ :b;
+end split
+:D;
+end
+@enduml
+
+
+=== Input split (multi-start)
+You can use `+hidden+` arrows to make an input split (multi-start):
+
+@startuml
+split
+ -[hidden]->
+ :A;
+split again
+ -[hidden]->
+ :B;
+split again
+ -[hidden]->
+ :C;
+end split
+:D;
+@enduml
+
+
+
+@startuml
+split
+ -[hidden]->
+ :A;
+split again
+ -[hidden]->
+ :a;
+ :b;
+split again
+ -[hidden]->
+ (Z)
+end split
+:D;
+@enduml
+
+__[Ref. https://forum.plantuml.net/8662[QA-8662]]__
+
+=== Output split (multi-end)
+
+You can use `+kill+` or `+detach+` to make an output split (multi-end):
+
+
+@startuml
+start
+split
+ :A;
+ kill
+split again
+ :B;
+ detach
+split again
+ :C;
+ kill
+end split
+@enduml
+
+
+@startuml
+start
+split
+ :A;
+ kill
+split again
+ :b;
+ :c;
+ detach
+split again
+ (Z)
+ detach
+split again
+ end
+split again
+ stop
+end split
+@enduml
+
+
+
+== Notes
+
+Text formatting can be done using link::creole[creole wiki syntax].
+
+A note can be floating, using `+floating+` keyword.
+
+@startuml
+
+start
+:foo1;
+floating note left: This is a note
+:foo2;
+note right
+ This note is on several
+ //lines// and can
+ contain HTML
+ ====
+ * Calling the method ""foo()"" is prohibited
+end note
+stop
+
+@enduml
+
+
+You can add note on backward activity:
+
+
+@startuml
+start
+repeat :Enter data;
+:Submit;
+backward :Warning;
+note right: Note
+repeat while (Valid?) is (No) not (Yes)
+stop
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/11788/is-it-possible-to-add-a-note-to-backward-activity?show=11802#a11802[QA-11788]]__
+
+
+You can add note on partition activity:
+
+@startuml
+start
+partition "**process** HelloWorld" {
+ note
+ This is my note
+ ----
+ //Creole test//
+ end note
+ :Ready;
+ :HelloWorld(i)>
+ :Hello-Sent;
+}
+@enduml
+
+__[Ref. https://forum.plantuml.net/2398/is-it-possible-to-add-a-comment-on-top-of-a-activity-partition?show=2403#a2403[QA-2398]]__
+
+
+== Colors
+
+You can specify a link::color[color] for some activities.
+
+
+@startuml
+
+start
+:starting progress;
+#HotPink:reading configuration files
+These files should be edited at this point!;
+#AAAAAA:ending of the process;
+
+@enduml
+
+
+You can also use link::color[gradient color].
+
+@startuml
+start
+partition #red/white testPartition {
+ #blue\green:testActivity;
+}
+@enduml
+
+__[Ref. https://forum.plantuml.net/4906/setting-ad-hoc-gradient-backgrounds-in-activity?show=4917#a4917[QA-4906]]__
+
+
+== Lines without arrows
+
+You can use `+skinparam ArrowHeadColor none+` in order to connect activities using lines only, without arrows.
+
+
+@startuml
+skinparam ArrowHeadColor none
+start
+:Hello world;
+:This is on defined on
+several **lines**;
+stop
+@enduml
+
+
+
+
+@startuml
+skinparam ArrowHeadColor none
+start
+repeat :Enter data;
+:Submit;
+backward :Warning;
+repeat while (Valid?) is (No) not (Yes)
+stop
+@enduml
+
+
+
+== Arrows
+
+Using the `+->+` notation, you can add texts to arrow, and change
+their link::color[color].
+
+It's also possible to have dotted, dashed, bold or hidden arrows.
+
+
+@startuml
+:foo1;
+-> You can put text on arrows;
+if (test) then
+ -[#blue]->
+ :foo2;
+ -[#green,dashed]-> The text can
+ also be on several lines
+ and **very** long...;
+ :foo3;
+else
+ -[#black,dotted]->
+ :foo4;
+endif
+-[#gray,bold]->
+:foo5;
+@enduml
+
+
+
+
+== Connector
+
+You can use parentheses to denote connector.
+
+
+@startuml
+start
+:Some activity;
+(A)
+detach
+(A)
+:Other activity;
+@enduml
+
+
+
+
+== Color on connector
+
+You can add link::color[color] on connector.
+
+
+@startuml
+start
+:The connector below
+wishes he was blue;
+#blue:(B)
+:This next connector
+feels that she would
+be better off green;
+#green:(G)
+stop
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/10077/assigning-color-to-connectors?show=10080#c10080[QA-10077]]__
+
+
+== Grouping or partition
+
+=== Group
+You can group activity together by defining group:
+
+@startuml
+start
+group Initialization
+ :read config file;
+ :init internal variable;
+end group
+group Running group
+ :wait for user interaction;
+ :print information;
+end group
+
+stop
+@enduml
+
+
+=== Partition
+You can group activity together by defining partition:
+
+
+@startuml
+start
+partition Initialization {
+ :read config file;
+ :init internal variable;
+}
+partition Running {
+ :wait for user interaction;
+ :print information;
+}
+
+stop
+@enduml
+
+
+
+It's also possible to change partition link::color[color]:
+
+
+@startuml
+start
+partition #lightGreen "Input Interface" {
+ :read config file;
+ :init internal variable;
+}
+partition Running {
+ :wait for user interaction;
+ :print information;
+}
+stop
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/2793/activity-beta-partition-name-more-than-one-word-does-not-work?show=2798#a2798[QA-2793]]__
+
+It's also possible to add link::link[link] to partition:
+
+@startuml
+start
+partition "[[http://plantuml.com partition_name]]" {
+ :read doc. on [[http://plantuml.com plantuml_website]];
+ :test diagram;
+}
+end
+@enduml
+
+__[Ref. https://forum.plantuml.net/542/ability-to-define-hyperlink-on-diagram-elements?show=14003#c14003[QA-542]]__
+
+=== Group, Partition, Package, Rectangle or Card
+You can group activity together by defining:
+* group;
+* partition;
+* package;
+* rectangle;
+* card.
+
+@startuml
+start
+group Group
+ :Activity;
+end group
+floating note: Note on Group
+
+partition Partition {
+ :Activity;
+}
+floating note: Note on Partition
+
+package Package {
+ :Activity;
+}
+floating note: Note on Package
+
+rectangle Rectangle {
+ :Activity;
+}
+floating note: Note on Rectangle
+
+card Card {
+ :Activity;
+}
+floating note: Note on Card
+end
+@enduml
+
+
+
+== Swimlanes
+
+Using pipe `+|+`, you can define swimlanes.
+
+It's also possible to change swimlanes link::color[color].
+
+@startuml
+|Swimlane1|
+start
+:foo1;
+|#AntiqueWhite|Swimlane2|
+:foo2;
+:foo3;
+|Swimlane1|
+:foo4;
+|Swimlane2|
+:foo5;
+stop
+@enduml
+
+
+You can add `+if+` conditional or `+repeat+` or `+while+` loop within swimlanes.
+
+@startuml
+|#pink|Actor_For_red|
+start
+if (color?) is (red) then
+#pink:**action red**;
+:foo1;
+else (not red)
+|#lightgray|Actor_For_no_red|
+#lightgray:**action not red**;
+:foo2;
+endif
+|Next_Actor|
+#lightblue:foo3;
+:foo4;
+|Final_Actor|
+#palegreen:foo5;
+stop
+@enduml
+
+
+You can also use `+alias+` with swimlanes, with this syntax:
+* `+|[#|]| +`
+
+
+@startuml
+|#palegreen|f| fisherman
+|c| cook
+|#gold|e| eater
+|f|
+start
+:go fish;
+|c|
+:fry fish;
+|e|
+:eat fish;
+stop
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/2681/possible-define-alias-swimlane-place-alias-everywhere-else?show=2685#a2685[QA-2681]]__
+
+
+== Detach or kill [detach, kill]
+
+It's possible to remove an arrow using the `+detach+` or `+kill+` keyword:
+
+* `+detach+`
+
+
+@startuml
+ :start;
+ fork
+ :foo1;
+ :foo2;
+ fork again
+ :foo3;
+ detach
+ endfork
+ if (foo4) then
+ :foo5;
+ detach
+ endif
+ :foo6;
+ detach
+ :foo7;
+ stop
+@enduml
+
+
+* `+kill+`
+
+
+
+@startuml
+ :start;
+ fork
+ :foo1;
+ :foo2;
+ fork again
+ :foo3;
+ kill
+ endfork
+ if (foo4) then
+ :foo5;
+ kill
+ endif
+ :foo6;
+ kill
+ :foo7;
+ stop
+@enduml
+
+
+
+== SDL (Specification and Description Language)
+
+By changing the final `+;+` separator, you can set different rendering for the activity:
+* `+|+`
+* `+<+`
+* `+>+`
+* `+/+`
+* `+\\+`
+* `+]+`
+* `+}+`
+
+@startuml
+:Ready;
+:next(o)|
+:Receiving;
+split
+ :nak(i)<
+ :ack(o)>
+split again
+ :ack(i)<
+ :next(o)
+ on several lines|
+ :i := i + 1]
+ :ack(o)>
+split again
+ :err(i)<
+ :nak(o)>
+split again
+ :foo/
+split again
+ :bar\\
+split again
+ :i > 5}
+stop
+end split
+:finish;
+@enduml
+
+
+
+== Complete example
+
+
+
+@startuml
+
+start
+:ClickServlet.handleRequest();
+:new page;
+if (Page.onSecurityCheck) then (true)
+ :Page.onInit();
+ if (isForward?) then (no)
+ :Process controls;
+ if (continue processing?) then (no)
+ stop
+ endif
+
+ if (isPost?) then (yes)
+ :Page.onPost();
+ else (no)
+ :Page.onGet();
+ endif
+ :Page.onRender();
+ endif
+else (false)
+endif
+
+if (do redirect?) then (yes)
+ :redirect process;
+else
+ if (do forward?) then (yes)
+ :Forward request;
+ else (no)
+ :Render page template;
+ endif
+endif
+
+stop
+
+@enduml
+
+
+
+== Condition Style
+
+=== Inside style (by default)
+
+@startuml
+skinparam conditionStyle inside
+start
+repeat
+ :act1;
+ :act2;
+repeatwhile (end)
+:act3;
+@enduml
+
+
+@startuml
+start
+repeat
+ :act1;
+ :act2;
+repeatwhile (end)
+:act3;
+@enduml
+
+
+=== Diamond style
+
+@startuml
+skinparam conditionStyle diamond
+start
+repeat
+ :act1;
+ :act2;
+repeatwhile (end)
+:act3;
+@enduml
+
+
+
+
+=== InsideDiamond (or __Foo1__) style
+
+@startuml
+skinparam conditionStyle InsideDiamond
+start
+repeat
+ :act1;
+ :act2;
+repeatwhile (end)
+:act3;
+@enduml
+
+
+@startuml
+skinparam conditionStyle foo1
+start
+repeat
+ :act1;
+ :act2;
+repeatwhile (end)
+:act3;
+@enduml
+
+
+
+__[Ref. https://forum.plantuml.net/1290/plantuml-condition-rendering[QA-1290] and https://github.com/plantuml/plantuml/issues/400#issuecomment-721287124[#400]]__
+
+
+== Condition End Style
+
+=== Diamond style (by default)
+
+* With one branch
+
+@startuml
+skinparam ConditionEndStyle diamond
+:A;
+if (decision) then (yes)
+ :B1;
+else (no)
+endif
+:C;
+@enduml
+
+
+* With two branches (`+B1+`, `+B2+`)
+
+@startuml
+skinparam ConditionEndStyle diamond
+:A;
+if (decision) then (yes)
+ :B1;
+else (no)
+ :B2;
+endif
+:C;
+@enduml
+@enduml
+
+
+=== Horizontal line (hline) style
+* With one branch
+
+@startuml
+skinparam ConditionEndStyle hline
+:A;
+if (decision) then (yes)
+ :B1;
+else (no)
+endif
+:C;
+@enduml
+
+
+* With two branches (`+B1+`, `+B2+`)
+
+@startuml
+skinparam ConditionEndStyle hline
+:A;
+if (decision) then (yes)
+ :B1;
+else (no)
+ :B2;
+endif
+:C;
+@enduml
+@enduml
+
+
+
+__[Ref. https://forum.plantuml.net/4015/its-possible-to-draw-if-else-endif-without-merge-symbol[QA-4015]]__
+
+
+== Using (global) style
+
+=== Without style __(by default)__
+
+@startuml
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+
+
+=== With style
+
+You can use link::style-evolution[style] to change rendering of elements.
+
+
+@startuml
+
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/activity-diagram-issues.adoc b/plantuml-docs/docs_from_alphadoc/activity-diagram-issues.adoc
new file mode 100644
index 00000000..6583db40
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/activity-diagram-issues.adoc
@@ -0,0 +1,173 @@
+== Activity Diagram issues (activity-diagram-issues)
+
+This page lists issues on link::activity-diagram-beta[Activity Diagram].
+
+
+== Backward Error on swim-lanes
+
+
+@startuml
+|Swimlane1|
+start
+repeat :foo as starting label;
+ :read data;
+ :generate diagrams;
+|Swimlane2|
+backward:This is backward;
+repeat while (more data?)
+|Swimlane1|
+stop
+@enduml
+
+
+
+@startuml
+|Swimlane1|
+start
+repeat :foo as starting label;
+ :read data;
+|Swimlane2|
+ :generate diagrams;
+repeat while (more data?)
+|Swimlane1|
+stop
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/12427[QA-12427]]__
+
+'''
+
+
+@startuml
+|#AntiqueWhite|Sistem|
+|Admin|
+repeat :Generate Again;
+:Generate Foo;
+|Sistem|
+:Bar;
+backward: Do bar;
+repeat while (Is foo?) is (yes)
+->no;
+:finish foo;
+stop
+@enduml
+
+
+
+@startuml
+|Admin|
+repeat :Generate Again;
+:Generate Foo;
+|#AntiqueWhite|Sistem|
+:Bar;
+backward: Do bar;
+repeat while (Is foo?) is (yes)
+->no;
+:finish foo;
+stop
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/14473[QA-14473]]__
+
+
+== If test on swimlane
+
+
+@startuml
+|Lane 1|
+|Lane 2|
+|Lane 1|
+start
+if (sure?) then (yes)
+else (no)
+ |Lane 2|
+ :baz;
+endif
+|Lane 2|
+:foo;
+@enduml
+
+
+VS
+
+
+@startuml
+|Lane 2|
+|Lane 1|
+start
+if (sure?) then (yes)
+else (no)
+ |Lane 2|
+ :baz;
+endif
+|Lane 2|
+:foo;
+@enduml
+
+
+
+__[Ref. https://forum.plantuml.net/3689[QA-3689]]__
+
+
+== A example of `+goto+`
+
+The first example of `+goto+` is broken...
+
+
+@startuml
+title Example of QA-1626
+:foo1;
+label lab1
+:foo2;
+if (some test) then
+ :foo3;
+ goto lab1
+else
+ :foo4;
+endif
+stop
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/1626/there-refer-existing-activity-inside-activitydiagram-goto?show=2342#a2342[QA-1626]]__
+
+
+== Overlap of arrow on Switch [fixed on V1.2022.4+]
+
+
+@startuml
+switch (Long long long Long long long condition?)
+case (Long long long long long long long long long case 1)
+ :Action 1;
+case (Arrow Error\nLong long long long long long long long long case 2)
+ :Action 2;
+endswitch
+footer \nObserved on: 1.2022.3b2\n(current version: %version())
+@enduml
+
+
+or
+
+
+@startuml
+
+switch (Long long long Long long long condition?)
+case (Long long long long long long long long long case 1)
+ :Action 1;
+case (Arrow Error\nLong long long long long long long long long case 2)
+ :Action 2;
+endswitch
+footer \nObserved on: 1.2022.3b2\n(current version: %version())
+@enduml
+
+
+See:
+* https://forum.plantuml.net/14529/activity-style-allow-style-diamond-internal-label-external[QA-14529]
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/activity-diagram-legacy.adoc b/plantuml-docs/docs_from_alphadoc/activity-diagram-legacy.adoc
new file mode 100644
index 00000000..c75d7e72
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/activity-diagram-legacy.adoc
@@ -0,0 +1,367 @@
+== Activity Diagram (legacy)
+
+This is the old **Activity Diagram (legacy)** syntax, to see the new current version see: link::activity-diagram-beta[**Activity Diagram (new)**].
+
+
+== Simple Action
+
+You can use `+(*)+` for the starting point and ending point of
+the activity diagram.
+
+In some occasion, you may want to use `+(*top)+` to force the starting point to be at the top of the diagram.
+
+
+Use `+-->+` for arrows.
+
+
+@startuml
+
+(*) --> "First Action"
+"First Action" --> (*)
+
+@enduml
+
+
+
+== Label on arrows
+
+
+
+By default, an arrow starts at the last used activity.
+
+You can put a label on an arrow using brackets `+[+` and
+`+]+` just after the arrow definition.
+
+@startuml
+
+(*) --> "First Action"
+-->[You can put also labels] "Second Action"
+--> (*)
+
+@enduml
+
+
+
+== Changing arrow direction
+
+
+You can use `+->+` for horizontal arrows. It is possible to
+force arrow's direction using the following syntax:
+* `+-down->+` (default arrow)
+* `+-right->+` or `+->+`
+* `+-left->+`
+* `+-up->+`
+
+
+@startuml
+
+(*) -up-> "First Action"
+-right-> "Second Action"
+--> "Third Action"
+-left-> (*)
+
+@enduml
+
+
+
+== Branches
+
+
+You can use `+if/then/else+` keywords to define branches.
+
+
+@startuml
+(*) --> "Initialization"
+
+if "Some Test" then
+ -->[true] "Some Action"
+ --> "Another Action"
+ -right-> (*)
+else
+ ->[false] "Something else"
+ -->[Ending process] (*)
+endif
+
+@enduml
+
+
+Unfortunately, you will have to sometimes repeat the same activity in the diagram text:
+
+@startuml
+(*) --> "check input"
+If "input is verbose" then
+--> [Yes] "turn on verbosity"
+--> "run command"
+else
+--> "run command"
+Endif
+-->(*)
+@enduml
+
+
+
+== More on Branches
+
+
+By default, a branch is connected to the last defined activity, but it
+is possible to override this and to define a link with the `+if+` keywords.
+
+It is also possible to nest branches.
+
+
+@startuml
+
+(*) --> if "Some Test" then
+
+ -->[true] "action 1"
+
+ if "" then
+ -> "action 3" as a3
+ else
+ if "Other test" then
+ -left-> "action 5"
+ else
+ --> "action 6"
+ endif
+ endif
+
+else
+
+ ->[false] "action 2"
+
+endif
+
+a3 --> if "last test" then
+ --> "action 7"
+else
+ -> "action 8"
+endif
+
+@enduml
+
+
+
+== Synchronization
+
+You can use `+=== code ===+` to display synchronization bars.
+
+
+@startuml
+
+(*) --> ===B1===
+--> "Parallel Action 1"
+--> ===B2===
+
+===B1=== --> "Parallel Action 2"
+--> ===B2===
+
+--> (*)
+
+@enduml
+
+
+
+== Long action description
+
+
+When you declare activities, you can span on several lines the
+description text. You can also add `+\n+` in the description.
+
+You can also give a short code to the activity with the `+as+`
+keyword.
+This code can be used latter in the diagram description.
+
+
+@startuml
+(*) -left-> "this action
+is verylong2
+and defined on several lines
+that contains many text" as A1
+
+-up-> "Another action\n on several lines"
+
+A1 --> "Short action "
+@enduml
+
+
+
+== Notes
+
+
+You can add notes on a activity using the commands
+`+note left+`,
+`+note right+`, `+note top+` or `+note bottom+`,
+just after the description of the activity you want to note.
+
+If you want to put a note on the starting point, define the note
+at the very beginning of the diagram description.
+
+You can also have a note on several lines, using the
+`+endnote+` keywords.
+
+@startuml
+
+(*) --> "Some action"
+note right: This action has to be defined
+"Some action" --> (*)
+note left
+ This note is on
+ several lines
+end note
+
+@enduml
+
+
+
+== Partition
+
+You can define a partition using the `+partition+` keyword, and
+optionally declare a background color for your partition (Using a html
+color code or name)
+
+When you declare activities, they are automatically put in the
+last used partition.
+
+You can close the partition definition using a closing bracket `+}+`.
+
+@startuml
+
+partition Conductor {
+ (*) --> "Climbs on Platform"
+ --> === S1 ===
+ --> Bows
+}
+
+partition Audience #LightSkyBlue {
+ === S1 === --> Applauds
+}
+
+partition Conductor {
+ Bows --> === S2 ===
+ --> WavesArmes
+ Applauds --> === S2 ===
+}
+
+partition Orchestra #CCCCEE {
+ WavesArmes --> Introduction
+ --> "Play music"
+}
+
+@enduml
+
+
+
+
+== Skinparam
+
+
+You can use the link::skinparam[skinparam]
+command to change colors and fonts for the drawing.
+
+You can use this command :
+* In the diagram definition, like any other commands,
+* In an link::preprocessing[included file],
+* In a configuration file, provided in the link::command-line[command line] or the link::ant-task[ANT task].
+You can define specific color and fonts for stereotyped activities.
+
+
+@startuml
+
+skinparam backgroundColor #AAFFFF
+skinparam activity {
+ StartColor red
+ BarColor SaddleBrown
+ EndColor Silver
+ BackgroundColor Peru
+ BackgroundColor<< Begin >> Olive
+ BorderColor Peru
+ FontName Impact
+}
+
+(*) --> "Climbs on Platform" << Begin >>
+--> === S1 ===
+--> Bows
+--> === S2 ===
+--> WavesArmes
+--> (*)
+
+@enduml
+
+
+
+
+== Octagon
+
+You can change the shape of activities to octagon using the `+skinparam activityShape octagon+`
+command.
+
+@startuml
+'Default is skinparam activityShape roundBox
+skinparam activityShape octagon
+
+(*) --> "First Action"
+"First Action" --> (*)
+
+@enduml
+
+
+
+== Complete example
+
+
+
+@startuml
+title Servlet Container
+
+(*) --> "ClickServlet.handleRequest()"
+--> "new Page"
+
+if "Page.onSecurityCheck" then
+ ->[true] "Page.onInit()"
+
+ if "isForward?" then
+ ->[no] "Process controls"
+
+ if "continue processing?" then
+ -->[yes] ===RENDERING===
+ else
+ -->[no] ===REDIRECT_CHECK===
+ endif
+
+ else
+ -->[yes] ===RENDERING===
+ endif
+
+ if "is Post?" then
+ -->[yes] "Page.onPost()"
+ --> "Page.onRender()" as render
+ --> ===REDIRECT_CHECK===
+ else
+ -->[no] "Page.onGet()"
+ --> render
+ endif
+
+else
+ -->[false] ===REDIRECT_CHECK===
+endif
+
+if "Do redirect?" then
+ ->[yes] "redirect request"
+ --> ==BEFORE_DESTROY===
+else
+ if "Do Forward?" then
+ -left->[yes] "Forward request"
+ --> ==BEFORE_DESTROY===
+ else
+ -right->[no] "Render page template"
+ --> ==BEFORE_DESTROY===
+ endif
+endif
+
+--> "Page.onDestroy()"
+-->(*)
+
+@enduml
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/ant-task.adoc b/plantuml-docs/docs_from_alphadoc/ant-task.adoc
new file mode 100644
index 00000000..8e996c93
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/ant-task.adoc
@@ -0,0 +1,141 @@
+== Writing an Ant Task
+You must have something like this into your https://en.wikipedia.org/wiki/Apache_Ant[**Ant**] `+build.xml+` file:
+
+----
+
+
+
+
+
+
+
+
+
+----
+
+
+The https://en.wikipedia.org/wiki/Apache_Ant[**Ant**] task processes all **.c**, **.h**, **.cpp**, **.tex**, **.html**, **.htm** or **.java** of the provided directory (`+./src+` in this example). It looks for `+@startXYZ+` and generates `+.png+` images.
+
+
+== Output Directory
+You can also specify a output directory for all generated images, using
+`+output+` tag.
+----
+
+
+
+
+----
+
+
+
+== Recurse through directories
+
+You can also use **Ant** standard http://www.163jsp.com/help/antman1.7.1/CoreTypes/fileset.html[fileset]
+or http://www.163jsp.com/help/antman1.7.1/CoreTypes/filelist.html[filelist].
+
+For example, if you want to process all java file in `+c:/src+` and subdirectories, (except files ending by `+Test.java+`), and generate images into `+d:/images+`, you can use:
+----
+
+
+
+
+
+
+
+
+----
+
+
+== SVG or EPS Support
+
+
+You can also use `+format="svg"+` or `+format="eps"+` in the **Ant** task definition.
+----
+
+
+
+----
+
+
+== Configuration file
+
+
+You can also provide a configuration file which will be included before each diagram.
+
+----
+
+
+
+----
+
+
+
+== Other parameters
+
+|===
+| Parameter | Default | Description
+
+| nbthread
+| 1
+| Number of thread for processing
+
+| graphvizDot
+|
+| Path of the dot executable
+
+| format
+| png
+| Format for image generation: xmi, xmi:argo, xmi:start, eps, svg, txt, utxt
+
+| verbose
+| `+false+`
+| `+true+` for more logs
+
+| config
+|
+| File config to include before all diagrams
+
+| charset
+|
+| Charset to use when reading files
+
+| output
+|
+| Output directory for generated images
+
+| dir
+|
+| Input directory to process (You can use `+/+` instead)
+
+| failonerror
+| `+false+`
+| `+true+` to fail the build if some syntax error occurs
+
+| checkonly
+| `+false+`
+| `+true+` if you want to only check the syntax of files without generating images
+
+| overwrite
+| `+false+`
+| `+true+` if you want overwrite read-only files
+
+| enablestats
+| `+false+`
+| `+true+` to enable statistics
+
+| htmlstats
+| `+false+`
+| `+true+` to output general statistics in file plantuml-stats.html
+
+| xmlstats
+| `+false+`
+| `+true+` to output general statistics in file plantuml-stats.xml
+
+| realtimestats
+| `+false+`
+| `+true+` to generate statistics on the fly rather than at the end
+
+|===
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/api.adoc b/plantuml-docs/docs_from_alphadoc/api.adoc
new file mode 100644
index 00000000..cc4fb395
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/api.adoc
@@ -0,0 +1,58 @@
+== Calling PlantUML from Java
+You can easily integrate **PlantUML** with your own code by adding __plantuml.jar__ in your classpath.
+
+
+
+== PNG generation from a String
+If your diagram description is stored in a `+String+`, you can use the `+SourceStringReader+` class to generate some PNG file.
+
+----
+import net.sourceforge.plantuml.SourceStringReader;
+OutputStream png = ...;
+String source = "@startuml\n";
+source += "Bob -> Alice : hello\n";
+source += "@enduml\n";
+
+SourceStringReader reader = new SourceStringReader(source);
+// Write the first image to "png"
+String desc = reader.outputImage(png).getDescription();
+// Return a null string if no generation
+----
+
+
+== PNG generation from a File
+
+If your diagram description is stored in a `+File+`, you can use the `+SourceFileReader+` class to generate some PNG file.
+
+----
+File source = ...;
+SourceFileReader reader = new SourceFileReader(source);
+List list = reader.getGeneratedImages();
+// Generated files
+File png = list.get(0).getPngFile();
+----
+
+
+
+== SVG generation from a String
+
+If your diagram description is stored in a `+String+`, you can use the `+SourceStringReader+` class to generate some SVG file.
+
+----
+String source = "@startuml\n";
+source += "Bob -> Alice : hello\n";
+source += "@enduml\n";
+
+SourceStringReader reader = new SourceStringReader(source);
+final ByteArrayOutputStream os = new ByteArrayOutputStream();
+// Write the first image to "os"
+String desc = reader.generateImage(os, new FileFormatOption(FileFormat.SVG));
+os.close();
+
+// The XML is stored into svg
+final String svg = new String(os.toByteArray(), Charset.forName("UTF-8"));
+----
+
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/archimate-diagram.adoc b/plantuml-docs/docs_from_alphadoc/archimate-diagram.adoc
new file mode 100644
index 00000000..f6c9d434
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/archimate-diagram.adoc
@@ -0,0 +1,309 @@
+== Archimate Diagram
+
++++This is only a proposal and subject to change+++.
+
+You are very welcome http://forum.plantuml.net[to create a new discussion] on this future syntax. Your feedbacks, ideas and suggestions help us to find the right solution.
+
+
+
+== Archimate keyword
+
+You can use the `+archimate+` keyword to define an element. Stereotype can optionally specify an additional icon. Some colors (`+Business+`, `+Application+`, `+Motivation+`, `+Strategy+`, `+Technology+`, `+Physical+`, `+Implementation+`) are also available.
+
+
+@startuml
+archimate #Technology "VPN Server" as vpnServerA <>
+
+rectangle GO #lightgreen
+rectangle STOP #red
+rectangle WAIT #orange
+@enduml
+
+
+
+
+== Defining Junctions
+
+Using the `+circle+` keyword and the link::preprocessing[preprocessor], you can also create junctions.
+
+
+@startuml
+!define Junction_Or circle #black
+!define Junction_And circle #whitesmoke
+
+Junction_And JunctionAnd
+Junction_Or JunctionOr
+
+archimate #Technology "VPN Server" as vpnServerA <>
+
+rectangle GO #lightgreen
+rectangle STOP #red
+rectangle WAIT #orange
+GO -up-> JunctionOr
+STOP -up-> JunctionOr
+STOP -down-> JunctionAnd
+WAIT -down-> JunctionAnd
+@enduml
+
+
+
+
+== Example 1
+
+
+
+skinparam rectangle<> {
+ roundCorner 25
+}
+sprite $bProcess jar:archimate/business-process
+sprite $aService jar:archimate/application-service
+sprite $aComponent jar:archimate/application-component
+
+rectangle "Handle claim" as HC <<$bProcess>><> #Business
+rectangle "Capture Information" as CI <<$bProcess>><> #Business
+rectangle "Notify\nAdditional Stakeholders" as NAS <<$bProcess>><> #Business
+rectangle "Validate" as V <<$bProcess>><> #Business
+rectangle "Investigate" as I <<$bProcess>><> #Business
+rectangle "Pay" as P <<$bProcess>><> #Business
+
+HC *-down- CI
+HC *-down- NAS
+HC *-down- V
+HC *-down- I
+HC *-down- P
+
+CI -right->> NAS
+NAS -right->> V
+V -right->> I
+I -right->> P
+
+rectangle "Scanning" as scanning <<$aService>><> #Application
+rectangle "Customer admnistration" as customerAdministration <<$aService>><> #Application
+rectangle "Claims admnistration" as claimsAdministration <<$aService>><> #Application
+rectangle Printing <<$aService>><> #Application
+rectangle Payment <<$aService>><> #Application
+
+scanning -up-> CI
+customerAdministration -up-> CI
+claimsAdministration -up-> NAS
+claimsAdministration -up-> V
+claimsAdministration -up-> I
+Payment -up-> P
+
+Printing -up-> V
+Printing -up-> P
+
+rectangle "Document\nManagement\nSystem" as DMS <<$aComponent>> #Application
+rectangle "General\nCRM\nSystem" as CRM <<$aComponent>> #Application
+rectangle "Home & Away\nPolicy\nAdministration" as HAPA <<$aComponent>> #Application
+rectangle "Home & Away\nFinancial\nAdministration" as HFPA <<$aComponent>> #Application
+
+DMS .up.|> scanning
+DMS .up.|> Printing
+CRM .up.|> customerAdministration
+HAPA .up.|> claimsAdministration
+HFPA .up.|> Payment
+
+legend left
+Example from the "Archisurance case study" (OpenGroup).
+See
+====
+<$bProcess> :business process
+====
+<$aService> : application service
+====
+<$aComponent> : application component
+endlegend
+
+
+
+== Example 2
+
+
+skinparam roundcorner 25
+rectangle "Capture Information" as CI <<$archimate/business-process>> #Business
+
+
+
+== List possible sprites
+
+You can list all possible sprites for Archimate using the following diagram:
+
+
+@startuml
+listsprite
+@enduml
+
+
+
+
+== ArchiMate Macros
+
+=== Archimate Macros and Library
+
+A list of Archimate macros are defined https://github.com/ebbypeter/Archimate-PlantUML[Archimate-PlantUML] here which simplifies the creation of ArchiMate diagrams, and Archimate is natively on the link::stdlib[Standard Library] of PlantUML.
+
+=== Archimate elements
+Using the macros, creation of ArchiMate elements are done using the following format:
+`+Category_ElementName(nameOfTheElement, "description")+`
+
+For example:
+* To define a __Stakeholder__ element, which is part of Motivation category, the syntax will be `+Motivation_Stakeholder(StakeholderElement, "Stakeholder Description")+`:
+
+@startuml
+!include
+Motivation_Stakeholder(StakeholderElement, "Stakeholder Description")
+@enduml
+
+
+
+* To define a __Business Service__ element, `+Business_Service(BService, "Business Service")+`:
+
+@startuml
+!include
+Business_Service(BService, "Business Service")
+@enduml
+
+
+=== Archimate relationships
+The ArchiMate relationships are defined with the following pattern:
+`+Rel_RelationType(fromElement, toElement, "description")+`
+and to define the direction/orientation of the two elements:
+`+Rel_RelationType_Direction(fromElement, toElement, "description")+`
+
+The `+RelationTypes+` supported are:
+* Access
+* Aggregation
+* Assignment
+* Association
+* Composition
+* Flow
+* Influence
+* Realization
+* Serving
+* Specialization
+* Triggering
+
+The `+Directions+` supported are:
+* Up
+* Down
+* Left
+* Right
+
+For example:
+* To denote a composition relationship between the __Stakeholder__ and __Business Service__ defined above, the syntax will be
+`+Rel_Composition(StakeholderElement, BService, "Description for the relationship")+`
+
+@startuml
+!include
+Motivation_Stakeholder(StakeholderElement, "Stakeholder Description")
+Business_Service(BService, "Business Service")
+Rel_Composition(StakeholderElement, BService, "Description for the relationship")
+@enduml
+
+* Unordered List ItemTo orient the two elements in top - down position, the syntax will be
+`+Rel_Composition_Down(StakeholderElement, BService, "Description for the relationship")+`
+
+@startuml
+!include
+Motivation_Stakeholder(StakeholderElement, "Stakeholder Description")
+Business_Service(BService, "Business Service")
+Rel_Composition_Down(StakeholderElement, BService, "Description for the relationship")
+@enduml
+
+
+=== Appendice: Examples of all Archimate RelationTypes
+
+@startuml
+left to right direction
+skinparam nodesep 4
+!include
+Rel_Triggering(i15, j15, Triggering)
+Rel_Specialization(i14, j14, Specialization)
+Rel_Serving(i13, j13, Serving)
+Rel_Realization(i12, j12, Realization)
+Rel_Influence(i11, j11, Influence)
+Rel_Flow(i10, j10, Flow)
+Rel_Composition(i9, j9, Composition)
+Rel_Association_dir(i8, j8, Association_dir)
+Rel_Association(i7, j7, Association)
+Rel_Assignment(i6, j6, Assignment)
+Rel_Aggregation(i5, j5, Aggregation)
+Rel_Access_w(i4, j4, Access_w)
+Rel_Access_rw(i3, j3, Access_rw)
+Rel_Access_r(i2, j2, Access_r)
+Rel_Access(i1, j1, Access)
+@enduml
+
+
+
+@startuml
+title ArchiMate Relationships Overview
+skinparam nodesep 5
+
+!include
+left to right direction
+
+rectangle Other {
+() i14
+() j14
+}
+
+
+rectangle Dynamic {
+() i10
+() j10
+() i15
+() j15
+}
+
+rectangle Dependency {
+() i13
+() j13
+() i4
+() j4
+() i11
+() j11
+() i7
+() j7
+}
+
+rectangle Structural {
+() i9
+() j9
+() i5
+() j5
+() i6
+() j6
+() i12
+() j12
+}
+
+Rel_Triggering(i15, j15, Triggering)
+Rel_Specialization(i14, j14, Specialization)
+Rel_Serving(i13, j13, Serving)
+Rel_Realization(i12, j12, Realization)
+Rel_Influence(i11, j11, Influence)
+Rel_Flow(i10, j10, Flow)
+Rel_Composition(i9, j9, Composition)
+Rel_Association_dir(i7, j7, \nAssociation_dir)
+Rel_Association(i7, j7, Association)
+Rel_Assignment(i6, j6, Assignment)
+Rel_Aggregation(i5, j5, Aggregation)
+Rel_Access_w(i4, j4, Access_w)
+Rel_Access_rw(i4, j4, Access_rw)
+Rel_Access_r(i4, j4, Access_r)
+Rel_Access(i4, j4, Access)
+@enduml
+
+
+__[Adapted from https://github.com/plantuml-stdlib/Archimate-PlantUML/pull/25[Archimate PR#25]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/ascii-art.adoc b/plantuml-docs/docs_from_alphadoc/ascii-art.adoc
new file mode 100644
index 00000000..572cdb38
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/ascii-art.adoc
@@ -0,0 +1,333 @@
+== ASCII Art
+
+It is possible to generate link::sequence-diagram[Sequence Diagrams] using http://en.wikipedia.org/wiki/ASCII_art[ASCII art].
+
+----
+@startuml
+participant Bob
+actor Alice
+
+Bob -> Alice : hello
+Alice -> Bob : Is it ok?
+@enduml
+----
+
+You have to use the `+-txt+` flag in the command line, or the `+format+` tag in the link::ant-task[Ant task] :
+
+----
+
+
+
+----
+
+Generated files use .atxt extension. (__"a" as ASCII art : to NOT overide any existing .txt files!__).
+Here is the result:
+
+----
+ ,-.
+ `-'
+ /|\
+ ,---. |
+ |Bob| / \
+ `-+-' Alice
+ | hello |
+ |-------------->|
+ | |
+ | Is it ok? |
+ |<- - - - - - - |
+ ,-+-. Alice
+ |Bob| ,-.
+ `---' `-'
+ /|\
+ |
+ / \
+----
+You can control the maximum number of characters between participants by using `+skinparam maxAsciiMessageLength+`. This can be helpful if you need to limit the width of your ASCII Art.
+
+For example:
+----
+@startuml
+skinparam maxAsciiMessageLength 8
+participant Bob
+actor Alice
+
+Bob -> Alice : hello
+Alice -> Bob : Is it ok?
+@enduml
+----
+
+Will look like:
+----
+ ,-.
+ `-'
+ /|\
+ ,---. |
+ |Bob| / \
+ `-+-' Alice
+ |hello |
+ |------>|
+ | |
+ Is it ok?
+ |<------|
+ ,-+-. Alice
+ |Bob| ,-.
+ `---' `-'
+ /|\
+ |
+ / \
+----
+
+
+== Unicode
+
+The default `+txt+` format uses only plain ASCII characters. It is possible to use few extended Unicode characters to have a slightly better result. You should use the `+-utxt+` flag in the command line, or the `+utxt+` format in the link::ant-task[Ant task].
+
+----
+ โโโ
+ โ"โ
+ โโฌโ
+ โโผโ
+ โโโโโ โ
+ โBobโ โโดโ
+ โโโฌโโ Alice
+ โ hello โ
+ โโโโโโโโโโโโโโโ>โ
+ โ โ
+ โ Is it ok? โ
+ โ<โ โ โ โ โ โ โ โ
+ โโโดโโ Alice
+ โBobโ โโโ
+ โโโโโ โ"โ
+ โโฌโ
+ โโผโ
+ โ
+ โโดโ
+----
+
+They are two drawbacks of using utxt:
+
+* The result is UTF-8 encoded, and sometimes this is an issue (mail gateway, editors...)
+* The used font must have the used extended characters (like Courier, Courier New...)
+
+
+== Complex Diagram
+
+You can even try complex example if you wish.
+
+----
+@startuml
+'hide footbox
+
+participant "Bob on\nseveral lines" as Bob
+actor Alice
+
+Bob -> Alice : hello
+note right of Alice
+ this is a note
+end note
+
+Alice -> Bob : Is it ok\nwith a message that is\non several lines?
+
+note right
+ This other note
+ should work
+ on several lines
+end note
+
+== This is a separation ==
+
+Bob -> Last : Yes it works!
+Last -> Last : working in progress
+note left : this is\nanother note
+
+Last --> Last : working in progress
+
+Last --> Bob : done
+
+opt dummy comment
+ Bob -> Last : Error\nOn\nSeveral\nLine
+ Last --> Bob : None
+else
+ Last --> Bob : None
+ Last -> Bob : None
+else other
+ Last -> Bob : None
+ note over Alice, Last
+ This is a long note
+ over Alice and Last
+ end note
+ Last -> Bob : None
+ Last -> Bob : None
+end
+@enduml
+----
+
+
+
+== Result
+
+----
+ ,-.
+ `-'
+ ,-------------. /|\
+ |Bob on | | ,----.
+ |several lines| / \ |Last|
+ `------+------' Alice `-+--'
+ | hello | |
+ |---------------------->| |
+ | | |
+ | | ,--------------!.
+ | | |this is a note|_\
+ | | `----------------'
+ |Is it ok | ,----------------!.
+ |with a message that is | |This other note |_\
+ |on several lines? | |should work |
+ |<----------------------| |on several lines |
+ | | `------------------'
+ | | |
+ | ======================== |
+====================================== This is a separation =======================================
+ | ======================== |
+ | | |
+ | Yes it works! |
+ |-------------------------------------->|
+ | | |
+ | ,------------!. |----.
+ | |this is |_\| | working in progress
+ | |another note ||<---'
+ | `--------------'|
+ | | |- - .
+ | | | | working in progress
+ | | |< - '
+ | | |
+ | done | |
+ |<- - - - - - - - - - - - - - - - - - - |
+ | | |
+ ______________________________________________________________________
+ ! OPT / dummy comment | | !
+ !_____/ | | | !
+ ! | | | !
+ ! | Error | | !
+ ! | On | | !
+ ! | Several | | !
+ ! | Line | | !
+ ! |-------------------------------------->| !
+ ! | | | !
+ ! | None | | !
+ ! |<- - - - - - - - - - - - - - - - - - - | !
+ !~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~!
+ ! | | | !
+ ! | None | | !
+ ! |<- - - - - - - - - - - - - - - - - - - | !
+ ! | | | !
+ ! | None | | !
+ ! |<--------------------------------------| !
+ !~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~!
+ ! [other] | | | !
+ ! | None | | !
+ ! |<--------------------------------------| !
+ ! | | | !
+ ! | ,-------------------!. !
+ ! | |This is a long note|_\ !
+ ! | |over Alice and Last | !
+ ! | `---------------------' !
+ ! | None | | !
+ ! |<--------------------------------------| !
+ ! | | | !
+ ! | None | | !
+ ! |<--------------------------------------| !
+ !~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~!
+ ,------+------. Alice ,-+--.
+ |Bob on | ,-. |Last|
+ |several lines| `-' `----'
+ `-------------' /|\
+ |
+ / \
+----
+
+
+
+== Same example using Unicode
+
+----
+ โโโ
+ โ"โ
+ โโฌโ
+ โโโโโโโโโโโโโโโ โโผโ
+ โBob on โ โ โโโโโโ
+ โseveral linesโ โโดโ โLastโ
+ โโโโโโโโฌโโโโโโโ Alice โโโฌโโโ
+ โ hello โ โ
+ โโโโโโโโโโโโโโโโโโโโโโโ>โ โ
+ โ โ โ
+ โ โ โโโโโโโโโโโโโโโงโโโ
+ โ โ โthis is a note โโ
+ โ โ โโโโโโโโโโโโโโโคโโโ
+ โIs it ok โ โโโโโโโโโโโโโโโงโโโโโ
+ โwith a message that is โ โThis other note โโ
+ โon several lines? โ โshould work โ
+ โ<โโโโโโโโโโโโโโโโโโโโโโโ โon several lines โ
+ โ โ โโโโโโโโโโโโโโโคโโโโโ
+ โ โ โ
+ โ โโโโโโโโโโงโโโโโโโโโโโโโโ โ
+โโโโโโโโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโฃ This is a separation โ โโชโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ
+ โ โโโโโโโโโโคโโโโโโโโโโโโโโ โ
+ โ โ โ
+ โ Yes it works! โ
+ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ>โ
+ โ โ โ
+ โ โโโโโโโโโโโโโโโโโโโโโโ
+ โ โthis is โโโ โ working in progress
+ โ โanother note โโ<โโโโ
+ โ โโโโโโโโโโโโโโโโโ
+ โ โ โโ โ โ
+ โ โ โ | working in progress
+ โ โ โ< โ โ
+ โ โ โ
+ โ done โ โ
+ โ<โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ
+ โ โ โ
+ โโโโโโโโคโโโโโโโโโโชโโโโโโโโโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโ
+ โ OPT โ dummy comment โ โ โ
+ โโโโโโโโ โ โ โ โ
+ โ โ โ โ โ
+ โ โ Error โ โ โ
+ โ โ On โ โ โ
+ โ โ Several โ โ โ
+ โ โ Line โ โ โ
+ โ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ>โ โ
+ โ โ โ โ โ
+ โ โ None โ โ โ
+ โ โ<โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ
+ โ โโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโฃ
+ โ โ โ โ โ
+ โ โ None โ โ โ
+ โ โ<โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ
+ โ โ โ โ โ
+ โ โ None โ โ โ
+ โ โ<โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ
+ โ โโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโฃ
+ โ [other] โ โ โ โ
+ โ โ None โ โ โ
+ โ โ<โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ
+ โ โ โ โ โ
+ โ โ โโโโงโโโโโโโโโโโโโโโโงโโโ โ
+ โ โ โThis is a long note โโ โ
+ โ โ โover Alice and Last โ โ
+ โ โ โโโโคโโโโโโโโโโโโโโโโคโโโ โ
+ โ โ None โ โ โ
+ โ โ<โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ
+ โ โ โ โ โ
+ โ โ None โ โ โ
+ โ โ<โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ
+ โโโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโ
+ โโโโโโโโดโโโโโโโ Alice โโโดโโโ
+ โBob on โ โโโ โLastโ
+ โseveral linesโ โ"โ โโโโโโ
+ โโโโโโโโโโโโโโโ โโฌโ
+ โโผโ
+ โ
+ โโดโ
+----
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/ascii-math.adoc b/plantuml-docs/docs_from_alphadoc/ascii-math.adoc
new file mode 100644
index 00000000..320629a7
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/ascii-math.adoc
@@ -0,0 +1,71 @@
+== Maths
+
+Within PlantUML, you can use http://asciimath.org[AsciiMath] notation:
+
+@startuml
+:;
+:;
+note right
+Try also
+
+
+end note
+@enduml
+
+
+or https://github.com/opencollab/jlatexmath[JLaTeXMath] notation:
+
+@startuml
+:\int_0^1f(x)dx;
+:x^2+y_1+z_{12}^{34};
+note right
+Try also
+\dfrac{d}{dx}f(x)=\lim\limits_{h \to 0}\dfrac{f(x+h)-f(x)}{h}
+P(y|\mathbf{x}) \mbox{ or } f(\mathbf{x})+\epsilon
+end note
+@enduml
+
+
+Here is another example:
+
+@startuml
+Bob -> Alice : Can you solve:
+Alice --> Bob:
+@enduml
+
+
+
+== Standalone diagram
+
+You can also use `+@startmath+`/`+@endmath+` to create standalone http://asciimath.org[AsciiMath] formula.
+
+
+
+@startmath
+f(t)=(a_0)/2 + sum_(n=1)^ooa_ncos((npit)/L)+sum_(n=1)^oo b_n\ sin((npit)/L)
+@endmath
+
+
+
+Or use `+@startlatex+`/`+@endlatex+` to create standalone https://github.com/opencollab/jlatexmath[JLaTeXMath] formula.
+
+
+@startlatex
+\sum_{i=0}^{n-1} (a_i + b_i^2)
+@endlatex
+
+
+
+== How is this working?
+
+To draw those formulas, PlantUML uses two open source projects:
+
+* https://github.com/asciimath/asciimathml/tree/master/asciimath-based[AsciiMath] that converts AsciiMath notation to LaTeX expression;
+* https://github.com/opencollab/jlatexmath[JLatexMath] that displays mathematical formulas written in LaTeX. JLaTeXMath is the best Java library to display LaTeX code.
+
+https://github.com/asciimath/asciimathml/blob/master/asciimath-based/ASCIIMathTeXImg.js[ASCIIMathTeXImg.js] is small enough to be integrated into PlantUML standard distribution.
+
+
+Since https://github.com/opencollab/jlatexmath[JLatexMath] is bigger, you have to http://beta.plantuml.net/plantuml-jlatexmath.zip[download it] separately, then unzip the 4 jar files (__batik-all-1.7.jar__, __jlatexmath-minimal-1.0.3.jar__, __jlm\_cyrillic.jar__ and __jlm\_greek.jar__) in the same folder as PlantUML.jar.
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/board-diagram.adoc b/plantuml-docs/docs_from_alphadoc/board-diagram.adoc
new file mode 100644
index 00000000..9f44b8b7
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/board-diagram.adoc
@@ -0,0 +1,43 @@
+== Board diagram
+
+https://github.com/plantuml/plantuml/issues/423[Incubation of board diagram]
+
+
+== Basic component
+
+
+@startboard
+A1
++U1.1
+++S1 R1
+++S1 R2
++U1.2
+A2
+@endboard
+
+
+
+@startboard
+Activity 1
++User Task 1a
+++Story 1 Release 1
+++Story 2 Release 1
++User Task 1b
+++Story 3 Release 1
++++Story 4 Release 1
+++++Story 5 Release 2
+
+Activity 2
++User Task 2
++++Story 6 Release 1
++++Story 7 Release 1
++++Story 8 Release 2
+Activity 3
+
++User Task 3
+++++Story 9 Release 2
+++++Story 10 Release 3
+@endboard
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/bpmn.adoc b/plantuml-docs/docs_from_alphadoc/bpmn.adoc
new file mode 100644
index 00000000..3336a042
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/bpmn.adoc
@@ -0,0 +1,124 @@
+== Business Process Model and Notation (BPMN)
+
+This is preliminary works to add https://en.wikipedia.org/wiki/Business_Process_Model_and_Notation[BPMN] support in PlantUML.
+
+Right now, some quick stuff have been done.
+
+The implementation is based on ideas developped in:
+* http://wiki.plantuml.net/_media/site/kitzmann2009a.pdf[kitzmann2009a.pdf]
+* https://www.researchgate.net/publication/221542866_A_Simple_Algorithm_for_Automatic_Layout_of_BPMN_Processes[A Simple Algorithm for Automatic Layout of BPMN Processes]
+
+
+__[Ref. http://wiki.plantuml.net/site/bpmn[Wiki-BPMN]]__
+
+
+== Final examples
+
+
+@startbpm
+:login;
+20:<+>
+:show new message1;
+30:<+>
+resume 20
+:show new task2;
+@endbpm
+
+
+
+__[Ref. https://forum.plantuml.net/5647[QA-5647]]__
+
+
+@startbpm
+:login;
+new branch
+:show new message1;
+else
+:show new task2;
+end branch
+new branch
+:Accept Task;
+else
+:nothing;
+else
+new branch
+:read message;
+else
+:dummy;
+end branch
+end branch
+:logout;
+@endbpm
+
+
+__[Ref. http://wiki.plantuml.net/site/bpmn[Wiki-bpmn]]__
+
+
+== Existing diagrams
+
+Please put here pointer existing diagrams that you'd like to have supported in PlantUML.
+
+https://www.tim-zoeller.de/Basics-1.png[Basic processes with User Task, Service Task, Exclusive Gateways, and Parallel Gateways]
+
+Start with simple examples!
+
+This http://www.bpmb.de/images/BPMN2_0_Poster_EN.pdf[PDF] gives a good overview of the BPMN2.0 syntax.
+It basically boils down to boxes, circles and lines plus swimlanes.
+So it is close to an activity diagram.
+
+All shapes can be "decorated" with symbols.
+These add some more detail, but are not necessary to get an overview of the process.
+This fact should be reflected in the syntax - it should first let you design the process and then add the details.
+
+
+== Syntax
+The proposed syntax is probably not very clear.
+
+Here we have to talk about it and propose a better one.
+
+There are rules for good diagrams which might make the syntax easier to create.
+One of these rules is that when you split the process- (token-) flow, it will be merged back together with the same symbol.
+[comment: This is not neccessarily true. It is allowed to merge the flows with a different gateway, again or without any gateway at all. Also, the flows don't need to be merged]
+
+There is also the feature of "closed" swim-lanes - swim-lanes where the content is not shown because the detailed process is not known or you want to focus on other parts of the diagram.
+It should be reflected by the syntax that a swim-lane can be opened and closed with just a switch.
+
+
+
+== Example1
+image::bpm01.png[]
+----
+@startbpm
+XXXX
+@endbpm
+----
+
+
+
+== Example2
+image::bpm02.png[]
+----
+@startbpm
+XXXX
+@endbpm
+----
+
+
+
+== Example3
+image::bpm03.png[]
+----
+@startbpm
+XXXX
+@endbpm
+----
+
+
+
+== Other theorical works
+
+The following https://github.com/MarvinLudwig/bpmn_layouter[BPMN Layouter project ] may be interesting.
+link::jjc-mt.pdf[jjc-mt.pdf]
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/class-diagram-issues.adoc b/plantuml-docs/docs_from_alphadoc/class-diagram-issues.adoc
new file mode 100644
index 00000000..d09477b2
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/class-diagram-issues.adoc
@@ -0,0 +1,182 @@
+== Class Diagram issues (class-diagram-issues)
+
+This page lists issues on link::class-diagram[Class Diagram].
+
+
+== Wanted features
+
+* https://forum.plantuml.net/13773/style-the-methods-section-of-a-class-diagram[QA-13773/style-the-methods-section-of-a-class-diagram]
+
+Adding, on inline style:
+* fields
+* methods
+
++ on [beta-]style
+
+Proposal syntax:
+----
+@startuml
+class Demo1 #back:lightgreen|yellow;header:blue/red;methods:red\green;fields:pink
+@enduml
+----
+
+
+== Arrow head Groupinheritance bug
+
+* https://forum.plantuml.net/13532/groupinheritance-bug[QA-13532]
+
+@startuml
+skinparam groupInheritance 3
+
+class A1
+
+A1 <|-- B1
+
+A2 <|-- B2
+A2 <|-- C2
+
+A3 <|-- B3
+A3 <|-- C3
+A3 <|-- D3
+
+A4 <|-- B4
+A4 <|-- C4
+A4 <|-- D4
+
+E4 --|> A4 #blue
+E6 --|> A4 #blue
+E5 --|> A4 #blue
+@enduml
+
+
+Same on element:
+
+@startuml
+skinparam groupInheritance 3
+
+card A1
+
+A1 <|-- B1
+
+A2 <|-- B2
+A2 <|-- C2
+
+A3 <|-- B3 #blue
+A3 <|-- C3 #blue
+A3 <|-- D3 #blue
+
+A4 <|-- B4 #blue
+A4 <|-- C4 #blue
+A4 <|-- D4 #blue
+
+E4 --|> A4
+E6 --|> A4
+E5 --|> A4
+@enduml
+
+
+
+== Another similar groupInheritance issue
+
+* https://github.com/plantuml/plantuml/issues/729[GH-729]
+
+
+@startuml
+skinparam groupInheritance 2
+
+Parent <|-- Child1
+Parent <|-- Child2
+Composed --* Parent #blue
+Aggregated --o Parent #blue
+Arrow --> Parent #blue
+@enduml
+
+
+
+@startuml
+skinparam groupInheritance 3
+
+Parent <|-- Child1
+Parent <|-- Child2
+Composed --* Parent
+Aggregated --o Parent
+Arrow --> Parent
+@enduml
+
+
+
+== Line thickness issue (from ~V1.2022.2) [fixed on 1.2022.6betaX]
+
+
+@startuml
+title Bracketed line thickness
+class foo
+class bar
+bar1 : [thickness=1]
+bar2 : [thickness=2]
+bar3 : [thickness=4]
+bar4 : [thickness=8]
+bar5 : [thickness=16]
+
+foo --> bar : โ
+foo -[thickness=1]-> bar1 : [1]
+foo -[thickness=2]-> bar2 : [2]
+foo -[thickness=4]-> bar3 : [4]
+foo -[thickness=8]-> bar4 : [8]
+foo -[thickness=16]-> bar5 : [16]
+
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/4949[QA-4949]]__
+
+
+== Error on Change class color and style (inline style) [fixed on 1.2022.6betaX]
+
+โ โผโ +++Appeared from version v1.2022.2+++++ [fixed on 1.2022.6betaX]
+
+* Error on `+##[style]color+`: error on style
+
+
+@startuml
+abstract abstract
+annotation annotation ##[bold]red
+note bottom: Why not bold?
+class class ##[dashed]green
+note bottom: Why not dashed?
+interface interface ##[dotted]blue
+note bottom: Why not dotted?
+
+@enduml
+
+
+
+
+* `+#[color|back:color];header:color;line:color;line.[bold|dashed|dotted];text:color+`
+
+
+@startuml
+abstract abstract
+annotation annotation #line:red;line.bold;text:red
+note bottom: Why not bold?
+class class #line:green;line.dashed;text:green
+note bottom: Why not dashed?
+interface interface #line:blue;line.dotted;text:blue
+note bottom: Why not dotted?
+@enduml
+
+
+First original example:
+
+@startuml
+class bar #line:green;back:lightblue
+class bar2 #lightblue;line:green
+
+class Foo1 #back:red;line:00FFFF
+class FooDashed #line.dashed:blue
+class FooDotted #line.dotted:blue
+class FooBold #line.bold
+@enduml
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/class-diagram.adoc b/plantuml-docs/docs_from_alphadoc/class-diagram.adoc
new file mode 100644
index 00000000..362999a1
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/class-diagram.adoc
@@ -0,0 +1,1626 @@
+== Class Diagram
+
+
+
+== Declaring element
+
+
+@startuml
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+exception exception
+interface interface
+metaclass metaclass
+protocol protocol
+stereotype stereotype
+struct struct
+@enduml
+
+
+__[Ref. for `+protocol+` and `+struct+`: https://github.com/plantuml/plantuml/pull/1028[GH-1028], for `+exception+`: https://forum.plantuml.net/16258/adding-exception-keyword-for-class-diagram[QA-16258]]__
+
+
+== Relations between classes
+
+Relations between classes are defined using the following symbols :
+
+|===
+| Type | Symbol | Drawing
+
+| Extension
+| `+<|--+`
+| image::extends01.png[]
+
+| Composition
+| `+*--+`
+| image::sym03.png[]
+
+| Aggregation
+| `+o--+`
+| image::sym01.png[]
+
+|===
+
+It is possible to replace `+--+` by `+..+` to have a dotted
+line.
+
+Knowing those rules, it is possible to draw the following drawings:
+
+
+
+@startuml
+Class01 <|-- Class02
+Class03 *-- Class04
+Class05 o-- Class06
+Class07 .. Class08
+Class09 -- Class10
+@enduml
+
+
+
+@startuml
+Class11 <|.. Class12
+Class13 --> Class14
+Class15 ..> Class16
+Class17 ..|> Class18
+Class19 <--* Class20
+@enduml
+
+
+
+@startuml
+Class21 #-- Class22
+Class23 x-- Class24
+Class25 }-- Class26
+Class27 +-- Class28
+Class29 ^-- Class30
+@enduml
+
+
+
+
+== Label on relations
+
+
+It is possible to add a label on the relation, using `+:+`, followed
+by the text of the label.
+
+For cardinality, you can use double-quotes `+""+` on each side
+of the relation.
+
+
+
+@startuml
+
+Class01 "1" *-- "many" Class02 : contains
+
+Class03 o-- Class04 : aggregation
+
+Class05 --> "1" Class06
+
+@enduml
+
+
+You can add an extra arrow pointing at one object showing
+which object acts on the other object, using `+<+` or `+>+`
+at the begin or at the end of the label.
+
+
+
+@startuml
+class Car
+
+Driver - Car : drives >
+Car *- Wheel : have 4 >
+Car -- Person : < owns
+
+@enduml
+
+
+
+== Using non-letters in element names and relation labels
+
+
+If you want to use link::unicode[non-letters] in the class (or enum...) display name, you can either :
+* Use the `+as+` keyword in the class definition to assign an alias
+* Put quotes `+""+` around the class name
+
+
+@startuml
+class "This is my class" as class1
+class class2 as "It works this way too"
+
+class2 *-- "foo/dummy" : use
+@enduml
+
+
+If an alias is assigned to an element, the rest of the file must refer to the element by the alias instead of the name.
+
+=== Starting names with `+$+`
+Note that names starting with `+$+` cannot be hidden or removed later, because `+hide+` and `+remove+` command will consider the name a `+$tag+` instead of a component name. To later remove such elements they must have an alias or must be tagged.
+
+@startuml
+class $C1
+class $C2 $C2
+class "$C2" as dollarC2
+remove $C1
+remove $C2
+remove dollarC2
+@enduml
+
+Also note that names starting with `+$+` are valid, but to assign an alias to such element the name must be put between quotes `+""+`.
+
+
+== Adding methods
+
+To declare fields and methods, you can use the symbol
+`+:+` followed by the field's or method's name.
+
+The system checks for parenthesis to choose between methods and fields.
+
+
+@startuml
+Object <|-- ArrayList
+
+Object : equals()
+ArrayList : Object[] elementData
+ArrayList : size()
+
+@enduml
+
+
+
+It is also possible to group between brackets
+`+{}+` all fields and methods.
+
+Note that the syntax is highly flexible about type/name order.
+
+
+
+@startuml
+class Dummy {
+ String data
+ void methods()
+}
+
+class Flight {
+ flightNumber : Integer
+ departureTime : Date
+}
+@enduml
+
+
+You can use `+{field}+` and `+{method}+` modifiers to
+override default behaviour of the parser about fields and methods.
+
+@startuml
+class Dummy {
+ {field} A field (despite parentheses)
+ {method} Some method
+}
+
+@enduml
+
+
+
+
+== Defining visibility
+
+When you define methods or fields, you can use characters to define the
+visibility of the corresponding item:
+
+|===
+| Character | Icon for field | Icon for method | Visibility
+
+| `+-+`
+| image::private-field.png[]
+| image::private-method.png[]
+| `+private+`
+
+| `+#+`
+| image::protected-field.png[]
+| image::protected-method.png[]
+| `+protected+`
+
+| `+~+`
+| image::package-private-field.png[]
+| image::package-private-method.png[]
+| `+package private+`
+
+| `+++`
+| image::public-field.png[]
+| image::public-method.png[]
+| `+public+`
+
+|===
+
+
+@startuml
+
+class Dummy {
+ -field1
+ #field2
+ ~method1()
+ +method2()
+}
+
+@enduml
+
+
+
+You can turn off this feature using the `+skinparam classAttributeIconSize 0+` command :
+
+
+
+@startuml
+skinparam classAttributeIconSize 0
+class Dummy {
+ -field1
+ #field2
+ ~method1()
+ +method2()
+}
+
+@enduml
+
+
+Visibility indicators are optional and can be ommitted individualy without turning off the icons globally using `+skinparam classAttributeIconSize 0+`.
+
+
+@startuml
+class Dummy {
+ field1
+ field2
+ method1()
+ method2()
+}
+
+@enduml
+
+
+In such case if you'd like to use methods or fields that start with `+-+`, `+#+`, `+~+` or `+++` characters such as a destructor in some languages for `+Dummy+` class `+~Dummy()+`, escape the first character with a `+\+` character:
+
+
+
+@startuml
+class Dummy {
+ field1
+ \~Dummy()
+ method1()
+}
+
+@enduml
+
+
+
+== Abstract and Static
+
+
+
+You can define static or abstract methods or fields using the `+{static}+`
+or `+{abstract}+` modifier.
+
+These modifiers can be used at the start or at the end of the line.
+You can also use `+{classifier}+` instead of `+{static}+`.
+
+
+@startuml
+class Dummy {
+ {static} String id
+ {abstract} void methods()
+}
+@enduml
+
+
+
+
+== Advanced class body
+
+
+
+By default, methods and fields are automatically regrouped by PlantUML.
+You can use separators to define your own way of ordering fields and methods.
+The following separators are possible : `+--+` `+..+` `+==+` `+__+`.
+
+You can also use titles within the separators:
+
+
+
+@startuml
+class Foo1 {
+ You can use
+ several lines
+ ..
+ as you want
+ and group
+ ==
+ things together.
+ __
+ You can have as many groups
+ as you want
+ --
+ End of class
+}
+
+class User {
+ .. Simple Getter ..
+ + getName()
+ + getAddress()
+ .. Some setter ..
+ + setName()
+ __ private data __
+ int age
+ -- encrypted --
+ String password
+}
+
+@enduml
+
+
+
+== Notes and stereotypes
+
+Stereotypes are defined with the `+class+` keyword, `+<<+` and `+>>+`.
+
+You can also define notes using `+note left of+` , `+note right of+` , `+note top of+` , `+note bottom of+`
+keywords.
+
+You can also define a note on the last defined class using `+note left+`, `+note right+`,
+`+note top+`, `+note bottom+`.
+
+A note can be also define alone with the `+note+`
+keywords, then linked to other objects using the `+..+` symbol.
+
+
+@startuml
+class Object << general >>
+Object <|--- ArrayList
+
+note top of Object : In java, every class\nextends this one.
+
+note "This is a floating note" as N1
+note "This note is connected\nto several objects." as N2
+Object .. N2
+N2 .. ArrayList
+
+class Foo
+note left: On last defined class
+
+@enduml
+
+
+
+
+== More on notes
+
+
+It is also possible to use few HTML tags (See link::creole[Creole expression]) like :
+
+* `++`
+* `++`
+* `++`
+* `++`, `++`, `++`
+* `++` or `++`
+* `++` or `++`
+* `++` to change font size
+* `++` or `++`: the file must be accessible by the filesystem
+
+
+You can also have a note on several lines.
+
+You can also define a note on the last defined class using `+note left+`, `+note right+`,
+`+note top+`, `+note bottom+`.
+
+@startuml
+
+class Foo
+note left: On last defined class
+
+note top of Object
+ In java, every class
+ extends
+ this one.
+end note
+
+note as N1
+ This note is also
+ on several
+ words lines
+ And this is hosted by
+end note
+
+@enduml
+
+
+
+== Note on field (field, attribute, member) or method
+
+
+It is possible to add a note on field (field, attribute, member) or on method.
+
+=== โ Constraint
+* This cannot be used with `+top+` or `+bottom+` __(only `+left+` and `+right+` are implemented)__
+* This cannot be used with namespaceSeparator `+::+`
+
+
+=== Note on field or method
+
+
+@startuml
+class A {
+{static} int counter
++void {abstract} start(int timeout)
+}
+note right of A::counter
+ This member is annotated
+end note
+note right of A::start
+ This method is now explained in a UML note
+end note
+@enduml
+
+
+
+=== Note on method with the same name
+
+
+@startuml
+class A {
+{static} int counter
++void {abstract} start(int timeoutms)
++void {abstract} start(Duration timeout)
+}
+note left of A::counter
+ This member is annotated
+end note
+note right of A::"start(int timeoutms)"
+ This method with int
+end note
+note right of A::"start(Duration timeout)"
+ This method with Duration
+end note
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/3474[QA-3474] and https://forum.plantuml.net/5835[QA-5835]]__
+
+
+== Note on links
+
+
+It is possible to add a note on a link, just after the link definition, using `+note on link+`.
+
+You can also use `+note left on link+`, `+note right on link+`, `+note top on link+`,
+`+note bottom on link+` if you want to change the relative position of the note with the label.
+
+
+@startuml
+
+class Dummy
+Dummy --> Foo : A link
+note on link #red: note that is red
+
+Dummy --> Foo2 : Another link
+note right on link #blue
+this is my note on right link
+and in blue
+end note
+
+@enduml
+
+
+
+
+== Abstract class and interface
+
+
+You can declare a class as abstract using `+abstract+` or `+abstract class+` keywords.
+
+The class will be printed in __italic__.
+
+
+You can use the `+interface+`, `+annotation+` and `+enum+` keywords too.
+
+
+@startuml
+
+abstract class AbstractList
+abstract AbstractCollection
+interface List
+interface Collection
+
+List <|-- AbstractList
+Collection <|-- AbstractCollection
+
+Collection <|- List
+AbstractCollection <|- AbstractList
+AbstractList <|-- ArrayList
+
+class ArrayList {
+ Object[] elementData
+ size()
+}
+
+enum TimeUnit {
+ DAYS
+ HOURS
+ MINUTES
+}
+
+annotation SuppressWarnings
+
+annotation Annotation {
+ annotation with members
+ String foo()
+ String bar()
+}
+
+
+@enduml
+
+
+__[Ref. 'Annotation with members' https://github.com/plantuml/plantuml/issues/458[Issue#458]]__
+
+
+== Hide attributes, methods...
+
+You can parameterize the display of classes using the `+hide/show+`
+command.
+
+The basic command is: `+hide empty members+`. This
+command will hide attributes or methods if they are empty.
+
+Instead of `+empty members+`, you can use:
+* `+empty fields+` or `+empty attributes+` for empty fields,
+* `+empty methods+` for empty methods,
+* `+fields+` or `+attributes+` which will hide fields, even if they are described,
+* `+methods+` which will hide methods, even if they are described,
+* `+members+` which will hide fields +++and+++ methods, even if they are described,
+* `+circle+` for the circled character in front of class name,
+* `+stereotype+` for the stereotype.
+
+You can also provide, just after the `+hide+` or `+show+`
+keyword:
+* `+class+` for all classes,
+* `+interface+` for all interfaces,
+* `+enum+` for all enums,
+* `+<>+` for classes which are stereotyped with __foo1__,
+* an existing class name.
+
+You can use several `+show/hide+` commands to define rules and
+exceptions.
+
+
+@startuml
+
+class Dummy1 {
+ +myMethods()
+}
+
+class Dummy2 {
+ +hiddenMethod()
+}
+
+class Dummy3 <> {
+String name
+}
+
+hide members
+hide <> circle
+show Dummy1 methods
+show <> fields
+
+@enduml
+
+
+
+
+== Hide classes
+
+You can also use the `+show/hide+` commands to hide classes.
+
+This may be useful if you define a large link::preprocessing[!included file],
+and if you want to hide some classes after link::preprocessing[file inclusion].
+
+
+@startuml
+
+class Foo1
+class Foo2
+
+Foo2 *-- Foo1
+
+hide Foo2
+
+@enduml
+
+
+
+== Remove classes
+
+You can also use the `+remove+` commands to remove classes.
+
+This may be useful if you define a large link::preprocessing[!included file],
+and if you want to remove some classes after link::preprocessing[file inclusion].
+
+
+@startuml
+
+class Foo1
+class Foo2
+
+Foo2 *-- Foo1
+
+remove Foo2
+
+@enduml
+
+
+
+== Hide, Remove or Restore tagged element or wildcard
+
+You can put `+$tags+` (using `+$+`) on elements, then remove, hide or restore components either individually or by tags.
+
+By default, all components are displayed:
+
+@startuml
+class C1 $tag13
+enum E1
+interface I1 $tag13
+C1 -- I1
+@enduml
+
+
+But you can:
+* `+hide $tag13+` components:
+
+@startuml
+class C1 $tag13
+enum E1
+interface I1 $tag13
+C1 -- I1
+
+hide $tag13
+@enduml
+
+
+* or `+remove $tag13+` components:
+
+@startuml
+class C1 $tag13
+enum E1
+interface I1 $tag13
+C1 -- I1
+
+remove $tag13
+@enduml
+
+
+* or `+remove $tag13 and restore $tag1+` components:
+
+@startuml
+class C1 $tag13 $tag1
+enum E1
+interface I1 $tag13
+C1 -- I1
+
+remove $tag13
+restore $tag1
+@enduml
+
+
+* or `+remove * and restore $tag1+` components:
+
+@startuml
+class C1 $tag13 $tag1
+enum E1
+interface I1 $tag13
+C1 -- I1
+
+remove *
+restore $tag1
+@enduml
+
+
+
+== Hide or Remove unlinked class
+
+By default, all classes are displayed:
+
+@startuml
+class C1
+class C2
+class C3
+C1 -- C2
+@enduml
+
+
+But you can:
+* `+hide @unlinked+` classes:
+
+@startuml
+class C1
+class C2
+class C3
+C1 -- C2
+
+hide @unlinked
+@enduml
+
+
+* or `+remove @unlinked+` classes:
+
+@startuml
+class C1
+class C2
+class C3
+C1 -- C2
+
+remove @unlinked
+@enduml
+
+
+
+__[Adapted from https://forum.plantuml.net/11052[QA-11052]]__
+
+
+== Use generics
+
+
+You can also use bracket `+<+` and `+>+` to define generics usage in a class.
+
+
+@startuml
+
+class Foo extends Element> {
+ int size()
+}
+Foo *- Element
+
+@enduml
+
+
+It is possible to disable this drawing using `+skinparam genericDisplay old+` command.
+
+
+
+== Specific Spot
+
+Usually, a spotted character (C, I, E or A) is used for classes,
+interface, enum and abstract classes.
+
+But you can define your own spot for a class when you define the stereotype,
+adding a single character and a color, like in this example:
+
+
+@startuml
+
+class System << (S,#FF7700) Singleton >>
+class Date << (D,orchid) >>
+@enduml
+
+
+
+
+== Packages
+
+You can define a package using the
+`+package+` keyword, and optionally declare a background color
+for your package (Using a html color code or name).
+
+Note that package definitions can be nested.
+
+
+@startuml
+
+package "Classic Collections" #DDDDDD {
+ Object <|-- ArrayList
+}
+
+package net.sourceforge.plantuml {
+ Object <|-- Demo1
+ Demo1 *- Demo2
+}
+
+@enduml
+
+
+
+
+== Packages style
+
+
+
+There are different styles available for packages.
+
+You can specify them either by setting a default style with the command : `+skinparam packageStyle+`,
+or by using a stereotype on the package:
+
+
+@startuml
+scale 750 width
+package foo1 <> {
+ class Class1
+}
+
+package foo2 <> {
+ class Class2
+}
+
+package foo3 <> {
+ class Class3
+}
+
+package foo4 <> {
+ class Class4
+}
+
+package foo5 <> {
+ class Class5
+}
+
+package foo6 <> {
+ class Class6
+}
+
+@enduml
+
+
+
+You can also define links between packages, like in the following
+example:
+
+
+@startuml
+
+skinparam packageStyle rectangle
+
+package foo1.foo2 {
+}
+
+package foo1.foo2.foo3 {
+ class Object
+}
+
+foo1.foo2 +-- foo1.foo2.foo3
+
+@enduml
+
+
+
+
+== Namespaces
+
+In packages, the name of a class is the unique identifier of this class.
+It means that you cannot have two classes with the very same name in
+different packages.
+
+In that case, you should use http://en.wikipedia.org/wiki/Namespace_%28computer_science%29[namespaces]
+instead of packages.
+
+You can refer to classes from other namespaces by fully qualify
+them. Classes from the default namespace are qualified with a starting
+dot.
+
+Note that you don't have to explicitly create namespace : a fully
+qualified class is automatically put in the right namespace.
+
+
+@startuml
+
+class BaseClass
+
+namespace net.dummy #DDDDDD {
+ .BaseClass <|-- Person
+ Meeting o-- Person
+
+ .BaseClass <|- Meeting
+}
+
+namespace net.foo {
+ net.dummy.Person <|- Person
+ .BaseClass <|-- Person
+
+ net.dummy.Meeting o-- Person
+}
+
+BaseClass <|-- net.unused.Person
+
+@enduml
+
+
+
+
+== Automatic namespace creation
+
+
+
+You can define another separator (other than the dot) using
+the command : `+set namespaceSeparator ???+`.
+
+
+@startuml
+
+set namespaceSeparator ::
+class X1::X2::foo {
+ some info
+}
+
+@enduml
+
+
+You can disable automatic namespace creation using the command
+`+set namespaceSeparator none+`.
+
+
+@startuml
+
+set namespaceSeparator none
+class X1.X2.foo {
+ some info
+}
+
+@enduml
+
+
+
+== Lollipop interface
+
+
+You can also define lollipops interface on classes, using the following
+syntax:
+* `+bar ()- foo+`
+* `+bar ()-- foo+`
+* `+foo -() bar+`
+
+
+@startuml
+class foo
+bar ()- foo
+@enduml
+
+
+
+
+== Changing arrows orientation
+
+By default, links between classes have two dashes `+--+` and are vertically oriented.
+It is possible to use horizontal link by putting a single dash (or dot) like this:
+
+
+@startuml
+Room o- Student
+Room *-- Chair
+@enduml
+
+
+You can also change directions by reversing the link:
+
+
+@startuml
+Student -o Room
+Chair --* Room
+@enduml
+
+
+It is also possible to change arrow direction by adding `+left+`, `+right+`, `+up+`
+or `+down+` keywords inside the arrow:
+
+
+@startuml
+foo -left-> dummyLeft
+foo -right-> dummyRight
+foo -up-> dummyUp
+foo -down-> dummyDown
+@enduml
+
+
+You can shorten the arrow by using only the first character of the direction (for example, `+-d-+` instead of
+`+-down-+`)
+or the two first characters (`+-do-+`).
+
+Please note that you should not abuse this functionality : __Graphviz__ gives usually good results without tweaking.
+
+And with the link::use-case-diagram#d551e48d272b2b07[`+left to right direction+`] parameter:
+
+@startuml
+left to right direction
+foo -left-> dummyLeft
+foo -right-> dummyRight
+foo -up-> dummyUp
+foo -down-> dummyDown
+@enduml
+
+
+
+== Association classes
+
+You can define __association class__ after that a relation has been
+defined between two classes, like in this example:
+
+@startuml
+class Student {
+ Name
+}
+Student "0..*" - "1..*" Course
+(Student, Course) .. Enrollment
+
+class Enrollment {
+ drop()
+ cancel()
+}
+@enduml
+
+
+You can define it in another direction:
+
+
+@startuml
+class Student {
+ Name
+}
+Student "0..*" -- "1..*" Course
+(Student, Course) . Enrollment
+
+class Enrollment {
+ drop()
+ cancel()
+}
+@enduml
+
+
+
+
+== Association on same class
+
+
+@startuml
+class Station {
+ +name: string
+}
+
+class StationCrossing {
+ +cost: TimeInterval
+}
+
+<> diamond
+
+StationCrossing . diamond
+diamond - "from 0..*" Station
+diamond - "to 0..* " Station
+@enduml
+
+
+__[Ref. http://wiki.plantuml.net/site/incubation#associations[Incubation: Associations]]__
+
+
+== Skinparam
+
+
+
+You can use the link::skinparam[skinparam]
+command to change colors and fonts for the drawing.
+
+You can use this command :
+* In the diagram definition, like any other commands,
+* In an link::preprocessing[included file],
+* In a configuration file, provided in the link::command-line[command line] or the link::ant-task[ANT task].
+
+
+@startuml
+
+skinparam class {
+BackgroundColor PaleGreen
+ArrowColor SeaGreen
+BorderColor SpringGreen
+}
+skinparam stereotypeCBackgroundColor YellowGreen
+
+Class01 "1" *-- "many" Class02 : contains
+
+Class03 o-- Class04 : aggregation
+
+@enduml
+
+
+
+
+== Skinned Stereotypes
+
+
+You can define specific color and fonts for stereotyped classes.
+
+
+@startuml
+
+skinparam class {
+BackgroundColor PaleGreen
+ArrowColor SeaGreen
+BorderColor SpringGreen
+BackgroundColor<> Wheat
+BorderColor<> Tomato
+}
+skinparam stereotypeCBackgroundColor YellowGreen
+skinparam stereotypeCBackgroundColor<< Foo >> DimGray
+
+Class01 <>
+Class03 <>
+Class01 "1" *-- "many" Class02 : contains
+
+Class03 o-- Class04 : aggregation
+
+@enduml
+
+
+
+
+== Color gradient
+
+You can declare individual colors for classes, notes etc using the # notation.
+
+You can use standard color names or RGB codes in various notations, see link::color[Colors].
+
+You can also use color gradient for background colors, with the following syntax:
+two colors names separated either by:
+* `+|+`,
+* `+/+`,
+* `+\+`, or
+* `+-+`
+depending on the direction of the gradient.
+
+For example:
+
+
+@startuml
+
+skinparam backgroundcolor AntiqueWhite/Gold
+skinparam classBackgroundColor Wheat|CornflowerBlue
+
+class Foo #red-green
+note left of Foo #blue\9932CC
+ this is my
+ note on this class
+end note
+
+package example #GreenYellow/LightGoldenRodYellow {
+ class Dummy
+}
+
+@enduml
+
+
+
+== Help on layout
+
+
+Sometimes, the default layout is not perfect...
+
+You can use `+together+` keyword to group some classes together :
+the layout engine will try to group them (as if they were in the same package).
+
+You can also use `+hidden+` links to force the layout.
+
+@startuml
+
+class Bar1
+class Bar2
+together {
+ class Together1
+ class Together2
+ class Together3
+}
+Together1 - Together2
+Together2 - Together3
+Together2 -[hidden]--> Bar1
+Bar1 -[hidden]> Bar2
+
+
+@enduml
+
+
+
+
+
+
+== Splitting large files
+
+Sometimes, you will get some very large image files.
+
+You can use the `+page (hpages)x(vpages)+` command to split the generated image into several files :
+
+`+hpages+` is a number that indicated the number of horizontal pages,
+and `+vpages+` is a number that indicated the number of vertical pages.
+
+You can also use some specific skinparam settings to put borders on splitted pages (see example).
+
+
+@startuml
+' Split into 4 pages
+page 2x2
+skinparam pageMargin 10
+skinparam pageExternalColor gray
+skinparam pageBorderColor black
+
+class BaseClass
+
+namespace net.dummy #DDDDDD {
+ .BaseClass <|-- Person
+ Meeting o-- Person
+
+ .BaseClass <|- Meeting
+
+}
+
+namespace net.foo {
+ net.dummy.Person <|- Person
+ .BaseClass <|-- Person
+
+ net.dummy.Meeting o-- Person
+}
+
+BaseClass <|-- net.unused.Person
+@enduml
+
+
+
+
+
+== Extends and implements
+
+It is also possible to use `+extends+` and `+implements+` keywords.
+
+@startuml
+class ArrayList implements List
+class ArrayList extends AbstractList
+@enduml
+
+
+
+== Bracketed relations (linking or arrow) style
+
+=== Line style
+It's also possible to have explicitly `+bold+`, `+dashed+`, `+dotted+`, `+hidden+` or `+plain+` relation, links or arrows: +
+
+* without label
+
+
+@startuml
+title Bracketed line style without label
+class foo
+class bar
+bar1 : [bold]
+bar2 : [dashed]
+bar3 : [dotted]
+bar4 : [hidden]
+bar5 : [plain]
+
+foo --> bar
+foo -[bold]-> bar1
+foo -[dashed]-> bar2
+foo -[dotted]-> bar3
+foo -[hidden]-> bar4
+foo -[plain]-> bar5
+@enduml
+
+
+* with label
+
+
+@startuml
+title Bracketed line style with label
+class foo
+class bar
+bar1 : [bold]
+bar2 : [dashed]
+bar3 : [dotted]
+bar4 : [hidden]
+bar5 : [plain]
+
+foo --> bar : โ
+foo -[bold]-> bar1 : [bold]
+foo -[dashed]-> bar2 : [dashed]
+foo -[dotted]-> bar3 : [dotted]
+foo -[hidden]-> bar4 : [hidden]
+foo -[plain]-> bar5 : [plain]
+
+@enduml
+
+
+__[Adapted from https://forum.plantuml.net/4181/how-change-width-line-in-a-relationship-between-two-classes?show=4232#a4232[QA-4181]]__
+
+=== Line color
+
+
+@startuml
+title Bracketed line color
+class foo
+class bar
+bar1 : [#red]
+bar2 : [#green]
+bar3 : [#blue]
+
+foo --> bar
+foo -[#red]-> bar1 : [#red]
+foo -[#green]-> bar2 : [#green]
+foo -[#blue]-> bar3 : [#blue]
+'foo -[#blue;#yellow;#green]-> bar4
+@enduml
+
+
+=== Line thickness
+
+
+@startuml
+title Bracketed line thickness
+class foo
+class bar
+bar1 : [thickness=1]
+bar2 : [thickness=2]
+bar3 : [thickness=4]
+bar4 : [thickness=8]
+bar5 : [thickness=16]
+
+foo --> bar : โ
+foo -[thickness=1]-> bar1 : [1]
+foo -[thickness=2]-> bar2 : [2]
+foo -[thickness=4]-> bar3 : [4]
+foo -[thickness=8]-> bar4 : [8]
+foo -[thickness=16]-> bar5 : [16]
+
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/4949[QA-4949]]__
+
+=== Mix
+
+@startuml
+title Bracketed line style mix
+class foo
+class bar
+bar1 : [#red,thickness=1]
+bar2 : [#red,dashed,thickness=2]
+bar3 : [#green,dashed,thickness=4]
+bar4 : [#blue,dotted,thickness=8]
+bar5 : [#blue,plain,thickness=16]
+
+foo --> bar : โ
+foo -[#red,thickness=1]-> bar1 : [#red,1]
+foo -[#red,dashed,thickness=2]-> bar2 : [#red,dashed,2]
+foo -[#green,dashed,thickness=4]-> bar3 : [#green,dashed,4]
+foo -[#blue,dotted,thickness=8]-> bar4 : [blue,dotted,8]
+foo -[#blue,plain,thickness=16]-> bar5 : [blue,plain,16]
+@enduml
+
+
+
+== Change relation (linking or arrow) color and style (inline style)
+
+You can change the link::color[color] or style of individual relation or arrows using the inline following notation:
+
+* `+#color;line.[bold|dashed|dotted];text:color+`
+
+
+@startuml
+class foo
+foo --> bar : normal
+foo --> bar1 #line:red;line.bold;text:red : red bold
+foo --> bar2 #green;line.dashed;text:green : green dashed
+foo --> bar3 #blue;line.dotted;text:blue : blue dotted
+@enduml
+
+
+__[See similar feature on link::deployment-diagram#0b2e57c3d4eafdda[deployment]]__
+
+
+== Change class color and style (inline style)
+
+You can change the link::color[color] or style of individual class using the two following notations:
+
+* `+#color ##[style]color+`
+
+With background color first (`+#color+`), then line style and line color (`+##[style]color+` )
+
+@startuml
+abstract abstract
+annotation annotation #pink ##[bold]red
+class class #palegreen ##[dashed]green
+interface interface #aliceblue ##[dotted]blue
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/1487[QA-1487]]__
+
+* `+#[color|back:color];header:color;line:color;line.[bold|dashed|dotted];text:color+`
+
+
+@startuml
+abstract abstract
+annotation annotation #pink;line:red;line.bold;text:red
+class class #palegreen;line:green;line.dashed;text:green
+interface interface #aliceblue;line:blue;line.dotted;text:blue
+@enduml
+
+
+First original example:
+
+@startuml
+class bar #line:green;back:lightblue
+class bar2 #lightblue;line:green
+
+class Foo1 #back:red;line:00FFFF
+class FooDashed #line.dashed:blue
+class FooDotted #line.dotted:blue
+class FooBold #line.bold
+class Demo1 #back:lightgreen|yellow;header:blue/red
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/3770[QA-3770]]__
+
+
+== Arrows from/to class members
+
+
+@startuml
+class Foo {
++ field1
++ field2
+}
+
+class Bar {
++ field3
++ field4
+}
+
+Foo::field1 --> Bar::field3 : foo
+Foo::field2 --> Bar::field4 : bar
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/3636[QA-3636]]__
+
+
+
+@startuml
+left to right direction
+
+class User {
+ id : INTEGER
+ ..
+ other_id : INTEGER
+}
+
+class Email {
+ id : INTEGER
+ ..
+ user_id : INTEGER
+ address : INTEGER
+}
+
+User::id *-- Email::user_id
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/5261[QA-5261]]__
+
+
+== Grouping inheritance arrow heads
+
+You can merge all arrow heads using the `+skinparam groupInheritance+`, with a threshold as parameter.
+
+=== GroupInheritance 1 (no grouping)
+
+@startuml
+skinparam groupInheritance 1
+
+A1 <|-- B1
+
+A2 <|-- B2
+A2 <|-- C2
+
+A3 <|-- B3
+A3 <|-- C3
+A3 <|-- D3
+
+A4 <|-- B4
+A4 <|-- C4
+A4 <|-- D4
+A4 <|-- E4
+@enduml
+
+
+=== GroupInheritance 2 (grouping from 2)
+
+@startuml
+skinparam groupInheritance 2
+
+A1 <|-- B1
+
+A2 <|-- B2
+A2 <|-- C2
+
+A3 <|-- B3
+A3 <|-- C3
+A3 <|-- D3
+
+A4 <|-- B4
+A4 <|-- C4
+A4 <|-- D4
+A4 <|-- E4
+@enduml
+
+
+=== GroupInheritance 3 (grouping only from 3)
+
+@startuml
+skinparam groupInheritance 3
+
+A1 <|-- B1
+
+A2 <|-- B2
+A2 <|-- C2
+
+A3 <|-- B3
+A3 <|-- C3
+A3 <|-- D3
+
+A4 <|-- B4
+A4 <|-- C4
+A4 <|-- D4
+A4 <|-- E4
+@enduml
+
+
+=== GroupInheritance 4 (grouping only from 4)
+
+@startuml
+skinparam groupInheritance 4
+
+A1 <|-- B1
+
+A2 <|-- B2
+A2 <|-- C2
+
+A3 <|-- B3
+A3 <|-- C3
+A3 <|-- D3
+
+A4 <|-- B4
+A4 <|-- C4
+A4 <|-- D4
+A4 <|-- E4
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/3193/grouping-inheritance-arrow-ends[QA-3193], and Defect https://forum.plantuml.net/13532/groupinheritance-bug[QA-13532]]__
+
+
+== Display JSON Data on Class or Object diagram
+
+=== Simple example
+
+@startuml
+class Class
+object Object
+json JSON {
+ "fruit":"Apple",
+ "size":"Large",
+ "color": ["Red", "Green"]
+}
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/15481/possible-link-elements-from-two-jsons-with-both-jsons-embeded?show=15567#c15567[QA-15481]]__
+
+For another example, see on link::json#jinnkhaa7d65l0fkhfec[JSON page].
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/code-groovy.adoc b/plantuml-docs/docs_from_alphadoc/code-groovy.adoc
new file mode 100644
index 00000000..0ffa9f35
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/code-groovy.adoc
@@ -0,0 +1,20 @@
+== Groovy API Client Code
+
+Since calling Java from http://groovy.codehaus.org[Groovy] is pretty simple, the only thing to do is to copy http://sourceforge.net/projects/plantuml/files/plantuml.jar/download[PlantUML.jar] file to the http://groovy.codehaus.org/Running#Running-Addingthingstotheclasspath[classpath] (for example, `+../Groovy/Groovy-1.7.6/lib+` directory).
+
+
+The following script print the current PlantUML version, and encode a URL:
+----
+println net.sourceforge.plantuml.version.Version.version() println
+net.sourceforge.plantuml.code.TranscoderUtil.getDefaultTranscoder().encode("Bob->Alice:hello")
+----
+
+If you want to generate an image from a description:
+----
+s = new net.sourceforge.plantuml.SourceStringReader("@startuml\nBob->Alice:hello\n@enduml")
+FileOutputStream file = new FileOutputStream("c:/testGroovy2.png")
+s.generateImage(file);
+file.close()
+----
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/code-javascript-asynchronous.adoc b/plantuml-docs/docs_from_alphadoc/code-javascript-asynchronous.adoc
new file mode 100644
index 00000000..0622927d
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/code-javascript-asynchronous.adoc
@@ -0,0 +1,104 @@
+== Javascript API Client Code
+
+To use PlantUML image generation, a text diagram description have to be :
+
+. Encoded in UTF-8
+. Compressed using http://en.wikipedia.org/wiki/DEFLATE[Deflate] algorithm
+. Reencoded in ASCII using a transformation __close__ to http://en.wikipedia.org/wiki/Base64[base64]
+
+This is exactly what the following `+compress()+` function is doing.
+
+'''
+
+----
+
+
+
+
+tag
+----
+* Use image :
+;
+@enduml
+
+
+=== Common HTML element
+
+@startuml
+hide footbox
+note over Source
+
+ This is bold
+ This is italics
+ This is monospaced
+ This is stroked
+ This is underlined
+ This is waved
+ This is stroked
+ This is underlined
+ This is waved
+ This is a bold text containing plain text inside
+ -- other examples --
+ This is Blue
+ This is Orange background
+ This is big
+
+end note
+/note over Output
+ This is bold
+ This is italics
+ This is monospaced
+ This is stroked
+ This is underlined
+ This is waved
+ This is stroked
+ This is underlined
+ This is waved
+ This is a bold text containing plain text inside
+ -- other examples --
+ This is Blue
+ This is Orange background
+ This is big
+end note
+@enduml
+
+
+
+__[Ref. https://forum.plantuml.net/5254[QA-5254] for `+plain+`]__
+
+=== Subscript and Superscript element [sub, sup]
+
+@startuml
+:
+This is the "caffeine" molecule: C8H10N4O2
+
+This is the "caffeine" molecule: C8H10N4O2
+----
+
+This is the Pythagorean theorem: a2 + b2 = c2
+
+This is the Pythagorean theorem: a2 + b2 = c2;
+@enduml
+
+
+
+== OpenIconic
+
+
+OpenIconic is a very nice open-source icon set.
+Those icons are integrated in the creole parser, so you can use them out-of-the-box.
+
+Use the following syntax: `+<&ICON_NAME>+`.
+
+@startuml
+title: <&heart>Use of OpenIconic<&heart>
+class Wifi
+note left
+ Click on <&wifi>
+end note
+@enduml
+
+
+The complete list is available with the following special command:
+
+
+@startuml
+listopeniconic
+@enduml
+
+
+
+== Appendix: Examples of "Creole List" on all diagrams
+
+=== Activity
+
+
+@startuml
+start
+:**test list 1**
+* Bullet list
+* Second item
+** Sub item
+*** Sub sub item
+* Third item
+----
+**test list 2**
+# Numbered list
+# Second item
+## Sub item
+## Another sub item
+# Third item;
+stop
+@enduml
+
+
+=== Class
+
+[[#FFD700#FIXME]] ๐ฉ
+* __Sub item__
+* __Sub sub item__
+[[#FFD700#FIXME]]
+
+
+@startuml
+
+class a {
+**test list 1**
+* Bullet list
+* Second item
+** Sub item
+*** Sub sub item
+* Third item
+----
+**test list 2**
+# Numbered list
+# Second item
+## Sub item
+## Another sub item
+# Third item
+}
+
+a -- b
+
+@enduml
+
+
+=== Component, Deployment, Use-Case
+
+
+@startuml
+node n [
+**test list 1**
+* Bullet list
+* Second item
+** Sub item
+*** Sub sub item
+* Third item
+----
+**test list 2**
+# Numbered list
+# Second item
+## Sub item
+## Another sub item
+# Third item
+]
+
+file f as "
+**test list 1**
+* Bullet list
+* Second item
+** Sub item
+*** Sub sub item
+* Third item
+----
+**test list 2**
+# Numbered list
+# Second item
+## Sub item
+## Another sub item
+# Third item
+"
+@enduml
+
+
+[[#98FB98#DONE]]
+__[Corrected in https://plantuml.com/changes[V1.2020.18]]__
+
+=== Gantt project planning
+
+N/A
+
+
+=== Object
+
+[[#FFD700#FIXME]]
+๐ฉ
+* __Sub item__
+* __Sub sub item__
+[[#FFD700#FIXME]]
+
+
+@startuml
+object user {
+**test list 1**
+* Bullet list
+* Second item
+** Sub item
+*** Sub sub item
+* Third item
+----
+**test list 2**
+# Numbered list
+# Second item
+## Sub item
+## Another sub item
+# Third item
+}
+
+@enduml
+
+
+=== MindMap
+
+
+@startmindmap
+
+* root
+** d1
+**:**test list 1**
+* Bullet list
+* Second item
+** Sub item
+*** Sub sub item
+* Third item
+----
+**test list 2**
+# Numbered list
+# Second item
+## Sub item
+## Another sub item
+# Third item;
+
+
+@endmindmap
+
+
+=== Network (nwdiag)
+
+@startuml
+nwdiag {
+ network Network {
+ Server [description="**test list 1**\n* Bullet list\n* Second item\n** Sub item\n*** Sub sub item\n* Third item\n----\n**test list 2**\n# Numbered list\n# Second item\n## Sub item\n## Another sub item\n# Third item"];
+}
+@enduml
+
+
+=== Note
+
+@startuml
+note as n
+**test list 1**
+* Bullet list
+* Second item
+** Sub item
+*** Sub sub item
+* Third item
+----
+**test list 2**
+# Numbered list
+# Second item
+## Sub item
+## Another sub item
+# Third item
+end note
+@enduml
+
+
+=== Sequence
+
+N/A __(or on note or common commands)__
+
+=== State
+
+N/A __(or on note or common commands)__
+
+=== WBS
+
+
+@startwbs
+
+* root
+** d1
+**:**test list 1**
+* Bullet list
+* Second item
+** Sub item
+*** Sub sub item
+* Third item
+----
+**test list 2**
+# Numbered list
+# Second item
+## Sub item
+## Another sub item
+# Third item;
+
+@endwbs
+
+
+
+== Appendix: Examples of "Creole horizontal lines" on all diagrams
+
+=== Activity
+
+[[#FFD700#FIXME]]
+๐ฉ
+strong line
+`+____+`
+[[#FFD700#FIXME]]
+
+
+@startuml
+start
+:You can have horizontal line
+----
+Or double line
+====
+Or strong line
+____
+Or dotted line
+..My title..
+Or dotted title
+//and title... //
+==Title==
+Or double-line title
+--Another title--
+Or single-line title
+Enjoy!;
+stop
+@enduml
+
+
+=== Class
+
+
+
+
+@startuml
+
+class a {
+You can have horizontal line
+----
+Or double line
+====
+Or strong line
+____
+Or dotted line
+..My title..
+Or dotted title
+//and title... //
+==Title==
+Or double-line title
+--Another title--
+Or single-line title
+Enjoy!
+}
+
+a -- b
+
+@enduml
+
+
+=== Component, Deployment, Use-Case
+
+
+@startuml
+node n [
+You can have horizontal line
+----
+Or double line
+====
+Or strong line
+____
+Or dotted line
+..My title..
+//and title... //
+==Title==
+--Another title--
+Enjoy!
+]
+
+file f as "
+You can have horizontal line
+----
+Or double line
+====
+Or strong line
+____
+Or dotted line
+..My title..
+//and title... //
+==Title==
+--Another title--
+Enjoy!
+"
+
+person p [
+
+You can have horizontal line
+----
+Or double line
+====
+Or strong line
+____
+Or dotted line
+..My title..
+//and title... //
+==Title==
+--Another title--
+Enjoy!
+
+]
+@enduml
+
+
+=== Gantt project planning
+
+N/A
+
+
+=== Object
+
+
+@startuml
+object user {
+You can have horizontal line
+----
+Or double line
+====
+Or strong line
+____
+Or dotted line
+..My title..
+//and title... //
+==Title==
+--Another title--
+Enjoy!
+}
+
+@enduml
+
+
+[[#98FB98#DONE]]
+__[Corrected on https://plantuml.com/changes[V1.2020.18]]__
+
+=== MindMap
+
+[[#FFD700#FIXME]]
+๐ฉ
+strong line
+`+____+`
+[[#FFD700#FIXME]]
+
+@startmindmap
+
+* root
+** d1
+**:You can have horizontal line
+----
+Or double line
+====
+Or strong line
+____
+Or dotted line
+..My title..
+//and title... //
+==Title==
+--Another title--
+Enjoy!;
+
+@endmindmap
+
+
+=== Network (nwdiag)
+
+@startuml
+nwdiag {
+ network Network {
+ Server [description="You can have horizontal line\n----\nOr double line\n====\nOr strong line\n____\nOr dotted line\n..My title..\n//and title... //\n==Title==\n--Another title--\nEnjoy!"];
+}
+@enduml
+
+
+
+=== Note
+
+@startuml
+note as n
+You can have horizontal line
+----
+Or double line
+====
+Or strong line
+____
+Or dotted line
+..My title..
+//and title... //
+==Title==
+--Another title--
+Enjoy!
+end note
+@enduml
+
+
+
+=== Sequence
+
+N/A __(or on note or common commands)__
+
+=== State
+
+N/A __(or on note or common commands)__
+
+=== WBS
+
+[[#FFD700#FIXME]]
+๐ฉ
+strong line
+`+____+`
+[[#FFD700#FIXME]]
+
+@startwbs
+
+* root
+** d1
+**:You can have horizontal line
+----
+Or double line
+====
+Or strong line
+____
+Or dotted line
+..My title..
+//and title... //
+==Title==
+--Another title--
+Enjoy!;
+
+@endwbs
+
+
+
+== Style equivalent (between Creole and HTML)
+
+|===
+| Style | Creole | Legacy HTML like
+
+| **bold**
+| This is `+**bold**+`
+| This is `+bold+`
+
+| __italics__
+| This is `+//italics//+`
+| This is `+italics+`
+
+| `+monospaced+`
+| This is `+""monospaced""+`
+| This is `+monospaced+`
+
+| ~~stroked~~
+| This is `+--stroked--+`
+| This is `+stroked+`
+
+| +++underlined+++
+| This is `+__underlined__+`
+| This is `+underlined+`
+
+| waved
+| This is `+~~waved~~+`
+| This is `+waved+`
+
+|===
+
+
+
+@startmindmap
+* Style equivalent\n(between Creole and HTML)
+**:**Creole**
+----
+<#silver>|= code|= output|
+| \n This is ""~**bold**""\n | \n This is **bold** |
+| \n This is ""~//italics//""\n | \n This is //italics// |
+| \n This is ""~""monospaced~"" ""\n | \n This is ""monospaced"" |
+| \n This is ""~--stroked--""\n | \n This is --stroked-- |
+| \n This is ""~__underlined__""\n | \n This is __underlined__ |
+| \n This is ""waved""\n | \n This is ~~waved~~ |;
+**:Legacy HTML like
+----
+<#silver>|= code|= output|
+| \n This is ""~bold""\n | \n This is bold |
+| \n This is ""~italics""\n | \n This is italics |
+| \n This is ""~monospaced""\n | \n This is monospaced |
+| \n This is ""~stroked""\n | \n This is stroked |
+| \n This is ""~underlined""\n | \n This is underlined |
+| \n This is ""~waved""\n | \n This is waved |
+
+And color as a bonus...
+<#silver>|= code|= output|
+| \n This is ""~""green"""">stroked""\n | \n This is stroked |
+| \n This is ""~""red"""">underlined""\n | \n This is underlined |
+| \n This is ""~""#0000FF"""">waved""\n | \n This is waved |;
+@endmindmap
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/dark-mode.adoc b/plantuml-docs/docs_from_alphadoc/dark-mode.adoc
new file mode 100644
index 00000000..9354bf8d
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/dark-mode.adoc
@@ -0,0 +1,46 @@
+== Using dark mode
+
+Style support the standard `+@media (prefers-color-scheme:dark)+` directive.
+
+As you can see in https://github.com/plantuml/plantuml/blob/master/skin/plantuml.skin[the default CSS used by PlantUML].
+
+
+@startuml
+
+
+Alice -> Bob
+@enduml
+
+
+The previous example with `+OrangeRed+` with https://www.plantuml.com/plantuml/uml/VSwz2i8m5CNn_Jx51HSTYdijfNw0ez0tI9DZBKrovIOTH7ntKt2Minv-_BkKZUObU6fIVdcq18-0cFbDp8EnywYoH7SMBrhpvgOcZkZX3lGXwWBSP7ZxLDoXgRBhgqhsKOZQ6PrtXVaFNihhAjuXzhAYPSt-bq97FrbmrV991keGNGdz0W00[light mode] and `+DarkGoldenRod+` with https://www.plantuml.com/plantuml/duml/VSwz2i8m5CNn_Jx51HSTYdijfNw0ez0tI9DZBKrovIOTH7ntKt2Minv-_BkKZUObU6fIVdcq18-0cFbDp8EnywYoH7SMBrhpvgOcZkZX3lGXwWBSP7ZxLDoXgRBhgqhsKOZQ6PrtXVaFNihhAjuXzhAYPSt-bq97FrbmrV991keGNGdz0W00[dark mode].
+
+
+== Running in dark mode
+
+* If you are using link::command-line[the command line], you can add `+-darkmode+` flag to your command line to generate diagrams with dark-mode.
+* If you are using link::api[the public API], you have to specify the use of dark mode in `+FileFormatOption+`. For example:
+
+----
+String source = "@startuml\n";
+source += "Bob -> Alice : hello\n";
+source += "@enduml\n";
+
+SourceStringReader reader = new SourceStringReader(source);
+final ByteArrayOutputStream os = new ByteArrayOutputStream();
+// Write the first image to "os"
+String desc = reader.generateImage(os,
+ new FileFormatOption(FileFormat.PNG).withColorMapper(ColorMapper.DARK_MODE));
+os.close();
+----
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/dedication.adoc b/plantuml-docs/docs_from_alphadoc/dedication.adoc
new file mode 100644
index 00000000..007c035b
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/dedication.adoc
@@ -0,0 +1,56 @@
+== Dedication
+
+**You can integrate a personal photo or picture into PlantUML source code!**
+
+The photo will be https://en.wikipedia.org/wiki/Stream_cipher[encrypted into the source code], and will be displayed when a special sentence (__your dedication__) will be entered.
+
+It could be a photo of your pet, someone you care about, some place you love... By this way, your photo will be algorithmically set in stone and spread all over the world, everywhere PlantUML is installed, even if no one but you knows about it...
+
+There are two kinds of Dedication:
+
+* __Public__: the special sentence is publicly written in the code of PlantUML, so someone searching into the code will be able to find it and then see your photo.
+* __Private__: only https://en.wikipedia.org/wiki/SHA-2[SHA-512 signature] of the special sentence is in the source code (as the encrypted photo). **No one can guess your special sentence, neither see your photo,** since it's encrypted using the sentence itself.
+
+
+
+== Example
+
+We have made a demo with the special sentence __Write your own dedication!__
+
+It works in **each and every** deployed instance of PlantUML over the world !
+
+
+@startuml
+Write your own dedication!
+@enduml
+
+
+
+== Why?
+
+To support such a service, https://www.patreon.com/bePatron?patAmt=1&u=527450&rid=548118[we suggest a contribution]
+of **$5** per month.
+
+**So why would people make dedication?**
+* Because there might be some message that you want to be set in stone for eternity
+* Because it's fun to be able to generate a beautiful image from a simple sentence
+* Because it helps PlantUML to grow!
+
+
+== How?
+
+Just send mailto:plantuml@gmail.com?subject=Add%20my%20dedication[a mail to plantuml@gmail.com] with
+__"Add my dedication"__ as subject and that lists:
+* Your sentence,
+* Your photo or picture,
+* Whether you want a public or a private dedication.
+
+We will build a beta version of PlantUML with your dedication and then:
+* Send it to you,
+* Install it http://plantuml.com/plantuml[online on the PlantUML Web Server]
+So that you can check the result.
+**This is a free trial offer!**
+
+__We hope that you will appreciate the result!__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/deployment-diagram-issues.adoc b/plantuml-docs/docs_from_alphadoc/deployment-diagram-issues.adoc
new file mode 100644
index 00000000..d9ff4a8e
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/deployment-diagram-issues.adoc
@@ -0,0 +1,251 @@
+== Deployment (Component, Use-case, and Deployment) Diagram issues (deployment-diagram-issues)
+
+This page lists issues on:
+* link::deployment-diagram[deployment-diagram];
+* link::component-diagram[component-diagram];
+* link::use-case-diagram[use-case-diagram].
+
+
+== Issues with hexagon
+
+* https://forum.plantuml.net/13027/[QA-13027/link-arrow-does-not-lead-to-the-hexagon]
+
+@startuml
+hexagon H1 {
+node n1
+}
+[C]
+
+C --> H1: doesn't lead\n to hexagon H1
+@enduml
+
+
+* https://forum.plantuml.net/12835[QA-12835/accept-hexagon-element-without-overflow-deployment-diagram]
+
+@startuml
+hexagon h {
+node #pink "VeryLOOOOOOOOOOOOOOOOOOOg\nVeryLOOOOOOOOOOOOOOOOOOOg\nVeryLOOOOOOOOOOOOOOOOOOOg\nVeryLOOOOOOOOOOOOOOOOOOOg\nVeryLOOOOOOOOOOOOOOOOOOOg"
+}
+footer Observed on : 1.2021.01beta3\n(current version: %version())
+@enduml
+
+
+* https://forum.plantuml.net/13021/accept-hexagon-with-smetana-deployment-diagram[QA-13021/accept-hexagon-with-smetana-deployment-diagram]
+
+@startuml
+!pragma layout smetana
+hexagon h [
+more
+and
+more
+combinatorial
+]
+@enduml
+
+
+* https://forum.plantuml.net/13261/accept-hexagon-on-style-deployment-diagram[QA-13261/accept-hexagon-on-style-deployment-diagram] [fixed on V1.2022.01+]
+
+@startuml
+
+hexagon hexagon
+hexagon h_OK {
+}
+hexagon h_KO {
+node n
+}
+@enduml
+
+
+
+== Line thickness issue (from ~V1.2022.2) [fixed on 1.2022.6betaX]
+
+
+@startuml
+title Bracketed line thickness
+node foo
+foo --> bar : โ
+foo -[thickness=1]-> bar1 : [1]
+foo -[thickness=2]-> bar2 : [2]
+foo -[thickness=4]-> bar3 : [4]
+foo -[thickness=8]-> bar4 : [8]
+foo -[thickness=16]-> bar5 : [16]
+@enduml
+
+
+__[Adapted from https://forum.plantuml.net/4949[QA-4949]]__
+
+
+== The issues below are fixed
+
+The issues below are fixed with:
+* https://forum.plantuml.net/15386/allow-new-styling-for-nested-package[QA-15386]
+
+
+== Style on no empty nested element
+
+* https://forum.plantuml.net/14189/using-skinparam-fontproperties-groups-component-diagrams[QA-14189]
+* https://forum.plantuml.net/14179/style-manage-style-dashed-dotted-nested-element-deployment[QA-14179]
+
+@startuml
+
+package package
+package package_empty_nested {
+}
+package package_nested {
+node n
+}
+node node
+node node_empty_nested {
+}
+node node_nested {
+node m
+}
+footer \nObserved on : 1.2021.9beta2\n(current version: %version())
+@enduml
+
+
+
+@startuml
+
+artifact e1 as "artifact" {
+file f1
+}
+card e2 as "card" {
+file f2
+}
+cloud e3 as "cloud" {
+file f3
+}
+component e4 as "component" {
+file f4
+}
+database e5 as "database" {
+file f5
+}
+file e6 as "file" {
+file f6
+}
+folder e7 as "folder" {
+file f7
+}
+frame e8 as "frame" {
+file f8
+}
+hexagon e9 as "hexagon" {
+file f9
+}
+node e10 as "node" {
+file f10
+}
+package e11 as "package" {
+file f11
+}
+queue e12 as "queue" {
+file f12
+}
+rectangle e13 as "rectangle" {
+file f13
+}
+stack e14 as "stack" {
+file f14
+}
+storage e15 as "storage" {
+file f15
+}
+@enduml
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/deployment-diagram.adoc b/plantuml-docs/docs_from_alphadoc/deployment-diagram.adoc
new file mode 100644
index 00000000..e89e6e25
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/deployment-diagram.adoc
@@ -0,0 +1,1763 @@
+== Deployment Diagram
+
+
+
+
+== Declaring element
+
+
+@startuml
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+
+You can optionaly put text using bracket `+[]+` for a long description.
+
+
+@startuml
+folder folder [
+This is a folder
+----
+You can use separator
+====
+of different kind
+....
+and style
+]
+
+node node [
+This is a node
+----
+You can use separator
+====
+of different kind
+....
+and style
+]
+
+database database [
+This is a database
+----
+You can use separator
+====
+of different kind
+....
+and style
+]
+
+usecase usecase [
+This is a usecase
+----
+You can use separator
+====
+of different kind
+....
+and style
+]
+
+card card [
+This is a card
+----
+You can use separator
+====
+of different kind
+....
+and style
+(add from V1.2020.7)
+]
+@enduml
+
+
+
+== Declaring element (using short form)
+
+We can declare element using some short forms.
+
+|===
+| Long form Keyword | Short form Keyword | Long form example | Short form example | Ref.
+
+| `+actor+`
+| `+:+` __a__ `+:+`
+| `+actor actor1+`
+| `+:actor2:+`
+| https://plantuml.com/use-case-diagram#d9b36998c97be687[Actors]
+
+| `+component+`
+| `+[+` __c__ `+]+`
+| `+component component1+`
+| `+[component2]+`
+| https://plantuml.com/component-diagram#05bbb43b3d923283[Components]
+
+| `+interface+`
+| `+()+` __i__
+| `+interface interface1+`
+| `+() "interface2"+`
+| https://plantuml.com/component-diagram#756640f0aea5f5be[Interfaces]
+
+| `+usecase+`
+| `+(+` __u__ `+)+`
+| `+usecase usecase1+`
+| `+(usecase2)+`
+| https://plantuml.com/use-case-diagram#5cb617d22da857ea[Usecases]
+
+|===
+
+=== Actor
+
+@startuml
+
+actor actor1
+:actor2:
+
+@enduml
+
+
+**NB**: __There is an old syntax for actor with guillemet which is now deprecated and will be removed some days. Please do not use in your diagram.__
+
+=== Component
+
+@startuml
+
+component component1
+[component2]
+
+@enduml
+
+
+=== Interface
+
+@startuml
+
+interface interface1
+() "interface2"
+
+label "//interface example//"
+@enduml
+
+
+=== Usecase
+
+@startuml
+
+usecase usecase1
+(usecase2)
+
+@enduml
+
+
+
+== Linking or arrow
+
+You can create simple links between elements with or without labels:
+
+@startuml
+
+node node1
+node node2
+node node3
+node node4
+node node5
+node1 -- node2 : label1
+node1 .. node3 : label2
+node1 ~~ node4 : label3
+node1 == node5
+
+@enduml
+
+
+It is possible to use several types of links:
+
+
+@startuml
+
+artifact artifact1
+artifact artifact2
+artifact artifact3
+artifact artifact4
+artifact artifact5
+artifact artifact6
+artifact artifact7
+artifact artifact8
+artifact artifact9
+artifact artifact10
+artifact1 --> artifact2
+artifact1 --* artifact3
+artifact1 --o artifact4
+artifact1 --+ artifact5
+artifact1 --# artifact6
+artifact1 -->> artifact7
+artifact1 --0 artifact8
+artifact1 --^ artifact9
+artifact1 --(0 artifact10
+
+@enduml
+
+
+You can also have the following types:
+
+
+@startuml
+
+cloud cloud1
+cloud cloud2
+cloud cloud3
+cloud cloud4
+cloud cloud5
+cloud1 -0- cloud2
+cloud1 -0)- cloud3
+cloud1 -(0- cloud4
+cloud1 -(0)- cloud5
+
+@enduml
+
+
+or another example:
+
+@startuml
+actor foo1
+actor foo2
+foo1 <-0-> foo2
+foo1 <-(0)-> foo2
+
+(ac1) -le(0)-> left1
+ac1 -ri(0)-> right1
+ac1 .up(0).> up1
+ac1 ~up(0)~> up2
+ac1 -do(0)-> down1
+ac1 -do(0)-> down2
+
+actor1 -0)- actor2
+
+component comp1
+component comp2
+comp1 *-0)-+ comp2
+[comp3] <-->> [comp4]
+
+boundary b1
+control c1
+b1 -(0)- c1
+
+component comp1
+interface interf1
+comp1 #~~( interf1
+
+:mode1actor: -0)- fooa1
+:mode1actorl: -ri0)- foo1l
+
+[component1] 0)-(0-(0 [componentC]
+() component3 )-0-(0 "foo" [componentC]
+
+[aze1] #-->> [aze2]
+@enduml
+
+__[Ref. https://forum.plantuml.net/547/composite-structure-diagrams?show=554#a554[QA-547] and https://forum.plantuml.net/1736/are-partial-lollipop-for-component-diagrams-supported?show=1737#a1737[QA-1736]]__
+
+โ See all type on **Appendix**.
+
+
+== Bracketed arrow style
+
+__Similar as link::class-diagram#chjviqthvhkikfmwbahk[Bracketed **class** relations (linking or arrow) style]__
+
+=== Line style
+It's also possible to have explicitly `+bold+`, `+dashed+`, `+dotted+`, `+hidden+` or `+plain+` arrows: +
+
+* without label
+
+
+@startuml
+node foo
+title Bracketed line style without label
+foo --> bar
+foo -[bold]-> bar1
+foo -[dashed]-> bar2
+foo -[dotted]-> bar3
+foo -[hidden]-> bar4
+foo -[plain]-> bar5
+@enduml
+
+
+* with label
+
+
+@startuml
+title Bracketed line style with label
+node foo
+foo --> bar : โ
+foo -[bold]-> bar1 : [bold]
+foo -[dashed]-> bar2 : [dashed]
+foo -[dotted]-> bar3 : [dotted]
+foo -[hidden]-> bar4 : [hidden]
+foo -[plain]-> bar5 : [plain]
+@enduml
+
+
+__[Adapted from https://forum.plantuml.net/4181/how-change-width-line-in-a-relationship-between-two-classes?show=4232#a4232[QA-4181]]__
+
+=== Line color
+
+
+@startuml
+title Bracketed line color
+node foo
+foo --> bar
+foo -[#red]-> bar1 : [#red]
+foo -[#green]-> bar2 : [#green]
+foo -[#blue]-> bar3 : [#blue]
+foo -[#blue;#yellow;#green]-> bar4
+@enduml
+
+
+=== Line thickness
+
+
+@startuml
+title Bracketed line thickness
+node foo
+foo --> bar : โ
+foo -[thickness=1]-> bar1 : [1]
+foo -[thickness=2]-> bar2 : [2]
+foo -[thickness=4]-> bar3 : [4]
+foo -[thickness=8]-> bar4 : [8]
+foo -[thickness=16]-> bar5 : [16]
+@enduml
+
+
+__[Adapted from https://forum.plantuml.net/4949[QA-4949]]__
+
+=== Mix
+
+@startuml
+title Bracketed line style mix
+node foo
+foo --> bar : โ
+foo -[#red,thickness=1]-> bar1 : [#red,1]
+foo -[#red,dashed,thickness=2]-> bar2 : [#red,dashed,2]
+foo -[#green,dashed,thickness=4]-> bar3 : [#green,dashed,4]
+foo -[#blue,dotted,thickness=8]-> bar4 : [blue,dotted,8]
+foo -[#blue,plain,thickness=16]-> bar5 : [blue,plain,16]
+foo -[#blue;#green,dashed,thickness=4]-> bar6 : [blue;green,dashed,4]
+@enduml
+
+
+
+== Change arrow color and style (inline style)
+
+You can change the link::color[color] or style of individual arrows using the inline following notation:
+
+* `+#color;line.[bold|dashed|dotted];text:color+`
+
+
+@startuml
+node foo
+foo --> bar : normal
+foo --> bar1 #line:red;line.bold;text:red : red bold
+foo --> bar2 #green;line.dashed;text:green : green dashed
+foo --> bar3 #blue;line.dotted;text:blue : blue dotted
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/3770[QA-3770] and https://forum.plantuml.net/3816[QA-3816]]__
+__[See similar feature on link::class-diagram#b5b0e4228f2e5022[class diagram]]__
+
+
+== Change element color and style (inline style)
+
+You can change the link::color[color] or style of individual element using the following notation:
+* `+#[color|back:color];line:color;line.[bold|dashed|dotted];text:color+`
+
+
+@startuml
+agent a
+cloud c #pink;line:red;line.bold;text:red
+file f #palegreen;line:green;line.dashed;text:green
+node n #aliceblue;line:blue;line.dotted;text:blue
+@enduml
+
+
+
+@startuml
+agent a
+cloud c #pink;line:red;line.bold;text:red [
+c
+cloud description
+]
+file f #palegreen;line:green;line.dashed;text:green {
+[c1]
+[c2]
+}
+frame frame {
+node n #aliceblue;line:blue;line.dotted;text:blue
+}
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/6852[QA-6852]]__
+
+
+== Nestable elements
+
+Here are the nestable elements:
+
+
+@startuml
+artifact artifact {
+}
+card card {
+}
+cloud cloud {
+}
+component component {
+}
+database database {
+}
+file file {
+}
+folder folder {
+}
+frame frame {
+}
+hexagon hexagon {
+}
+node node {
+}
+package package {
+}
+queue queue {
+}
+rectangle rectangle {
+}
+stack stack {
+}
+storage storage {
+}
+@enduml
+
+
+
+== Packages and nested elements
+
+=== Example with one level
+
+@startuml
+artifact artifactVeryLOOOOOOOOOOOOOOOOOOOg as "artifact" {
+file f1
+}
+card cardVeryLOOOOOOOOOOOOOOOOOOOg as "card" {
+file f2
+}
+cloud cloudVeryLOOOOOOOOOOOOOOOOOOOg as "cloud" {
+file f3
+}
+component componentVeryLOOOOOOOOOOOOOOOOOOOg as "component" {
+file f4
+}
+database databaseVeryLOOOOOOOOOOOOOOOOOOOg as "database" {
+file f5
+}
+file fileVeryLOOOOOOOOOOOOOOOOOOOg as "file" {
+file f6
+}
+folder folderVeryLOOOOOOOOOOOOOOOOOOOg as "folder" {
+file f7
+}
+frame frameVeryLOOOOOOOOOOOOOOOOOOOg as "frame" {
+file f8
+}
+hexagon hexagonVeryLOOOOOOOOOOOOOOOOOOOg as "hexagon" {
+file f9
+}
+node nodeVeryLOOOOOOOOOOOOOOOOOOOg as "node" {
+file f10
+}
+package packageVeryLOOOOOOOOOOOOOOOOOOOg as "package" {
+file f11
+}
+queue queueVeryLOOOOOOOOOOOOOOOOOOOg as "queue" {
+file f12
+}
+rectangle rectangleVeryLOOOOOOOOOOOOOOOOOOOg as "rectangle" {
+file f13
+}
+stack stackVeryLOOOOOOOOOOOOOOOOOOOg as "stack" {
+file f14
+}
+storage storageVeryLOOOOOOOOOOOOOOOOOOOg as "storage" {
+file f15
+}
+@enduml
+
+
+
+=== Other example
+
+
+@startuml
+artifact Foo1 {
+ folder Foo2
+}
+
+folder Foo3 {
+ artifact Foo4
+}
+
+frame Foo5 {
+ database Foo6
+}
+
+cloud vpc {
+ node ec2 {
+ stack stack
+ }
+}
+
+@enduml
+
+
+
+@startuml
+node Foo1 {
+ cloud Foo2
+}
+
+cloud Foo3 {
+ frame Foo4
+}
+
+database Foo5 {
+ storage Foo6
+}
+
+storage Foo7 {
+ storage Foo8
+}
+@enduml
+
+
+=== Full nesting
+
+Here is all the nested elements:
+* by alphabetical order:
+
+@startuml
+artifact artifact {
+card card {
+cloud cloud {
+component component {
+database database {
+file file {
+folder folder {
+frame frame {
+hexagon hexagon {
+node node {
+package package {
+queue queue {
+rectangle rectangle {
+stack stack {
+storage storage {
+}
+}
+}
+}
+}
+}
+}
+}
+}
+}
+}
+}
+}
+}
+}
+@enduml
+
+
+* or reverse alphabetical order
+
+@startuml
+storage storage {
+stack stack {
+rectangle rectangle {
+queue queue {
+package package {
+node node {
+hexagon hexagon {
+frame frame {
+folder folder {
+file file {
+database database {
+component component {
+cloud cloud {
+card card {
+artifact artifact {
+}
+}
+}
+}
+}
+}
+}
+}
+}
+}
+}
+}
+}
+}
+}
+@enduml
+
+
+
+== Alias
+
+=== Simple alias with `+as+`
+
+
+@startuml
+node Node1 as n1
+node "Node 2" as n2
+file f1 as "File 1"
+cloud c1 as "this
+is
+a
+cloud"
+cloud c2 [this
+is
+another
+cloud]
+
+n1 -> n2
+n1 --> f1
+f1 -> c1
+c1 -> c2
+@enduml
+
+
+=== Examples of long alias
+
+
+@startuml
+actor "actor" as actorVeryLOOOOOOOOOOOOOOOOOOOg
+agent "agent" as agentVeryLOOOOOOOOOOOOOOOOOOOg
+artifact "artifact" as artifactVeryLOOOOOOOOOOOOOOOOOOOg
+boundary "boundary" as boundaryVeryLOOOOOOOOOOOOOOOOOOOg
+card "card" as cardVeryLOOOOOOOOOOOOOOOOOOOg
+cloud "cloud" as cloudVeryLOOOOOOOOOOOOOOOOOOOg
+collections "collections" as collectionsVeryLOOOOOOOOOOOOOOOOOOOg
+component "component" as componentVeryLOOOOOOOOOOOOOOOOOOOg
+control "control" as controlVeryLOOOOOOOOOOOOOOOOOOOg
+database "database" as databaseVeryLOOOOOOOOOOOOOOOOOOOg
+entity "entity" as entityVeryLOOOOOOOOOOOOOOOOOOOg
+file "file" as fileVeryLOOOOOOOOOOOOOOOOOOOg
+folder "folder" as folderVeryLOOOOOOOOOOOOOOOOOOOg
+frame "frame" as frameVeryLOOOOOOOOOOOOOOOOOOOg
+hexagon "hexagon" as hexagonVeryLOOOOOOOOOOOOOOOOOOOg
+interface "interface" as interfaceVeryLOOOOOOOOOOOOOOOOOOOg
+label "label" as labelVeryLOOOOOOOOOOOOOOOOOOOg
+node "node" as nodeVeryLOOOOOOOOOOOOOOOOOOOg
+package "package" as packageVeryLOOOOOOOOOOOOOOOOOOOg
+person "person" as personVeryLOOOOOOOOOOOOOOOOOOOg
+queue "queue" as queueVeryLOOOOOOOOOOOOOOOOOOOg
+stack "stack" as stackVeryLOOOOOOOOOOOOOOOOOOOg
+rectangle "rectangle" as rectangleVeryLOOOOOOOOOOOOOOOOOOOg
+storage "storage" as storageVeryLOOOOOOOOOOOOOOOOOOOg
+usecase "usecase" as usecaseVeryLOOOOOOOOOOOOOOOOOOOg
+@enduml
+
+
+
+@startuml
+actor actorVeryLOOOOOOOOOOOOOOOOOOOg as "actor"
+agent agentVeryLOOOOOOOOOOOOOOOOOOOg as "agent"
+artifact artifactVeryLOOOOOOOOOOOOOOOOOOOg as "artifact"
+boundary boundaryVeryLOOOOOOOOOOOOOOOOOOOg as "boundary"
+card cardVeryLOOOOOOOOOOOOOOOOOOOg as "card"
+cloud cloudVeryLOOOOOOOOOOOOOOOOOOOg as "cloud"
+collections collectionsVeryLOOOOOOOOOOOOOOOOOOOg as "collections"
+component componentVeryLOOOOOOOOOOOOOOOOOOOg as "component"
+control controlVeryLOOOOOOOOOOOOOOOOOOOg as "control"
+database databaseVeryLOOOOOOOOOOOOOOOOOOOg as "database"
+entity entityVeryLOOOOOOOOOOOOOOOOOOOg as "entity"
+file fileVeryLOOOOOOOOOOOOOOOOOOOg as "file"
+folder folderVeryLOOOOOOOOOOOOOOOOOOOg as "folder"
+frame frameVeryLOOOOOOOOOOOOOOOOOOOg as "frame"
+hexagon hexagonVeryLOOOOOOOOOOOOOOOOOOOg as "hexagon"
+interface interfaceVeryLOOOOOOOOOOOOOOOOOOOg as "interface"
+label labelVeryLOOOOOOOOOOOOOOOOOOOg as "label"
+node nodeVeryLOOOOOOOOOOOOOOOOOOOg as "node"
+package packageVeryLOOOOOOOOOOOOOOOOOOOg as "package"
+person personVeryLOOOOOOOOOOOOOOOOOOOg as "person"
+queue queueVeryLOOOOOOOOOOOOOOOOOOOg as "queue"
+stack stackVeryLOOOOOOOOOOOOOOOOOOOg as "stack"
+rectangle rectangleVeryLOOOOOOOOOOOOOOOOOOOg as "rectangle"
+storage storageVeryLOOOOOOOOOOOOOOOOOOOg as "storage"
+usecase usecaseVeryLOOOOOOOOOOOOOOOOOOOg as "usecase"
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/12082[QA-12082]]__
+
+
+== Round corner
+
+@startuml
+skinparam rectangle {
+ roundCorner<> 25
+}
+
+rectangle "Concept Model" <> {
+rectangle "Example 1" <> as ex1
+rectangle "Another rectangle"
+}
+@enduml
+
+
+
+
+
+
+== Specific SkinParameter
+
+=== roundCorner
+
+@startuml
+skinparam roundCorner 15
+actor actor
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/5299[QA-5299], https://forum.plantuml.net/6915[QA-6915], https://forum.plantuml.net/11943[QA-11943]]__
+
+
+== Appendix: All type of arrow line
+
+
+@startuml
+left to right direction
+skinparam nodesep 5
+
+f3 ~~ b3 : ""~~""\n//dotted//
+f2 .. b2 : ""..""\n//dashed//
+f1 == b1 : ""==""\n//bold//
+f0 -- b0 : ""--""\n//plain//
+@enduml
+
+
+
+== Appendix: All type of arrow head or '0' arrow
+
+=== Type of arrow head
+
+@startuml
+left to right direction
+skinparam nodesep 5
+
+f13 --0 b13 : ""--0""
+f12 --@ b12 : ""--@""
+f11 --:|> b11 : ""--:|>""
+f10 --||> b10 : ""--||>""
+f9 --|> b9 : ""--|>""
+f8 --^ b8 : ""--^ ""
+f7 --\\ b7 : ""--\\\\""
+f6 --# b6 : ""--# ""
+f5 --+ b5 : ""--+ ""
+f4 --o b4 : ""--o ""
+f3 --* b3 : ""--* ""
+f2 -->> b2 : ""-->>""
+f1 --> b1 : ""--> ""
+f0 -- b0 : ""-- ""
+@enduml
+
+
+=== Type of '0' arrow or circle arrow
+
+@startuml
+left to right direction
+skinparam nodesep 5
+
+f10 0--0 b10 : "" 0--0 ""
+f9 )--( b9 : "" )--( ""
+f8 0)--(0 b8 : "" 0)--(0""
+f7 0)-- b7 : "" 0)-- ""
+f6 -0)- b6 : "" -0)- ""
+f5 -(0)- b5 : "" -(0)-""
+f4 -(0- b4 : "" -(0- ""
+f3 --(0 b3 : "" --(0 ""
+f2 --( b2 : "" --( ""
+f1 --0 b1 : "" --0 ""
+@enduml
+
+
+
+== Appendix: Test of inline style on all element
+
+=== Simple element
+
+@startuml
+actor actor #aliceblue;line:blue;line.dotted;text:blue
+actor/ "actor/" #aliceblue;line:blue;line.dotted;text:blue
+agent agent #aliceblue;line:blue;line.dotted;text:blue
+artifact artifact #aliceblue;line:blue;line.dotted;text:blue
+boundary boundary #aliceblue;line:blue;line.dotted;text:blue
+card card #aliceblue;line:blue;line.dotted;text:blue
+circle circle #aliceblue;line:blue;line.dotted;text:blue
+cloud cloud #aliceblue;line:blue;line.dotted;text:blue
+collections collections #aliceblue;line:blue;line.dotted;text:blue
+component component #aliceblue;line:blue;line.dotted;text:blue
+control control #aliceblue;line:blue;line.dotted;text:blue
+database database #aliceblue;line:blue;line.dotted;text:blue
+entity entity #aliceblue;line:blue;line.dotted;text:blue
+file file #aliceblue;line:blue;line.dotted;text:blue
+folder folder #aliceblue;line:blue;line.dotted;text:blue
+frame frame #aliceblue;line:blue;line.dotted;text:blue
+hexagon hexagon #aliceblue;line:blue;line.dotted;text:blue
+interface interface #aliceblue;line:blue;line.dotted;text:blue
+label label #aliceblue;line:blue;line.dotted;text:blue
+node node #aliceblue;line:blue;line.dotted;text:blue
+package package #aliceblue;line:blue;line.dotted;text:blue
+person person #aliceblue;line:blue;line.dotted;text:blue
+queue queue #aliceblue;line:blue;line.dotted;text:blue
+rectangle rectangle #aliceblue;line:blue;line.dotted;text:blue
+stack stack #aliceblue;line:blue;line.dotted;text:blue
+storage storage #aliceblue;line:blue;line.dotted;text:blue
+usecase usecase #aliceblue;line:blue;line.dotted;text:blue
+usecase/ "usecase/" #aliceblue;line:blue;line.dotted;text:blue
+@enduml
+
+
+=== Nested element
+
+==== Without sub-element
+
+@startuml
+artifact artifact #aliceblue;line:blue;line.dotted;text:blue {
+}
+card card #aliceblue;line:blue;line.dotted;text:blue {
+}
+cloud cloud #aliceblue;line:blue;line.dotted;text:blue {
+}
+component component #aliceblue;line:blue;line.dotted;text:blue {
+}
+database database #aliceblue;line:blue;line.dotted;text:blue {
+}
+file file #aliceblue;line:blue;line.dotted;text:blue {
+}
+folder folder #aliceblue;line:blue;line.dotted;text:blue {
+}
+frame frame #aliceblue;line:blue;line.dotted;text:blue {
+}
+hexagon hexagon #aliceblue;line:blue;line.dotted;text:blue {
+}
+node node #aliceblue;line:blue;line.dotted;text:blue {
+}
+package package #aliceblue;line:blue;line.dotted;text:blue {
+}
+queue queue #aliceblue;line:blue;line.dotted;text:blue {
+}
+rectangle rectangle #aliceblue;line:blue;line.dotted;text:blue {
+}
+stack stack #aliceblue;line:blue;line.dotted;text:blue {
+}
+storage storage #aliceblue;line:blue;line.dotted;text:blue {
+}
+@enduml
+
+
+
+==== With sub-element
+
+@startuml
+artifact artifactVeryLOOOOOOOOOOOOOOOOOOOg as "artifact" #aliceblue;line:blue;line.dotted;text:blue {
+file f1
+}
+card cardVeryLOOOOOOOOOOOOOOOOOOOg as "card" #aliceblue;line:blue;line.dotted;text:blue {
+file f2
+}
+cloud cloudVeryLOOOOOOOOOOOOOOOOOOOg as "cloud" #aliceblue;line:blue;line.dotted;text:blue {
+file f3
+}
+component componentVeryLOOOOOOOOOOOOOOOOOOOg as "component" #aliceblue;line:blue;line.dotted;text:blue {
+file f4
+}
+database databaseVeryLOOOOOOOOOOOOOOOOOOOg as "database" #aliceblue;line:blue;line.dotted;text:blue {
+file f5
+}
+file fileVeryLOOOOOOOOOOOOOOOOOOOg as "file" #aliceblue;line:blue;line.dotted;text:blue {
+file f6
+}
+folder folderVeryLOOOOOOOOOOOOOOOOOOOg as "folder" #aliceblue;line:blue;line.dotted;text:blue {
+file f7
+}
+frame frameVeryLOOOOOOOOOOOOOOOOOOOg as "frame" #aliceblue;line:blue;line.dotted;text:blue {
+file f8
+}
+hexagon hexagonVeryLOOOOOOOOOOOOOOOOOOOg as "hexagon" #aliceblue;line:blue;line.dotted;text:blue {
+file f9
+}
+node nodeVeryLOOOOOOOOOOOOOOOOOOOg as "node" #aliceblue;line:blue;line.dotted;text:blue {
+file f10
+}
+package packageVeryLOOOOOOOOOOOOOOOOOOOg as "package" #aliceblue;line:blue;line.dotted;text:blue {
+file f11
+}
+queue queueVeryLOOOOOOOOOOOOOOOOOOOg as "queue" #aliceblue;line:blue;line.dotted;text:blue {
+file f12
+}
+rectangle rectangleVeryLOOOOOOOOOOOOOOOOOOOg as "rectangle" #aliceblue;line:blue;line.dotted;text:blue {
+file f13
+}
+stack stackVeryLOOOOOOOOOOOOOOOOOOOg as "stack" #aliceblue;line:blue;line.dotted;text:blue {
+file f14
+}
+storage storageVeryLOOOOOOOOOOOOOOOOOOOg as "storage" #aliceblue;line:blue;line.dotted;text:blue {
+file f15
+}
+@enduml
+
+
+
+== Appendix: Test of style on all element
+
+=== Simple element
+==== Global style (on componentDiagram)
+
+@startuml
+
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+
+==== Style for each element
+
+@startuml
+
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/13261/[QA-13261]]__
+
+=== Nested element (without level)
+==== Global style (on componentDiagram)
+
+@startuml
+
+artifact artifact {
+}
+card card {
+}
+cloud cloud {
+}
+component component {
+}
+database database {
+}
+file file {
+}
+folder folder {
+}
+frame frame {
+}
+hexagon hexagon {
+}
+node node {
+}
+package package {
+}
+queue queue {
+}
+rectangle rectangle {
+}
+stack stack {
+}
+storage storage {
+}
+@enduml
+
+
+==== Style for each nested element
+
+@startuml
+
+artifact artifact {
+}
+card card {
+}
+cloud cloud {
+}
+component component {
+}
+database database {
+}
+file file {
+}
+folder folder {
+}
+frame frame {
+}
+hexagon hexagon {
+}
+node node {
+}
+package package {
+}
+queue queue {
+}
+rectangle rectangle {
+}
+stack stack {
+}
+storage storage {
+}
+@enduml
+
+
+=== Nested element (with one level)
+==== Global style (on componentDiagram)
+
+@startuml
+
+artifact e1 as "artifact" {
+file f1
+}
+card e2 as "card" {
+file f2
+}
+cloud e3 as "cloud" {
+file f3
+}
+component e4 as "component" {
+file f4
+}
+database e5 as "database" {
+file f5
+}
+file e6 as "file" {
+file f6
+}
+folder e7 as "folder" {
+file f7
+}
+frame e8 as "frame" {
+file f8
+}
+hexagon e9 as "hexagon" {
+file f9
+}
+node e10 as "node" {
+file f10
+}
+package e11 as "package" {
+file f11
+}
+queue e12 as "queue" {
+file f12
+}
+rectangle e13 as "rectangle" {
+file f13
+}
+stack e14 as "stack" {
+file f14
+}
+storage e15 as "storage" {
+file f15
+}
+@enduml
+
+
+==== Style for each nested element
+
+@startuml
+
+artifact e1 as "artifact" {
+file f1
+}
+card e2 as "card" {
+file f2
+}
+cloud e3 as "cloud" {
+file f3
+}
+component e4 as "component" {
+file f4
+}
+database e5 as "database" {
+file f5
+}
+file e6 as "file" {
+file f6
+}
+folder e7 as "folder" {
+file f7
+}
+frame e8 as "frame" {
+file f8
+}
+hexagon e9 as "hexagon" {
+file f9
+}
+node e10 as "node" {
+file f10
+}
+package e11 as "package" {
+file f11
+}
+queue e12 as "queue" {
+file f12
+}
+rectangle e13 as "rectangle" {
+file f13
+}
+stack e14 as "stack" {
+file f14
+}
+storage e15 as "storage" {
+file f15
+}
+@enduml
+
+
+
+== Appendix: Test of stereotype with style on all element
+
+=== Simple element
+
+@startuml
+
+actor actor << stereo >>
+actor/ "actor/" << stereo >>
+agent agent << stereo >>
+artifact artifact << stereo >>
+boundary boundary << stereo >>
+card card << stereo >>
+circle circle << stereo >>
+cloud cloud << stereo >>
+collections collections << stereo >>
+component component << stereo >>
+control control << stereo >>
+database database << stereo >>
+entity entity << stereo >>
+file file << stereo >>
+folder folder << stereo >>
+frame frame << stereo >>
+hexagon hexagon << stereo >>
+interface interface << stereo >>
+label label << stereo >>
+node node << stereo >>
+package package << stereo >>
+person person << stereo >>
+queue queue << stereo >>
+rectangle rectangle << stereo >>
+stack stack << stereo >>
+storage storage << stereo >>
+usecase usecase << stereo >>
+usecase/ "usecase/" << stereo >>
+@enduml
+
+
+
+== Display JSON Data on Deployment diagram
+
+=== Simple example
+
+@startuml
+allowmixing
+
+component Component
+actor Actor
+usecase Usecase
+() Interface
+node Node
+cloud Cloud
+
+json JSON {
+ "fruit":"Apple",
+ "size":"Large",
+ "color": ["Red", "Green"]
+}
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/15481/possible-link-elements-from-two-jsons-with-both-jsons-embeded?show=15567#c15567[QA-15481]]__
+
+For another example, see on link::json#2fyxla9p9ob6l3t3tjre[JSON page].
+
+
+== Mixing Deployment (Usecase, Component, Deployment) element within a Class or Object diagram
+
+In order to add a Deployment element or a State element within a Class or Object diagram, you can use the `+allowmixing+` or `+allow_mixing+` directive.
+
+=== Mixing all elements
+
+@startuml
+
+allowmixing
+
+skinparam nodesep 10
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+exception exception
+interface interface
+metaclass metaclass
+protocol protocol
+stereotype stereotype
+struct struct
+object object
+map map {
+ key => value
+}
+json JSON {
+ "fruit":"Apple",
+ "size":"Large",
+ "color": ["Red", "Green"]
+}
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+state state
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/2335/use-of-actor-inside-class-diagrams[QA-2335] and https://forum.plantuml.net/5329/language-definition[QA-5329]]__
+
+
+== Port [port, portIn, portOut]
+
+You can added **port** with `+port+`, `+portin+`and `+portout+` keywords.
+
+=== Port
+
+@startuml
+[c]
+node node {
+ port p1
+ port p2
+ port p3
+ file f1
+}
+
+c --> p1
+c --> p2
+c --> p3
+p1 --> f1
+p2 --> f1
+@enduml
+
+
+=== PortIn
+
+@startuml
+[c]
+node node {
+ portin p1
+ portin p2
+ portin p3
+ file f1
+}
+
+c --> p1
+c --> p2
+c --> p3
+p1 --> f1
+p2 --> f1
+@enduml
+
+
+=== PortOut
+
+@startuml
+node node {
+ portout p1
+ portout p2
+ portout p3
+ file f1
+}
+[o]
+p1 --> o
+p2 --> o
+p3 --> o
+f1 --> p1
+@enduml
+
+
+=== Mixing PortIn & PortOut
+
+@startuml
+[i]
+node node {
+ portin p1
+ portin p2
+ portin p3
+ portout po1
+ portout po2
+ portout po3
+ file f1
+}
+[o]
+
+i --> p1
+i --> p2
+i --> p3
+p1 --> f1
+p2 --> f1
+po1 --> o
+po2 --> o
+po3 --> o
+f1 --> po1
+@enduml
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/developers.adoc b/plantuml-docs/docs_from_alphadoc/developers.adoc
new file mode 100644
index 00000000..d6ef2479
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/developers.adoc
@@ -0,0 +1,122 @@
+== Language
+
+Some editors integrate PlantUML Language highlighting for text files (link::emacs[See here]).
+
+Since the PlantUML Language definition is still in progress, when
+new keywords are added in the language, it could be an issue for
+existing products.
+
+An hidden option in the command line allows to turn around this:
+
+----
+java -jar plantuml.jar -language
+----
+
+This command will output to the standard output a description of the
+PlantUML Language, quite easy to parse:
+
+----
+;type
+;10
+abstract
+actor
+class
+component
+enum
+interface
+object
+participant
+state
+usecase
+
+;keyword
+;43
+@enduml
+@startuml
+activate
+alt
+[..]
+up
+
+;preprocessor
+;6
+!define
+!endif
+!ifdef
+!ifndef
+!include
+!undef
+
+;skinparameter
+;145
+ActivityArrowFontColor
+ActivityArrowFontName
+[..]
+UsecaseStereotypeFontSize
+UsecaseStereotypeFontStyle
+
+;color
+;140
+AliceBlue
+AntiqueWhite
+Aqua
+[..]
+WhiteSmoke
+Yellow
+YellowGreen
+
+;EOF
+----
+
+So, if you need to do something related to the PlantUML Language, you
+can parse on the fly this output: your product will always be up-to-date
+when people will upload the last **plantuml.jar** version.
+
+
+
+== Syntax check
+If you have a text, and if you want to know if this text is a valid
+PlantUML description, you can use the following command:
+
+----
+type mytext.txt | java -jar plantuml.jar -syntax
+----
+
+This prints basic information to the standard output. The first
+line contains one of the following words :`+SEQUENCE+`, `+STATE+`,
+`+CLASS+`, `+OBJECT+`, `+ACTIVITY+`, `+USECASE+`,
+`+COMPONENT+`, `+OTHER+` or `+ERROR+`
+
+
++++Examples+++: (@startuml are optional in that usage)
+
+The following text:
+----
+Bob -> Alice : hello
+----
+
+will output:
+
+----
+SEQUENCE
+(2 participants)
+----
+
+If there is an error in the text, the line number and the description of
+the error is printed:
+
+----
+actor Bob
+actor Bob
+Bob -> Alice : hello
+----
+
+will output:
+----
+ERROR
+2
+Duplicate participant : Bob
+----
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/ditaa.adoc b/plantuml-docs/docs_from_alphadoc/ditaa.adoc
new file mode 100644
index 00000000..5200fc5f
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/ditaa.adoc
@@ -0,0 +1,132 @@
+== Generalisation
+
+**PlantUML** now can generate diagrams other than UML. In such cases the usual `+@startuml+` does not make sense anymore. So now we allow diagrams start with `+@startXYZ+` and finish with `+@endXYZ+`, where `+XYZ+` can change with the type of diagram and can be any characters (including spaces).
+
+> This means that plugin developers are encouraged to change their code to recognize `+@start+` instead of `+@startuml+`.
+
+DITAA diagrams are usually formatted as `+@startditaa...@endditaa+`.
+
+
+== Ditaa
+
+http://ditaa.sourceforge.net[Ditaa __(DIagrams Through Ascii Art)__] is an Open Source project that allows to generate general diagrams from a text descriptions. The idea is close to **PlantUML**, and it may be useful for documentation to generate other diagrams than UML.
+
+So last version of **PlantUML** allows this :
+
+
+@startuml
+ditaa
++--------+ +-------+ +-------+
+| +---+ ditaa +--> | |
+| Text | +-------+ |diagram|
+|Document| |!magic!| | |
+| {d}| | | | |
++---+----+ +-------+ +-------+
+ : ^
+ | Lots of work |
+ +-------------------------+
+@enduml
+
+
+You will find the complete documentation about **ditaa** on:
+* http://ditaa.sourceforge.net[ditaa.sourceforge.net]
+* https://github.com/stathissideris/ditaa[github.com/stathissideris/ditaa]
+
+If your plugin does not support `+@startditaa+` yet, a __temporary__ feature has been set up : it is also possible to use http://ditaa.sourceforge.net[Ditaa] with `+@startuml+` by using `+ditaa+` keyword on the very first line of your description.
+
+โ On PlantUML, only **PNG** generation is supported.
+
+
+== Option supported by PlantUML
+
+You can also use some option, after the `+@startditaa+` or `+ditaa+` keyword:
+
+* `+-E+` or `+--no-separation+` to remove separator
+* `+-S+` or `+--no-shadows+` to remove shadow
+* `+scale=+` to scale up or down the diagram
+
+=== Without option
+
+@startditaa
++---------+ /--------\ +-------+
+| cBLU +--+cAAA +---+Version|
+| | | Data | | V3 |
+| +----+ | Base | |cRED{d}|
+| |cPNK| | {s}| +-------+
+| | | \---+----/
++----+----+
+@endditaa
+
+
+=== Remove separator
+
+@startditaa -E
++---------+ /--------\ +-------+
+| cBLU +--+cAAA +---+Version|
+| | | Data | | V3 |
+| +----+ | Base | |cRED{d}|
+| |cPNK| | {s}| +-------+
+| | | \---+----/
++----+----+
+@endditaa
+
+
+=== Remove shadow or scale diagram
+
+@startuml
+ditaa(--no-shadows, scale=0.7)
++---------+ /--------\ +-------+
+| cBLU +--+cAAA +---+Version|
+| | | Data | | V3 |
+| +----+ | Base | |cRED{d}|
+| |cPNK| | {s}| +-------+
+| | | \---+----/
++----+----+
+@enduml
+
+
+
+== Tags
+
+|===
+| Tag | Description
+
+| {c}
+| Choice or Decision
+
+| {d}
+| Document - Symbol representing a document
+
+| {io}
+| Input/Output - Symbol representing input/output
+
+| {mo}
+| Manual operation
+
+| {o}
+| Ellipse
+
+| {s}
+| Storage - Symbol representing a form of storage, like a database or a hard disk.
+
+| {tr}
+| Trapezoid
+
+|===
+
+
+@startditaa
++------+------+------+------+------+------+------+
+| c {c}|d {d} |io{io}|mo{mo}|o{o} |s{s} |tr{tr}|
++------+------+------+------+------+------+------+
+@endditaa
+
+
+
+== More documentation
+
+You will find the complete documentation about **ditaa** on:
+* http://ditaa.sourceforge.net[ditaa.sourceforge.net]
+* https://github.com/stathissideris/ditaa[github.com/stathissideris/ditaa]
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/doclet.adoc b/plantuml-docs/docs_from_alphadoc/doclet.adoc
new file mode 100644
index 00000000..4e933996
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/doclet.adoc
@@ -0,0 +1,113 @@
+== New Doclet
+A new enhanced doclet (written by Gerald Boersma) is now available.
+
+It has much more option than the legacy previous one.
+
+You will find https://github.com/gboersma/uml-java-doclet[detailed instructions here.]
+
+
+
+
+== UMLDoclet
+An open source doclet is https://github.com/talsma-ict/umldoclet[now available on github.].
+
+
+It's also available in http://repo.maven.apache.org/maven2/nl/talsmasoftware/umldoclet[Maven central for easy inclusion]
+in any java projects.
+
+Usage:
+* Declare the nl.talsmasoftware.umldoclet.UMLDoclet class to be used by javadoc (will by default also delegate to Standard doclet, so all-in-one).
+* All customizable options will become documented on the github page before the 1.0.0 release.
+
+
+
+== Old legacy doclet
+You can generate a PlantUML description for UML-class diagram out of
+Java-source. Only public fields and methods will be exported.
+
+The jar for the doclet is available here: http://sourceforge.net/projects/plantuml/files/plantUmlDoclet.jar/download[plantUmlDoclet.jar]
+
+The association are based only on field declaration and Javadoc-Tags in methods.
+
+There are following Javadoc-Tags to describe associations,
+according to http://www.umlgraph.org[UMLGraph]:
+* **@note**: can be used to add a note to a class
+* **@assoc**: Pattern: - (no spaces)
+* **@navassoc**: Pattern: - (no spaces)
+* **@depend**: Pattern: - (no spaces)
+* **@overrideAssoc**: can be used to mark a field-declaration not to export its association.
+
+For configuration following system.properties can be used:
+* **createPackages**: Default value is `+false+`
+* **showPublicMethods**: Default value is `+true+`
+* **showPublicConstructors**: Default value is `+true+`
+* **showPublicFields**: Default value is `+true+`
+
+
+== Ant-Script example
+
+----
+
+
+
+
+
+
+
+
+
+
+
+
+
+----
+
+
+
+== Image example
+
+image::doclet.png[]
+
+
+
+== Source example
+----
+package demo;
+
+class Controller {}
+class EmbeddedAgent {}
+class PowerManager {}
+
+/**
+* @extends Controller
+* @extends EmbeddedAgent
+* @navassoc - - 1..* PowerManager
+* @note this is a note
+*/
+class SetTopController implements URLStreamHandler {
+public String name;
+
+int authorizationLevel;
+void startUp() {}
+void shutDown() {}
+void connect() {}
+}
+
+/** @depend - friend - SetTopController */
+class ChannelIterator {}
+
+interface URLStreamHandler {
+void OpenConnection();
+void parseURL();
+void setURL();
+void toExternalForm();
+}
+----
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/docutils.adoc b/plantuml-docs/docs_from_alphadoc/docutils.adoc
new file mode 100644
index 00000000..83bf2b95
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/docutils.adoc
@@ -0,0 +1,42 @@
+== Docutils (Install)
+
+http://docutils.sourceforge.net[Docutils] allows to
+conveniently write and generate documents in various output formats (http://docutils.sourceforge.net/sandbox/uml-plantUml/usage[see installation details here]):
+
+. Replace/patch your docutils distribution with the files in http://docutils.sourceforge.net/sandbox/uml-plantUml/src[src/]
+. See usage examples in http://docutils.sourceforge.net/sandbox/uml-plantUml/usage[usage/]including how to setup defaults PlantUML
+
+
+== Usage
+
+Use the "uml" directive and write an indented block of PlantUML commands. No arguments are required, an image will be generated and inlined. The name is derived from the input line number, the generated plantuml "source" is keep in the same directory.
+
+----
+.. uml::
+
+actor User
+participant "First Class" as A
+participant "Second Class" as B
+participant "Last Class" as C
+
+User -> A: DoWork
+activate A
+
+----
+
+You can pass a filename for the image (__WITHOUT extension__) as an optional parameter.
+
+----
+.. uml:: uml2/myDiagram123
+
+actor User
+participant "First Class" as A
+participant "Second Class" as B
+participant "Last Class" as C
+
+User -> A: DoMoreWork
+activate A
+----
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/donors.adoc b/plantuml-docs/docs_from_alphadoc/donors.adoc
new file mode 100644
index 00000000..7aa04a11
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/donors.adoc
@@ -0,0 +1,17 @@
+== Special thanks to our sponsors and donors
+
+We would like to thanks http://sourceforge.net/donate/index.php?group_id=259736[our sponsors and donors].
+
+So we dedicate some special command to them:
+
+@startuml
+donors
+@enduml
+
+
+You can http://plantuml.com/paypal[participate and enlarge the list !] :-)
+
+Another way of supporting us can be http://plantuml.com/patreon[Patreon] or http://plantuml.com/lp[Liberapay]
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/dot.adoc b/plantuml-docs/docs_from_alphadoc/dot.adoc
new file mode 100644
index 00000000..a8548356
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/dot.adoc
@@ -0,0 +1,42 @@
+== Generalisation
+
+**PlantUML** now can generate diagrams other than UML. In such cases the usual `+@startuml+` does not make sense anymore. So now we allow diagrams start with `+@startXYZ+` and finish with `+@endXYZ+`, where `+XYZ+` can change with the type of diagram and can be any characters (including spaces).
+
+> This means that plugin developers are encouraged to change their code to recognize `+@start+` instead of `+@startuml+`.
+
+DOT diagrams are usually formatted as `+@startdot...@enddot+`.
+
+
+== DOT
+
+You can use the http://www.graphviz.org/doc/info/lang.html[DOT language] to create directed graphs (see a http://www.graphviz.org/Gallery.php[Gallery of examples]).
+(Note: **PlantUML** uses http://www.graphviz.org/[Graphviz/DOT] for layout of UML diagrams anyway.)
+
+This allows you to use Graphviz/DOT with all tools that support **PlantUML**.
+
+You can use `+@startdot/@enddot+` or `+@startuml/@enduml+` to delineate the diagram,
+and then the very first line has to be: `+digraph XYZ {+`.
+
+Here are some examples:
+
+@startuml
+digraph foo {
+ node [style=rounded]
+ node1 [shape=box]
+ node2 [fillcolor=yellow, style="rounded,filled", shape=diamond]
+ node3 [shape=record, label="{ a | b | c }"]
+
+ node1 -> node2 -> node3
+}
+@enduml
+
+
+
+@startuml
+digraph foo {
+ PlantUML -> Dot [label=use];
+}
+@enduml
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/doxygen.adoc b/plantuml-docs/docs_from_alphadoc/doxygen.adoc
new file mode 100644
index 00000000..69de525c
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/doxygen.adoc
@@ -0,0 +1,10 @@
+== Doxygen
+
+You can use http://www.doxygen.nl/[Doxygen] and PlantUML
+together to integrate UML diagrams into generated documentation.
+
+You will find more information in the http://www.doxygen.nl/manual/commands.html#cmdstartuml[official documentation].
+
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/ebnf-discussion.adoc b/plantuml-docs/docs_from_alphadoc/ebnf-discussion.adoc
new file mode 100644
index 00000000..51022b5d
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/ebnf-discussion.adoc
@@ -0,0 +1,5 @@
+== Discussion about EBNF
+
+This page is a replacement for https://forum.plantuml.net/8269/activity-diagram-while-loop-on-the-left-side[tps://forum.plantuml.net/8269/activity-diagram-while-loop-on-the-left-side] which is far too long.
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/ebnf.adoc b/plantuml-docs/docs_from_alphadoc/ebnf.adoc
new file mode 100644
index 00000000..f69d15ec
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/ebnf.adoc
@@ -0,0 +1,119 @@
+== Extended BackusโNaur Form (EBNF)
+
+
+https://en.wikipedia.org/wiki/Extended_Backus%E2%80%93Naur_form[Extended BackusโNaur Form (EBNF)] is a type of formal syntax used to specify the structure of a programming language or other formal language. It is an extension of Backus-Naur Form (BNF), which was originally developed by John Backus and Peter Naur to describe the syntax of the Algol programming language.
+
+EBNF adds several additional metasymbols to the original BNF metasymbols, which allows for a more concise and readable specification of a language's syntax. It is commonly used in the specification of programming languages, and is also sometimes used to describe the syntax of other types of formal languages, such as database query languages or markup languages.
+
+Basic support for https://en.wikipedia.org/wiki/Extended_Backus%E2%80%93Naur_form[EBNF] has been introduced in PlantUML.
+
+
+== Minimal binary diagram
+
+
+@startebnf
+binaryDigit = "0" | "1";
+@endebnf
+
+
+
+== Example of LISP Grammar
+
+LISP Grammar with PlantUML.
+
+
+@startebnf
+title LISP Grammar
+grammars_expression = atomic_symbol | "(", s_expression, ".", s_expression, ")" | list;
+list = "(", s_expression, { s_expression }, ")";
+atomic_symbol = letter, atom_part;
+atom_part = empty | letter, atom_part | number, atom_part;
+letter = ? a-z ?;
+number = ? 1-9 ?;
+empty = " ";
+@endebnf
+
+
+[Ref. ]
+
+
+== All EBNF elements
+
+EBNF elements managed by PlantUML.
+
+
+@startebnf
+title All EBNF elements managed by PlantUML
+
+(* Nodes *)
+litteral = "a";
+special = ? a ?;
+rule = a;
+
+(* Edges *)
+required = a;
+optional = [a];
+
+zero_or_more = {a};
+one_or_more = a, {a};
+one_or_more_ebnf = {a}-;
+
+zero_or_more_with_separator = [a, {',', a}];
+one_or_more_with_separator = a, {',', a};
+zero_or_more_with_terminator = {a, ','};
+one_or_more_with_terminator = a, ',', {a, ','};
+one_or_more_with_terminator_ebnf = {a, ','}-;
+
+alternative = a | b;
+group = (a | b) , c;
+without_group = a | b , c;
+@endebnf
+
+
+
+== Notes on elements
+
+Notes may be added to elements of your diagram with ebnf comment tags.
+
+
+@startebnf
+title Comments
+(* Notes for Rule1 *)
+Rule1 = {"a-z" (* any letter *) };
+(* Notes for Rule2 *)
+Rule2 =;
+(* Additional notes, and referances *)
+@endebnf
+
+
+
+== EBNF of PlantUMLs EBNF grammers
+
+EBNF allows for self description, so here it is!
+
+
+@startebnf
+grammar = { rule };
+rule = lhs , "=" (* definition *) , rhs , ";" (* termination *);
+lhs = identifier ;
+rhs = identifier
+ | terminal
+ | "[" , rhs (* optional *) , "]"
+ | "{" , rhs (* repetition *), "}"
+ | "(" , rhs (* grouping *) , ")"
+ | "(*" , rhs (* comment *) , "*)"
+ | "?" , rhs (* special sequence, aka notation *) , "?"
+ | rhs , "|" (* alternation *) , rhs
+ | rhs , "," (* concatenation *), rhs ;
+identifier = letter , { letter | digit | "_" } ;
+terminal = "'" , character , { character } , "'"
+ | '"' , character , { character } , '"' ;
+character = letter | digit | symbol | "_" ;
+symbol = "[" | "]" | "{" | "}" | "(" | ")" | "<" | ">"
+ | "'" | '"' | "=" | "|" | "." | "," | ";" ;
+digit = ? 0-9 ? ;
+letter = ? A-Z or a-z ? ;
+@endebnf
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/eclipse.adoc b/plantuml-docs/docs_from_alphadoc/eclipse.adoc
new file mode 100644
index 00000000..cf2a170b
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/eclipse.adoc
@@ -0,0 +1,58 @@
+== Information about the PlantUML Eclipse Plugin
+
+
+The Eclipse Plugin is developed and maintained by
+http://www.ntnu.edu/employees/hal[Hallvard Trรฆtteberg]
+(many thanks for his work!).
+
+Like the core library PlantUML itself, it is __open source__ and the plugin is distributed under EPL license.
+
+The source code https://github.com/hallvard/plantuml[is hosted on GitHub].
+
+
+
+
+== How to use it?
+First, you have to display the __PlantUML View__ (click the __Window__ menu):
+
+image::eclipse103.png[]
+
+This view displays automatically the class you are working on:
+
+image::eclipse104.png[]
+
+If you write some comment in __PlantUML language__, the corresponding diagram is automatically displayed.
+And if you have several comments with diagrams, it selects the one the cursor is in.
+
+image::eclipse105.png[]
+
+In the __Preferences__ Windows, you can also set up link::graphviz-dot[GraphViz path if needed]:
+
+image::eclipse107.png[]
+
+
+== How to install it?
+
+
+To install the plugin, you have to:
+* Go to **Help/Software Update/Find and install...** or **Help/Install new software...**
+* Create (if needed) or choose the following site as update site: `+http://hallvard.github.io/plantuml/+`+++ +++image::eclipse101.png[]
+* Select PlantUML features:+++ +++image::eclipse102.png[]
+* Restart Eclipse
+
+
+== How to improve it?
+
+The plugin is not limited to Java source file, it also works with __Ecore____/Xcore__
+files.
+
+So that you can see the corresponding class diagram in a view side-by-side the __Ecore____/Xcore__
+editor :
+
+image::xwordfeud-plantuml.png[]
+
+If you want to support other file types, you can implement a new extension to do so.
+You can have a look at
+https://github.com/hallvard/plantuml/tree/master/net.sourceforge.plantuml.xcore[the current xcore implementation].
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/elk.adoc b/plantuml-docs/docs_from_alphadoc/elk.adoc
new file mode 100644
index 00000000..eef263a2
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/elk.adoc
@@ -0,0 +1,70 @@
+== Eclipse Layout Kernel
+
+PlantUML uses an external layout engine for some diagrams (classes, use cases...). By default, GraphViz/dot is used. This means that PlantUML has to call an external process to generate some diagrams.
+
+There are some work in progress to change this behavior. For example, https://plantuml.com/smetana02[a port of GraphViz to Java] is ongoing.
+
+
+Recently, https://www.ntnu.edu/employees/hal[Hallvard Trรฆtteberg] teaches us on how to use https://www.eclipse.org/elk/[Eclipse Layout Kernel] as https://github.com/plantuml/plantuml/issues/534[a library to process the layout].
+
+This is still alpha-software, but results are very interesting. This is working starting from `+V1.2021.5+`.
+
+
+== Usage
+
+ELK is distributed as an independent library. So you have to build it yourself, or you can download http://beta.plantuml.net/elk-full.jar[the complete jar file here].
+
+Both `+plantuml.jar+` and `+elk-full.jar+` have to be in the very same folder. You cannot rename elk-full.jar
+
+Once installed, you can invoke ELK instead of GraphViz with the `+!pragma layout elk+` directive.
+
+**Example:**
+
+
+@startuml
+!pragma layout elk
+
+package image {
+ package color {
+ class red
+ class green
+
+ red->green : red to green
+ }
+ package size {
+ class big
+ class small
+ }
+ class image1
+ class image2
+ image1 <|-- image2
+
+ size -> color : link between packages
+}
+
+class foo
+class bar
+
+foo -> bar : foo to bar
+image1 "1" -> "*" bar
+@enduml
+
+
+This diagram is generated using ELK.
+
+You can use the `+-P+` link::command-line[command-line] option to specify the pragma, rather than putting it in the puml file:
+----
+java -jar plantuml.jar -Playout=elk
+----
+__[Ref. https://github.com/plantuml/plantuml/issues/582[issue-582]]__
+
+Do not expect too much right now, this is really an alpha-version. The idea is to get https://forum.plantuml.net/13709/eclipse-layout-kernel[feedback] from users, to know if we should continue in this direction (that is, supporting ELK within PlantUML).
+
+Still, you can test link::class-diagram[class diagram] and link::deployment-diagram[deployment diagram] and https://forum.plantuml.net/13709/eclipse-layout-kernel[tell us what you think about the result].
+
+
+== Alternative layout engines
+
+See link::smetana02[smetana] and link::vizjs[vizjs] for other alternatives to link::graphviz-dot[graphviz-dot].
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/emacs.adoc b/plantuml-docs/docs_from_alphadoc/emacs.adoc
new file mode 100644
index 00000000..5833453e
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/emacs.adoc
@@ -0,0 +1,65 @@
+== Emacs
+From the original work by http://zhangweize.wordpress.com/2010/09/20/update-plantuml-mode[Zhang Weize], https://github.com/skuro/plantuml-mode[plantuml-mode] supports editing and previewing PlantUML diagrams all within Emacs, optionally also integrating with http://orgmode.org/worg/org-contrib/babel[Org-Babel].
+
+http://twitter.com/lucagreco[Luca Greco] has shared a set of
+http://gist.github.com/547521[standalone helpers] to edit, render, preview PlantUML code from Emacs.
+
+
+
+== Org-Babel
+http://orgmode.org/worg/org-contrib/babel[Org-Babel] now
+natively supports http://eschulte.github.io/babel-dev/DONE-integrate-plantuml-support.html[blocks of plantuml code].
+
+=== Napkin
+https://github.com/pinetr2e/ob-napkin[ob-napkin] package is available from MELPA.
+
+`+ob-napkin+` supports Python syntax for sequence diagrams along with the plain plantuml code. Note that it uses Plantuml server, which means that it does not require to install JAR file and usually faster than invoking JVM.
+
+
+== Emacs Org-Mode
+
+1.) Download `+plantuml.jar+` from https://plantuml.com/download[official download page] and save it at `+/home/you/path/to/plantuml.jar+`
+
+2.) install `+plantuml-mode+` via melpa.
+
+3.) in `+*scratch*+` execute
+----
+(setq org-plantuml-jar-path (expand-file-name "/home/you/path/to/plantuml.jar"))
+(add-to-list 'org-src-lang-modes '("plantuml" . plantuml))
+(org-babel-do-load-languages 'org-babel-load-languages '((plantuml . t)))
+----
+4.) put some uml in your org file e.g.
+----
+#+begin_src plantuml :file my-diagram.png
+title Authentication Sequence
+
+Alice->Bob: Authentication Request
+note right of Bob: Bob thinks about it
+Bob->Alice: Authentication Response
+#+end_src
+----
+5.) export e.g. with `+C-c C-e h o+`
+
+
+=== ob-plantuml.el (obsolete)
+You can also use PlantUML with http://orgmode.org[Emacs org-mode].
+
+You will find the needed macro at the following address http://www.emacswiki.org/emacs/IanYang[http://www.emacswiki.org/emacs/IanYang]
+
+Once installed, embed PlantUML code in Emacs org-mode is used
+like this:
+----
+#+BEGIN_UML
+Alice -> Bob: Authentication Request
+Bob --> Alice: Authentication Response
+#+END_UML
+----
+While the org file is exported to HTML or other formats, PlantUML is called to generate image and replace the block in place.
+
+Thanks to Ian Yang for the work done.
+
+This method, however, is considered obsolete:
+> ;; OBSOLETED, use ob-plantuml.el bundled in org instead.
+( A citation from https://www.emacswiki.org/emacs/org-export-blocks-format-plantuml.el[https://www.emacswiki.org/emacs/org-export-blocks-format-plantuml.el] )
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/eps.adoc b/plantuml-docs/docs_from_alphadoc/eps.adoc
new file mode 100644
index 00000000..c19fa47a
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/eps.adoc
@@ -0,0 +1,21 @@
+== EPS
+http://en.wikipedia.org/wiki/Encapsulated_PostScript[EPS] is
+a graphical format which is scalable. It means that when you zoom an
+image, you don't loose quality. So this format gives good printing
+result.
+
+
+
+
+== EPS Support
+You can enable it by using `+-teps+` flag with the link::command-line[command line].
+
+You can also use `+format="eps"+` in the link::ant-task[ant task definition].
+----
+
+
+
+----
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/external-links.adoc b/plantuml-docs/docs_from_alphadoc/external-links.adoc
new file mode 100644
index 00000000..bfc7126a
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/external-links.adoc
@@ -0,0 +1,114 @@
+== External Links
+
+If you find **PlantUML** interesting, you may like also:
+
+
+* https://bschwarz.github.io/puml-themes/[Puml themes] Themes for plantuml diagrams
+* https://github.com/Drakemor/RedDress-PlantUML[RedDress] Color skins for class diagrams
+* http://www.topbestalternatives.com/plantuml[15 Alternatives to PlantUML]
+* https://github.com/milo-minderbinder/AWS-PlantUML[PlantUML sprites, macros, stereotypes, and other goodies for creating PlantUML diagrams with AWS components]
+* http://ceur-ws.org/Vol-1285/paper08.pdf[Towards Fixing Sketchy UML Models by Leveraging Textual Notations]
+* http://www.ej-technologies.com/products/jprofiler/overview.html[JProfiler] which has been used to profile PlantUML
+* http://yuml.me[yUML] which also allows to quickly write UML diagrams
+* http://www.websequencediagrams.com[WebSequenceDiagrams.com] which allows to generate online sequence diagrams.
+* http://trace2UML.tigris.org[http://trace2UML.tigris.org]
+* TraceUML which also allows to generate sequence diagrams from a textual description.
+* http://kushalhisblog.blogspot.com/2009/08/diagrammr.html[Diagrammr]: Another text to UML tool:
+* http://ditaa.sourceforge.net[DIagrams Through Ascii Art (DITAA)] : to easily generate many kind of diagrams though ascii art. (link::ditaa[You can use it inside PlantUML!])
+* http://www.umlgraph.org[UMLGraph]
+* http://www.mcternan.me.uk/mscgen[Mscgen] that parses Message Sequence Chart
+* Msc-generator: https://sourceforge.net/projects/msc-generator/[Msc-generator on SourceForge] and https://gitlab.com/msc-generator/msc-generator[Msc-generator on GitLab]
+* http://diagramic.com[Diagramic.com]
+* http://www.ckwnc.com/help.html[Ckwnc.com]
+* https://github.com/knsv/mermaid[Mermaid]
+* https://nomnoml.com[Nomnoml]
+* http://bramp.github.io/js-sequence-diagrams[js-sequence-diagrams]
+* http://jumly.tmtk.net[Jumly]
+* http://adrai.github.io/flowchart.js[flowchart.js]
+* https://www.lucidchart.com/blog/2016/05/27/uml-sequence-diagrams-made-easy[Lucidchart : online diagram application that makes it easy to sketch and share professional flowchart diagrams]
+* https://www.gleek.io[Gleek.io is free description-to-diagrams tool for developers. Create informal, UML class, object, or entity-relationship diagrams using your keyboard.]
+* http://carltonf.github.io/from-text-to-simple-uml-diagram-tools[From Text to simple UML diagram]
+* https://github.com/pinetr2e/napkin[Napkin - Write Python code for sequence diagram, which is translated to PlantUML script]
+* https://www.diagramexpress.com/[DiagramExpress]: Online collaboration tool for diagram creation based on PlantUML.
+
+
+== Projects using PlantUML
+* https://www.planttext.com/[PlantText] is a online environment for working with PlantUML in the browser, without the need to install anything.
+* http://code.google.com/p/plant-uml-file-watcher[PlantUML File Watcher project] gives almost instant visualisations of the changes to your PlantUML diagrams.
+* http://code.google.com/p/plantuml-android[PlantUML for Android] converts text diagrams into images using plantuml.com.
+* https://github.com/dashersw/geneJS[geneJS (pronounced genesis)] is a JavaScript tool that generates JavaScript code from PlantUML class diagram source.
+* https://github.com/jupe/puml2code[puml2code] is a JavaScript utility to generate source code from PlantUML class diagram. Supports multiple languages.
+* http://people.apache.org/~luc/plantuml-apache-commons-math[plantuml-apache-commons-math]:Some static UML class diagrams for Apache Commons Math, created using PlantUML.
+* http://testoptimal.com/wiki/index.php?Message%20Sequence%20Chart%20%28MSC%29[Automated tests with TestOptimal.]
+* http://ews.mseedsoft.com/code-docs/page1.html[EWS Software Design] from Mustard Seed Software
+* http://code.google.com/p/pyang/wiki/UMLOutput[Pyang plugin to generate UML diagrams from YANG]
+* http://community.kde.org/KWin/Class_Diagram[KWin documentation]
+* https://rtsys.informatik.uni-kiel.de/trac/kieler/wiki/Help/PlantUML[Kiel Integrated Environment for Layout]
+* http://code.google.com/p/acra/wiki/PlantUmlTest[Documentation of ACRA] (Application Crash Report for Android)
+* http://code.google.com/p/trac-enterprise-suite/[Trac Enterprise Suite]
+* http://code.google.com/p/simpleret[Small portfolio & hobby project for reverse engineering Java/Enterprise Java application] http://translate.google.com/translate?sl=ru&tl=en&u=http%3A%2F%2Fdevprom.ru%2Fnews%2F%25D0%259D%25D0%25BE%25D0%25B2%25D0%25B0%25D1%258F-%25D0%25B2%25D0%25B5%25D1%2580%25D1%2581%25D0%25B8%25D1%258F-DEVPROM-2-9-3[devprom.ru]
+* https://github.com/rsoesemann/plantuml4force[PlantUML for Force.com] : Visualises the Apex Classes and Objects in your Org as configurable UML class diagrams
+* http://arxiv.org/pdf/1405.3240v1.pdf[Flowgen] : Flowchart-Based Documentation for C++ Codes
+* https://www.npmjs.com/package/arkit[arkit] : Visualises a JavaScript, TypeScript or Flow codebase architecture
+* https://github.com/mk-conn/plant2code[plant2code] : Generates code based on puml files - written in PHP
+* https://liveuml.com[LiveUML] : online PlantUML editor with instant visualization and syntax highlighting.
+* https://real-world-plantuml.com/[Real World PlantUML]: Examples of PlantUML diagrams
+* https://github.com/isaaceindhoven/plantuml-styler[PlantUML Styler] : Edit and style plantUML sequence diagrams https://plantumlstyler.netlify.com/[right in your browser] with instant feedback.
+* https://chrome.google.com/webstore/detail/plantuml-extension/jbdmdkcjhnceacdkahhpfpijcohplgaj[PlantUML extension]: This is a Google Chrome extension that replace PlantUML code blocks into preview images.
+* https://www.diagramexpress.com/[DiagramExpress]: Online collaboration tool for diagram creation based on PlantUML.
+* https://github.com/MarcoEidinger/SwiftPlantUML[SwiftPlantUML] Generate PlantUML class diagrams from Swift source code. Available as command-line tool, Swift Package and https://github.com/MarcoEidinger/SwiftPlantUML-Xcode-Extension[Xcode extension]
+* https://github.com/palaniraja/swiftuml[SwiftUML] Generate PlantUML class diagrams from Swift source code.
+* http://www.kep-software.nl/[KEP-Diagrams] Generate Diagrams for PlantUML using interactive choices.
+
+
+== Learn & Teach with PlantUML
+
+* http://www.cs.montana.edu/courses/se322/[Montana State University] - Carroll Computer Software Engineering Labs.
+* http://www2.cs.uidaho.edu/~jeffery/courses/383/hw2.html[University of Idaho] - Computer Science 383: Software Engineering.
+* https://sites.google.com/a/etsmtl.net/log210/diagrammes-en-plantuml[รTS - รcole de technologie supรฉrieure - Montrรฉal] - LOG210 Analyse et conception de logiciels.
+
+
+
+
+== UML for blind people
+
+* http://www.bfg-it.de/wiki/Blind_mit_UML_arbeiten[UML for Blind people]: How PlantUML can help blind developers (http://translate.google.com/translate?u=http%3A%2F%2Fwww.bfg-it.de%2Fwiki%2FBlind_mit_UML_arbeiten&sl=de&tl=en&hl=&ie=UTF-8[translation here])
+* https://groups.yahoo.com/neo/groups/blinduml/info[blinduml Yahoo group] : Discus special needs for blind people using Uml
+* http://icchp-su.net/?q=node/158[Workshop: How to read and create UML diagrams for blind persons] : ICCHP Summer University
+
+
+
+
+== Links about UML
+
+* https://advancedweb.hu/how-to-integrate-plantuml-into-other-software[How to integrate PlantUML into other software]
+* http://modeling-languages.com/interview-plantuml[A coffee with Jordi Cabot (from MOdeling LAnguages)]
+* http://yohshiy.blog.fc2.com/blog-category-22.html[PlantUML ใฎไฝฟใๆน ]
+* http://www.uml-diagrams.org[Nice site about UML]
+* http://modeling-languages.com[Modeling Language Portal]
+* http://modeling-languages.com/uml-tools-textual-notations-define-uml-models[This article] about Textual notations/languages to define UML models.
+* http://www.martinfowler.com/bliki/UmlAsSketch.html[This Martin Fowler's article about UML]
+* http://www.devcurry.com/2010/06/free-open-source-uml-tools.html[Another list of Free Open Source UML Tools]
+
+
+== Other stuffs
+
+* https://www.thoughtworks.com/radar/tools/plantuml[Technology Radar] from ThoughtWorks
+* http://eclipsesource.com/blogs/getting-started-with-j2v8[J2V8] - Running Javascript in Java with V8 Engine
+* http://haproxy.1wt.eu[HAProxy] - The Reliable, High Performance TCP/HTTP Load Balancer
+* http://entropymine.com/jason/tweakpng[TweakPNG] to retrieve metadata generated inside PNG files
+* http://www.graphviz.org[http://www.graphviz.org] which is used by **PlantUML**
+* http://www.jave.de[Java Ascii Versatile Editor]
+* http://www.joelonsoftware.com/articles/Unicode.html[The Absolute Minimum Every Software Developer Absolutely, Positively Must Know About Unicode and Character Sets]
+* http://konieczny.be/unicode.html[Online Unicode (UTF-8) to HTML entity online converter]
+* http://www.freeformatter.com/java-dotnet-escape.html#ad-output[Escapes or unescapes a Java string removing traces of offending characters that could prevent compiling]
+* http://www.alanwood.net/unicode/geometric_shapes.html[Alan Wood's Unicode resources]
+* http://www.whoishostingthis.com/resources/ascii[The Ultimate Guide to ASCII Encoding]
+* http://doc.norang.ca/org-mode.html[Org Mode - Organize Your Life In Plain Text!]
+* http://www.ibm.com/developerworks/java/library/j-jtp01274/index.html[Java theory and practice: Garbage collection and performance]
+* http://optipng.sourceforge.net[optipng]
+* https://cards-dev.twitter.com/validator[Twitter Card validator]
+* https://webp-converter.com[Online WebP Converter]
+* https://zxing.org/w/decode.jspx[ZXing Decoder Online]
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/faq-install.adoc b/plantuml-docs/docs_from_alphadoc/faq-install.adoc
new file mode 100644
index 00000000..655450d5
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/faq-install.adoc
@@ -0,0 +1,71 @@
+== Local Installation notes
+
+
+== Sequence Diagram
+
+Once installation is complete you should first try creating some **Sequence Diagrams**. Since these work without Graphviz this is the fastest way to check that the installation worked. If they do not work, +++other diagrams will probably not work+++.
+
+You should make sure to test **Sequence Diagrams** using the command line and not in the target tool you want to install (Eclipse, Word, Mediawiki...) :
+
+----
+java -jar plantuml.jar -verbose sequenceDiagram.txt
+----
+
+In the `+sequenceDiagram.txt+` file, you can have a very simple test:
+
+----
+@startuml
+Alice -> Bob: test
+@enduml
+----
+
+The `+-verbose+` flag is used to generated some logs that you can send to us, if no image is generated.
+
+Under Unix, you must have X11 librairies installed (which is done by default). Otherwise, you will have some http://www.oracle.com/technetwork/articles/javase/headless-136834.html[HeadlessException].
+You may have to add a flag `+-Djava.awt.headless=true+` in the link::command-line[command line].
+
+If this is working, but not in your tool, it is probably due to a specific tool issue:
+
+On MediaWiki & Windows, you must set the read & execute permissions on `+C:\Windows\system32\cmd.exe+` for the account the PHP web service extension is running under. PHP needs those permissions to "fork" other processes.
+
+
+== Other Diagrams
+
+Once sequence diagrams are working fine, you can focus on other diagrams.
+
+If Graphviz is not installed on your system, you have to link::graphviz-dot[install it first].
+
+Under Linux, try to launch `+dot+` command into a command shell. You __may__ have to finalize the installation by typing `+dot -C+`.
+
+link::graphviz-dot[You may have to set GRAPHVIZ\_DOT] variables if you have not chosen the default installation directory of Graphviz.
+
+To test the installation of Graphviz, you can use the command line:
+----
+java -jar plantuml.jar -testdot
+----
+
+You can also use this special diagram description:
+
+----
+@startuml
+testdot
+@enduml
+----
+
+Once again, you should test using the command line and the `+-verbose+` flag:
+
+----
+java -jar plantuml.jar -verbose classDiagram.txt
+----
+
+The `+classDiagram.txt+` file can be very simple:
+
+----
+@startuml
+A <|-- B
+@enduml
+----
+
+If you still have issues, then you can mailto:plantuml@gmail.com[send us a mail].
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/faq.adoc b/plantuml-docs/docs_from_alphadoc/faq.adoc
new file mode 100644
index 00000000..15cd31bb
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/faq.adoc
@@ -0,0 +1,408 @@
+== Frequently Asked Questions (FAQ)
+
+
+== What's the goal of PlantUML?
+
+**PlantUML** is used to __draw__ UML diagrams, using a simple and human readable text description. +
+Be careful, because it does not prevent you from drawing inconsistent diagrams (such as having two classes inheriting from each other, for example).
+So it's more a **drawing** tool than a **modeling** tool.
+
+There are several reasons why PlantUML might be a good choice for creating diagrams:
+
+* PlantUML is a text-based tool, which means that you can create diagrams by writing sentences in a simple, human-readable language. This makes it easy to understand and edit the structure of your diagrams, even if you're not an expert in diagramming tools.
+
+* PlantUML is open-source and available for free, which means that you can use it without having to pay any licensing fees or subscription charges.
+
+* PlantUML uses intelligent layout algorithms to arrange the elements of your diagrams in a clear and easy-to-understand way, saving you the time and effort of manually positioning and aligning individual elements.
+
+* PlantUML is a generator, which means that it automatically creates diagrams based on the text you provide. This makes it easy to quickly create and update diagrams, and allows you to focus on expressing the structure and relationships of your diagrams rather than worrying about their appearance.
+
+* PlantUML is highly customizable, and provides many options for customizing the appearance of your diagrams. You can also leverage https://forum.plantuml.net/[the knowledge and expertise of the PlantUML community] to find solutions to common layout problems.
+
+Overall, PlantUML is a powerful and versatile tool for creating professional-looking diagrams quickly and easily. It is particularly well-suited for users who prefer a simple, text-based approach to creating diagrams, and who want a tool that can automatically handle the layout and appearance of their diagrams.
+
+
+== I don't like how the diagrams generated by PlantUML look.
+
+* You can use themes with PlantUML
+
+You can use link::themes[theme] with PlantUML to customize the appearance of your diagrams. PlantUML provides several built-in themes that you can use, and you can also create your own custom themes by defining link::style-evolution[your own colors and styles].
+
+
+* PlantUML does a lot of layout work for you
+
+PlantUML takes care of a lot of the layout work for you, so you can focus on expressing the relationships and structure of your diagram. It uses intelligent layout algorithms to arrange the elements of your diagram in a clear and easy-to-understand way, saving you the time and effort of manually positioning and aligning individual elements. This makes it a great tool for quickly creating professional-looking diagrams without a lot of manual effort.
+
+* PlantUML is a generator, not a position elements tool
+
+PlantUML is a generator, which means that it automatically creates diagrams based on the text you provide. This is different from some other diagramming tools, which allow you to manually position and arrange individual elements in your diagram.
+
+The main advantage of this approach is that it allows you to create diagrams quickly and easily, without having to worry about the specific placement of individual elements. It also makes it easier to update your diagrams, since you can simply modify the text that represents your diagram, and PlantUML will automatically update the diagram to reflect your changes.
+
+One potential disadvantage of using a generator like PlantUML is that you may not have as much control over the exact layout of your diagram as you would with a tool that allows you to position elements manually. However, for many users, the time and effort saved by using a generator more than makes up for this limitation.
+
+Additionally, the https://forum.plantuml.net/[PlantUML community forum] is a great resource for finding solutions to common layout problems and sharing tips and tricks for customizing the appearance of your diagrams.
+
+
+== How long do the images generated by PlantUML Server live for?
+
+Links to png or svg generated by http://www.plantuml.com/plantuml[PlantUML Server] are valid forever (that is as long as the server is up). +
+However, we do **not** store any diagrams on our servers.
+
+This may sound contradictory. It is not: the whole diagram is link::text-encoding[compressed into the URL itself]. When the server receives the URL, it decompresses the URL to retrieve the diagram text and generates the image. There is no need to store anything. Even if the server is down, you can retrieve the diagram using the flag `+-decodeurl+` with the link::command-line[command line]. Furthermore, the diagram data is stored in PNG metadata, so you can fetch it even from a downloaded image.
+
+Occasionally we may activate HTTP traces on our server. This is mainly for performance issues (when we have some) to understand the traffic we get. Once the issue solved, we turn back off HTTP traces and we remove the logs.
+
+Concerning sensitive content: even if we do not store the generated diagrams, please be aware that all traffic goes through HTTP, so it's easy to catch.
+
+So you should probably install link::server[a local server] on your own network if you plan to generate diagrams with sensitive information. You can do this with no Java/J2EE knowledge since there is link::picoweb[a tiny web server] included in PlantUML.jar.
+
+
+== It does not work on my config!
+
+**PlantUML** has been installed on various systems, and some users have reported minor issues when installing it. +
+You can have a look link::faq-install[on this page] which give advises if something is wrong.
+
+
+== Which version of Graphviz should I use?
+
+You have more information about Graphviz link::graphviz-dot[about Graphviz here].
+
+The following version have been tested, and are known to work:
+
+* 2.26.3
+* 2.28
+* 2.30.1
+* 2.34
+* 2.36
+* 2.38
+* 2.44
+
+Note that versions 2.39 to 2.42 http://plantuml.sourceforge.net/qa/?qa=4531/possible-bug-with-relation-in-rectangle-screenshot[do not work very well with PlantUML].
+
+With version 2.44, under Windows, you may have to run `+dot -c+` in a command line to finalize the installation, like in the following example:
+
+image::dotc.png[]
+
+You may have to run `+dot -c+` with https://www.howtogeek.com/194041/how-to-open-the-command-prompt-as-administrator-in-windows-8.1/[Administrator Right].
+
+Another option is to install https://www2.graphviz.org/Packages/stable/windows/10/msbuild/Release/Win32[Win32 version of GraphViz 2.44] which does not require this post-install process.
+
+If you compile Graphviz by yourself, you have to build it with __libexpat__ in order to work with PlantUML.
+
+
+== Is this mature? I don't see any new release?
+
+https://www.google.com/trends/explore#q=plantuml[Google Trends] are somehow positive. And there are https://www.google.com/search?tbm=bks&q=plantuml[few books that mention PlantUML]. So yes, it's mature.
+
+Note that **PlantUML** is developed with http://en.wikipedia.org/wiki/Continuous_integration[continuous integration] in mind. That means that there are new releases quite often, with (hopefully!) backward compatibility. So the file **`+PlantUML.jar+`** may changed over time, while keeping the same name.
+
+If you want to know the exact version you are using, you can type in the command line:
+
+----
+java -jar plantuml.jar -version
+----
+
+or use the following small special diagram description:
+
+----
+@startuml
+version
+@enduml
+----
+
+
+== How to know if a new release is available?
+
+To check if a newer version is available for download, you can go to link::download[the download page].
+
+You can also subscribe to the following rss flows:
+
+* http://forum.plantuml.net/feed/activity.rss[Recent activities on the Q&A forum]
+* http://forum.plantuml.net/feed/qa.rss[Recent questions and answers on the Q&A forum]
+
+Or you can use the command line:
+
+----
+java -jar plantuml.jar -version
+----
+
+
+Or use the following small special diagram description:
+
+----
+@startuml
+version
+@enduml
+----
+
+
+== I want to generate huge diagrams!
+
+PlantUML limits image width and height to 4096. There is an environment variable that you can set to override this limit: `+PLANTUML_LIMIT_SIZE+`. You have to define this variable before launching PlantUML, something like:
+
+----
+set PLANTUML_LIMIT_SIZE=8192
+----
+
+or
+
+----
+setenv PLANTUML_LIMIT_SIZE 8192
+----
+
+Another way is an option in the command line:
+
+----
+java -DPLANTUML_LIMIT_SIZE=8192 -jar /path/to/plantuml.jar ...
+----
+
+Note that if you generate **very** big diagrams, (for example, something like 20 000 x 10 000 pixels), you can have some memory issues. The solution is to add this parameter to the java vm : http://javahowto.blogspot.com/2006/06/6-common-errors-in-setting-java-heap.html[-Xmx1024m].
+
+
+== I have issues with accented characters.
+
+Characters encoding is a subtle thing... By default, PlantUML use the default charset of your platform, which may or may not be UTF-8 . If you want to know which charset you are using, you can type the following command:
+
+----
+java -jar plantuml.jar -help
+
+...
+-charset XYZ To use a specific charset (default is windows-1252)
+...
+----
+
+If you want to use a different charset, for example UTF-8, you can use the `+-charset+` flag :
+
+----
+java -jar plantuml.jar -charset UTF-8 ...
+----
+
+
+You can also find link::unicode[here information about unicode] . Note that even if Java http://bugs.sun.com/bugdatabase/view_bug.do?bug_id=4508058[does not support B.O.M. (Byte Order Mark) in UTF-8 format file], a workaround has been put into PlantUML, so this should not be an issue.
+
+
+== I have issues with Asian characters.
+
+Some Japanese users reported that they have to set the `+LANG+` variable to `+ja_JP.UTF-8+` in their shell before launching PlantUML.
+
+----
+export LANG = ja_JP.UTF-8
+----
+
+Since link::svek[the new architecture], it should simply work, because Java knows how to draw East Asian characters.
+
+
+== How to generate EPS?
+
+You can use the `+-teps+` flag in the command line, or `+format="eps"+` in link::ant[the ANT task].
+
+
+== What about XMI?
+
+Work is link::xmi[in progress].
+
+
+== Is @startuml needed in with -pipe flag?
+
++++Short answer+++: You **do** have to use `+@startuml+` (or `+@startditaa+`/`+@startjcckit+`...) when starting a diagram.
+
++++Long answer+++:
+
+The `+@startuml+`/`+@startditaa+`/`+@startjcckit+` is useful to determine the type of diagram (uml, ditaa, jcckit...), and because you can optionally put a filename after the `+@startXYZ+`. This also allows to have several diagrams inside the same file.
+
+Earlier versions of PlantUML were not supporting ditaa or jcckit. When you use link::command-line#pipe[-pipe] flag, since the diagram is generated to standard output, there could be only one diagram in the standard input. And there is no need to specify a filename. For all those reasons, `+@startuml+` was not needed when using link::command-line#pipe[-pipe] flag at that time.
+
+Later, it has been decided to normalize this, and to impose `+@startXYZ+` everywhere, even with link::command-line#pipe[-pipe] flag, because it was confusing for users. Unfortunately, since some existing scripts were already using the fact that `+@startuml+` is not needed in link::command-line#pipe[-pipe] flag, it has been decided to keep this as a __deprecated__ option, just to allow older scripts to run. We indeed do pay attention of ascending compatibility.
+
+For newer scripts, you should not rely on this, and use `+@startXYZ+`/`+@endXYZ+` with the link::command-line#pipe[-pipe] flag.
+
+
+== Under which license is PlantUML distributed?
+
+PlantUML is distributed under the http://www.gnu.org/copyleft/gpl.html[GPL license]. +
+You can print the license using the command line option:
+
+----
+java -jar plantuml.jar -license
+----
+
+Or you can use the special diagram:
+
+----
+@startuml
+license
+@enduml
+----
+
+
+== I don't like GPL!
+
+You can also use:
+
+* link::download#lgpl[LGPL license]
+* link::download#asl[Apache license]
+* link::download#epl[Eclipse Public license]
+* link::download#mit[MIT license]
+
+Those versions miss few features (link::ditaa[DITAA] for example), but are 100% able to generate UML diagrams.
+
+You can print the license of these versions using the command line option:
+
+----
+java -jar plantuml.jar -license
+----
+
+Or you can use the special diagram:
+
+----
+@startuml
+license
+@enduml
+----
+
+
+== Are images generated by PlantUML covered by the GPL/LGPL/ASL/EPL/MIT license?
+
+No, they are not.
+
+Images (whatever their format : PNG, SVG...) generated by the **execution** of PlantUML are owned by the author of their corresponding sources code (that is, their textual description in PlantUML language).
+
+Images generated by the **execution** of PlantUML **are not** considered as __covered work__. You can do whatever you want with them.
+
+The generated images can then be used without any reference to the GPL/LGPL/ASL/EPL/MIT license. It is not even necessary to stipulate that they have been generated with PlantUML, although this will be appreciated by PlantUML team.
+
+There is an exception : if the textual description in PlantUML language is also covered by some license (like the GPL/LGPL/ASL/EPL/MIT), then the generated images are logically covered by this license.
+
+
+== Can I redistribute the LGPL binary file PlantUML.jar and if there any constraints about it?
+
+As long as you do not modify the Java source code and the jar file, you can integrate PlantUML.jar in your own closed source software.
+
+The only constraint is that you have to mention somewhere in your own license or in your documentation that you are using PlantUML and that PlantUML is distributed under LGPL.
+
+You can then even sell your software and earn money, without any other constraints (although link::donors[donation will be appreciate] in that case `+:-)+`
+
+
+
+== What is the license of the PlantUML syntax?
+
+There are no license for the PlantUML syntax itself : this means that everybody can use it.
+
+So you can use PlantUML comments into your own code : **those comments are owned by yourself**, and are not considered as __covered work__, and are not covered by the GPL/LGPL/APL/EPL/MIT license.
+
+Only the current implementation (that is, PlantUML program) is licensed under GPL, LGPL, ASL, EPL or MIT. On the other hand note that the documentation (examples, notices, ...) published in the PlantUML website is copyrighted. But you can still write your own documentation.
+
+
+== What does EmptySvgException mean?
+
+PlantUML is using link::graphviz-dot[Graphviz] to generate some diagrams. So PlantUML is launching __dot__ program and retrieve the information generated by __dot__ as a SVG flow.
+
+This message means that PlantUML is getting an empty flow from __dot__ execution, and therefore cannot generate UML diagrams. There may be several reasons why this happens:
+
+* There is an issue with your Graphviz installation. Try a very simple diagram, with only one class for example.
+* Your version of Graphviz is too old and is crashing with information provided by PlantUML. Check your version with `+testdot+`
+* Your diagram is too complex.
+* There is a bug in PlantUML and/or in __dot__.
+
+
+== Could not initialize class net.sourceforge.plantuml.ugraphic.UFont
+
+If you have the error message `+java.lang.NoClassDefFoundError: Could not initialize class net.sourceforge.plantuml.ugraphic.UFont+`, it probably means that there are no fonts installed on your server.
+
+You can solve it by adding `+fontconfig+` on your system:
+
+----
+sudo yum install fontconfig
+
+or
+
+sudo apt-get install fontconfig
+----
+
+
+== I have a message complaining about X11 or headless!
+
+If you are running PlantUML on a linux server without graphical capability, you may have some error message:
+
+* Can't connect to X11 window
+* X11 connection rejected because of wrong authentication.
+* http://www.oracle.com/technetwork/articles/javase/headless-136834.html[HeadlessException]
+
+
+Basically, this is because PlantUML needs to have access to some graphical resources (more http://www.oracle.com/technetwork/articles/javase/headless-136834.html[information here]).
+You can turn PlantUML to headless mode, using the flag `+-Djava.awt.headless=true+`.
+For example:
+----
+/usr/bin/java -Djava.awt.headless=true -jar /data/PlantUml/plantuml.jar ...
+----
+
+
+== I have an UnsatisfiedLinkError under Mac OS X!
+
+Under Mac OS X, if you have some error message like:
+
+----
+Error java.lang.UnsatisfiedLinkError / liblwawt.dylib /libosxapp.dylib
+----
+
+You need to follow the instructions on http://stackoverflow.com/questions/25914757/osx-yosemite-jvm-shared-library-does-not-contain-the-jni-createjavavm-symbol[http://stackoverflow.com/questions/25914757/osx-yosemite-jvm-shared-library-does-not-contain-the-jni-createjavavm-symbol]:
+
+. Download and install the package: JavaForOSX.
+. Found the file `+AptanaStidio3.ini+`, the file by default located under the directory here: `+/Applications/Aptana Studio 3/AptanaStudio3.app/Contents/MacOS+`
+. Add `+-vm+` argument to specify the java which will be used to lunch Aptana Studio: `+-vm /Library/Java/JavaVirtualMachines/1.6.0.jdk/Contents/Home/bin/java+`
+
+This seems to work only under Java 6, so you may define the following alias to be used in your scripts.
+
+----
+alias java6="export JAVA_HOME=$(/usr/libexec/java_home -v 1.6.0)"
+----
+
+
+== PlantUML scripts are grabbing keyboard/window focus!
+
+Depending on your configuration, you can try the flag `+-Djava.awt.headless=true+`. +
+For example:
+
+----
+/usr/bin/java -Djava.awt.headless=true -jar /path/to/plantuml.jar ...
+----
+
+
+== I found an issue, but I cannot provide my diagram showing the issue because my diagram contains confidential data
+
+There is a `+-cypher+` option the command line that generates a `+.preproc+` file instead of regular image file.
+
+The `+.preproc+` generated file looks like the input diagram expect that all words (except PlantUML language keywords) have been replaced by a random set of letters.
+
+You can double check this by running several time the `+-cypher+` option (you will get a different text each time).
+You may also look at the https://github.com/plantuml/plantuml/blob/master/src/net/sourceforge/plantuml/utils/Cypher.java[Cypher.java class] used to execute this transformation to be sure that there are no backdoor there to retrieve back your original diagram.
+
+If there is an issue in your original diagram, the same issue is likely to also occur with the cyphered one.
+Since the cyphered text is really meaningless, you can safely share it with us : there will be no way for us to guess what you are really working on.
+
+But we will be able to reproduce the issue and fix it so that you can have your original (and confidential) diagram working.
+
+
+
+== I have an error message with the Eclipse Plugin.
+
+If you have the following error message :
+
+The currently displayed page contains invalid values
+
+when displaying the Windows/Preferences/PlantUML, you should try to quit link::eclipse[Eclipse] and use the `+-clean+` flag on the command line:
+
+----
+eclipse -clean
+----
+
+
+
+== I have a question that is not here!
+
+You can use the http://forum.plantuml.net[forum] facility.
+
+Someone will try to answer your question there.
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/font.adoc b/plantuml-docs/docs_from_alphadoc/font.adoc
new file mode 100644
index 00000000..b151da89
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/font.adoc
@@ -0,0 +1,41 @@
+== Font
+To know fonts available on your system, you may use the following special syntax:
+
+
+@startuml
+listfonts
+@enduml
+
+
+You can also add an optional sentence to be displayed:
+
+
+@startuml
+listfonts ็งใฏ็ณใ่จณใใใพใใ๏ผ็งใฏๆฅๆฌ่ชใ่ฉฑใใชใใ
+@enduml
+
+
+
+
+
+== Examples
+Those fontname can be used in any UML diagrams.
+
+
+@startuml
+skinparam defaultFontName Segoe UI
+Room *-- Chair : "1" has "several"
+@enduml
+
+
+
+@startuml
+skinparam defaultFontName VL Gothic
+้จๅฑ *-- ๆค ๅญ : "1" ๆใฃใฆใใพใ "ใใใคใ"
+@enduml
+
+
+You can also change font using link::skinparam[skinparam command].
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/formatting.adoc b/plantuml-docs/docs_from_alphadoc/formatting.adoc
new file mode 100644
index 00000000..337bbc0e
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/formatting.adoc
@@ -0,0 +1,42 @@
+== Wiki Basic formatting
+
+* striked text
+* http link
+* inline images
+* Italic
+* Code with fixed font / monospace
+* Raw (ie unformated) string / no formatting
+* Bold
+* Underline
+* Line Break
+* long code block part
+* Horizontal rules
+
+
+== Advanced formating
+
+* sectioning / heading with 3 levels
+* basic table
+* unordered list (with indentation)
+* ordered list (with indentation)
+* blackquote / quoting
+
+
+== Non standard features
+
+* PlantUML diagram
+* PlantUML code and diagram
+* Tag
+* HTTP title
+* HTTP Description
+
+
+== Wikis syntax
+
+* https://www.markdownguide.org/basic-syntax/[markdown]
+* http://wiki.plantuml.net/wiki/syntax[dokuwiki]
+* https://www.mediawiki.org/wiki/Help:Formatting[Mediawiki]
+* https://en.wikipedia.org/wiki/Creole\_%28markup%29[Creole]
+* https://asciidoctor.org/docs/asciidoc-writers-guide/[Asciidoctor]
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/ftp.adoc b/plantuml-docs/docs_from_alphadoc/ftp.adoc
new file mode 100644
index 00000000..00696742
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/ftp.adoc
@@ -0,0 +1,106 @@
+== File Transfer Protocol
+
+`+FTP+` is normally used to transfer files.
+
+However, it is possible to used this protocol to **generate** UML diagrams.
+
+The way is to launch PlantUML is FTP mode: it runs as a mock FTP server.
+You can upload text files to this server. Then, diagrams will be automatically generated in this FTP server.
+You will just have to download the image files from the FTP server.
+
+To start the ftp server, just launch the following command line:
+----
+java -jar plantuml.jar -ftp
+----
+By default, the server runs on the 4242 port, but you can specify another port:
+
+----
+java -jar plantuml.jar -ftp:12345
+----
+You can then connect to `+127.0.0.1+` on this port with any FTP client, using any user/password.
+
+The FTP server implementation is really simple: you cannot create subdirectory, you cannot rename files...
+You can only delete files.
+
+Actually, this is not a __real__ FTP server. Nothing is stored on disk, everything runs in memory.
+
+You can check http://www.codeproject.com/Articles/397629/Codeuml-design-UML-diagrams-as-fast-as-you-can-cod[codeuml] to have an example of running application.
+
+The advantage of this approach is that you can easily integrate PlantUML with any application, if that application can handle FTP.
+
+This may be simplier than launching a Java process for each diagram transfer.
+
+
+== Example of Transfer
+
+----
+Status:Connecting to 127.0.0.1:24242...
+Status:Connection established, waiting for welcome message...
+Response:220 PlantUML
+Command:USER anonymous
+Response:331 Password required
+Command:PASS ***
+Response:230 Logged in.
+Command:SYST
+Response:215 UNIX Type: L8.
+Command:FEAT
+Response:502 Command not implemented.
+Status:Connected
+Status:Retrieving directory listing...
+Command:PWD
+Response:257 "/" is current directory.
+Command:TYPE I
+Response:200 Command okay.
+Command:PASV
+Response:227 Entering Passive Mode (127,0,0,1,39,59).
+Command:LIST
+Response:150 Opening ASCII mode data
+Response:226 Listing completed.
+Status:Directory listing successful
+Status:Connecting to 127.0.0.1:24242...
+Status:Connection established, waiting for welcome message...
+Response:220 PlantUML
+Command:USER anonymous
+Response:331 Password required
+Command:PASS ***
+Response:230 Logged in.
+Status:Connected
+Status:Starting upload of data1.txt
+Command:CWD /
+Response:250 "/" is new working directory..
+Command:PWD
+Response:257 "/" is current directory.
+Command:TYPE A
+Response:200 Command okay.
+Command:PASV
+Response:227 Entering Passive Mode (127,0,0,1,39,60).
+Command:STOR data1.txt
+Response:150 FILE: data1.txt
+Response:226 Transfer complete.
+Status:File transfer successful, transferred 339 bytes in 1 second
+Status:Retrieving directory listing...
+Command:TYPE I
+Response:200 Command okay.
+Command:PASV
+Response:227 Entering Passive Mode (127,0,0,1,39,61).
+Command:LIST
+Response:150 Opening ASCII mode data
+Response:226 Listing completed.
+Status:Directory listing successful
+Status:Retrieving directory listing...
+Command:PASV
+Response:227 Entering Passive Mode (127,0,0,1,39,62).
+Command:LIST
+Response:150 Opening ASCII mode data
+Response:226 Listing completed.
+Status:Directory listing successful
+Status:Starting download of /data1.png
+Command:PASV
+Response:227 Entering Passive Mode (127,0,0,1,39,63).
+Command:RETR data1.png
+Response:150 Opening
+Response:226 Transfer complete.
+Status:File transfer successful, transferred 3705 bytes in 1 second
+----
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/gantt-diagram.adoc b/plantuml-docs/docs_from_alphadoc/gantt-diagram.adoc
new file mode 100644
index 00000000..83932a36
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/gantt-diagram.adoc
@@ -0,0 +1,1544 @@
+== Gantt Diagram
+
+The Gantt is described in __natural__ language, using very simple sentences (subject-verb-complement).
+
+
+== Declaring tasks
+
+Tasks defined using square bracket.
+
+=== Duration
+
+Their durations are defined using the `+last+` verb:
+
+
+@startgantt
+[Prototype design] lasts 15 days
+[Test prototype] lasts 10 days
+-- All example --
+[Task 1 (1 day)] lasts 1 day
+[T2 (5 days)] lasts 5 days
+[T3 (1 week)] lasts 1 week
+[T4 (1 week and 4 days)] lasts 1 week and 4 days
+[T5 (2 weeks)] lasts 2 weeks
+@endgantt
+
+
+A week is a synonym for how many non-closed days are in a week. So if you specify Saturday and Sunday as closed, a week will be equivalent to 5 days
+
+=== Start
+
+Their beginning are defined using the `+start+` verb:
+
+
+@startgantt
+[Prototype design] lasts 15 days
+[Test prototype] lasts 10 days
+
+Project starts 2020-07-01
+[Prototype design] starts 2020-07-01
+[Test prototype] starts 2020-07-16
+@endgantt
+
+
+@startgantt
+[Prototype design] lasts 15 days
+[Test prototype] lasts 10 days
+
+[Prototype design] starts D+0
+[Test prototype] starts D+15
+@endgantt
+
+
+__[Ref. for `+D+nn+` form: https://forum.plantuml.net/14494/is-it-possible-to-color-the-days-in-the-default-gantt-diagram?show=14550#c14550[QA-14494]]__
+
+=== End
+
+Their ending are defined using the `+end+` verb:
+
+
+@startgantt
+[Prototype design] lasts 15 days
+[Test prototype] lasts 10 days
+
+Project starts 2020-07-01
+[Prototype design] ends 2020-07-15
+[Test prototype] ends 2020-07-25
+@endgantt
+
+
+@startgantt
+[Prototype design] lasts 15 days
+[Test prototype] lasts 10 days
+
+[Prototype design] ends D+14
+[Test prototype] ends D+24
+@endgantt
+
+=== Start/End
+
+It is possible to define both absolutely, by specifying dates:
+
+@startgantt
+Project starts 2020-07-01
+[Prototype design] starts 2020-07-01
+[Test prototype] starts 2020-07-16
+[Prototype design] ends 2020-07-15
+[Test prototype] ends 2020-07-25
+
+@endgantt
+
+
+@startgantt
+[Prototype design] starts D+0
+[Test prototype] starts D+15
+[Prototype design] ends D+14
+[Test prototype] ends D+24
+@endgantt
+
+
+
+== One-line declaration (with the and conjunction)
+
+It is possible to combine declaration on one line with the `+and+` conjunction.
+
+
+@startgantt
+Project starts 2020-07-01
+[Prototype design] starts 2020-07-01 and ends 2020-07-15
+[Test prototype] starts 2020-07-16 and lasts 10 days
+@endgantt
+
+
+
+== Adding constraints
+It is possible to add constraints between tasks.
+
+
+@startgantt
+[Prototype design] lasts 15 days
+[Test prototype] lasts 10 days
+[Test prototype] starts at [Prototype design]'s end
+@endgantt
+
+
+
+@startgantt
+[Prototype design] lasts 10 days
+[Code prototype] lasts 10 days
+[Write tests] lasts 5 days
+[Code prototype] starts at [Prototype design]'s end
+[Write tests] starts at [Code prototype]'s start
+@endgantt
+
+
+
+== Short names
+It is possible to define short name for tasks with the `+as+` keyword.
+
+
+@startgantt
+[Prototype design] as [D] lasts 15 days
+[Test prototype] as [T] lasts 10 days
+[T] starts at [D]'s end
+@endgantt
+
+
+
+== Customize colors
+It is also possible to customize link::color[colors] with `+is colored in+`.
+
+
+@startgantt
+[Prototype design] lasts 13 days
+[Test prototype] lasts 4 days
+[Test prototype] starts at [Prototype design]'s end
+[Prototype design] is colored in Fuchsia/FireBrick
+[Test prototype] is colored in GreenYellow/Green
+@endgantt
+
+
+
+== Completion status
+=== Adding completion depending percentage
+You can set the completion status of a task, by the command:
+* `+is xx% completed+`
+* `+is xx% complete+`
+
+
+@startgantt
+[foo] lasts 21 days
+[foo] is 40% completed
+[bar] lasts 30 days and is 10% complete
+@endgantt
+
+
+=== Change colour of completion (by style)
+
+
+@startgantt
+
+
+
+[Prototype design] lasts 7 days
+[Test prototype 0] lasts 4 days
+[Test prototype 10] lasts 4 days
+[Test prototype 20] lasts 4 days
+[Test prototype 30] lasts 4 days
+[Test prototype 40] lasts 4 days
+[Test prototype 50] lasts 4 days
+[Test prototype 60] lasts 4 days
+[Test prototype 70] lasts 4 days
+[Test prototype 80] lasts 4 days
+[Test prototype 90] lasts 4 days
+[Test prototype 100] lasts 4 days
+
+[Test prototype 0] starts at [Prototype design]'s end
+[Test prototype 10] starts at [Prototype design]'s end
+[Test prototype 20] starts at [Prototype design]'s end
+[Test prototype 30] starts at [Prototype design]'s end
+[Test prototype 40] starts at [Prototype design]'s end
+[Test prototype 50] starts at [Prototype design]'s end
+[Test prototype 60] starts at [Prototype design]'s end
+[Test prototype 70] starts at [Prototype design]'s end
+[Test prototype 80] starts at [Prototype design]'s end
+[Test prototype 90] starts at [Prototype design]'s end
+[Test prototype 100] starts at [Prototype design]'s end
+
+[Test prototype 0] is 0% complete
+[Test prototype 10] is 10% complete
+[Test prototype 20] is 20% complete
+[Test prototype 30] is 30% complete
+[Test prototype 40] is 40% complete
+[Test prototype 50] is 50% complete
+[Test prototype 60] is 60% complete
+[Test prototype 70] is 70% complete
+[Test prototype 80] is 80% complete
+[Test prototype 90] is 90% complete
+[Test prototype 100] is 100% complete
+
+@endgantt
+
+
+__[Ref. https://forum.plantuml.net/8297/plant-gantt-diagram-persentage-completed-determines-color?show=14324#c14324[QA-8297]]__
+
+
+== Milestone
+You can define Milestones using the `+happen+` verb.
+
+=== Relative milestone (use of constraints)
+
+@startgantt
+[Test prototype] lasts 10 days
+[Prototype completed] happens at [Test prototype]'s end
+[Setup assembly line] lasts 12 days
+[Setup assembly line] starts at [Test prototype]'s end
+@endgantt
+
+
+=== Absolute milestone (use of fixed date)
+
+@startgantt
+Project starts 2020-07-01
+[Test prototype] lasts 10 days
+[Prototype completed] happens 2020-07-10
+[Setup assembly line] lasts 12 days
+[Setup assembly line] starts at [Test prototype]'s end
+@endgantt
+
+
+
+=== Milestone of maximum end of tasks
+
+@startgantt
+[Task1] lasts 4 days
+then [Task1.1] lasts 4 days
+[Task1.2] starts at [Task1]'s end and lasts 7 days
+
+[Task2] lasts 5 days
+then [Task2.1] lasts 4 days
+
+[MaxTaskEnd] happens at [Task1.1]'s end
+[MaxTaskEnd] happens at [Task1.2]'s end
+[MaxTaskEnd] happens at [Task2.1]'s end
+
+@endgantt
+
+__[Ref. https://forum.plantuml.net/10764/gantt-multiple-tasks-as-prerequisite-for-a-milestone[QA-10764]]__
+
+
+== Hyperlinks
+You can add hyperlinks to tasks.
+
+
+@startgantt
+[task1] lasts 10 days
+[task1] links to [[http://plantuml.com]]
+@endgantt
+
+
+
+== Calendar
+You can specify a starting date for the whole project. By default, the first task starts at this date.
+
+
+@startgantt
+Project starts the 20th of september 2017
+[Prototype design] as [TASK1] lasts 13 days
+[TASK1] is colored in Lavender/LightBlue
+@endgantt
+
+
+
+== Coloring days
+
+It is possible to add link::color[colors] to some days.
+
+
+@startgantt
+Project starts the 2020/09/01
+
+2020/09/07 is colored in salmon
+2020/09/13 to 2020/09/16 are colored in lightblue
+
+[Prototype design] as [TASK1] lasts 22 days
+[TASK1] is colored in Lavender/LightBlue
+[Prototype completed] happens at [TASK1]'s end
+@endgantt
+
+
+
+== Changing scale
+You can change scale for very long project, with one of those parameters:
+* printscale
+* ganttscale
+* projectscale
+and one of the values:
+* daily __(by default)__
+* weekly
+* monthly
+* quarterly
+* yearly
+
+__(See https://forum.plantuml.net/11272/gantt-keyword-printscale-should-replaced-with-projectscale?show=11274#a11274[QA-11272], https://forum.plantuml.net/9041/gantt-improvement?show=10699#a10699[QA-9041] and https://forum.plantuml.net/10948/gantt-printscale-weekly?show=10949#a10949[QA-10948])__
+
+=== Daily __(by default)__
+
+@startgantt
+saturday are closed
+sunday are closed
+
+Project starts the 1st of january 2021
+[Prototype design end] as [TASK1] lasts 19 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 14 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are named [End's committee]
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+=== Weekly
+
+@startgantt
+printscale weekly
+saturday are closed
+sunday are closed
+
+Project starts the 1st of january 2021
+[Prototype design end] as [TASK1] lasts 19 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 14 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are named [End's committee]
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+
+@startgantt
+printscale weekly
+Project starts the 20th of september 2020
+[Prototype design] as [TASK1] lasts 130 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 20 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are named [End's committee]
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+=== Monthly
+
+@startgantt
+projectscale monthly
+Project starts the 20th of september 2020
+[Prototype design] as [TASK1] lasts 130 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 20 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are named [End's committee]
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+
+=== Quarterly
+
+@startgantt
+projectscale quarterly
+Project starts the 20th of september 2020
+[Prototype design] as [TASK1] lasts 130 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 20 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are named [End's committee]
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+
+@startgantt
+projectscale quarterly
+Project starts the 1st of october 2020
+[Prototype design] as [TASK1] lasts 700 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 200 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-03-22 are colored in salmon
+@endgantt
+
+
+=== Yearly
+
+@startgantt
+projectscale yearly
+Project starts the 1st of october 2020
+[Prototype design] as [TASK1] lasts 700 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 200 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-03-22 are colored in salmon
+@endgantt
+
+
+
+== Zoom (example for all scale)
+
+You can change zoom, with the parameter:
+* `+zoom +`
+
+=== Zoom on weekly scale
+==== Without zoom
+
+@startgantt
+printscale daily
+saturday are closed
+sunday are closed
+
+Project starts the 1st of january 2021
+[Prototype design end] as [TASK1] lasts 8 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 3 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are named [End's committee]
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+==== With zoom
+
+@startgantt
+printscale daily zoom 2
+saturday are closed
+sunday are closed
+
+Project starts the 1st of january 2021
+[Prototype design end] as [TASK1] lasts 8 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 3 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are named [End's committee]
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+__[Ref. https://forum.plantuml.net/13725/gantt-add-zoom-for-daily-scale[QA-13725]]__
+
+=== Zoom on weekly scale
+==== Without zoom
+
+@startgantt
+printscale weekly
+saturday are closed
+sunday are closed
+
+Project starts the 1st of january 2021
+[Prototype design end] as [TASK1] lasts 19 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 14 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are named [End's committee]
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+==== With zoom
+
+@startgantt
+printscale weekly zoom 4
+saturday are closed
+sunday are closed
+
+Project starts the 1st of january 2021
+[Prototype design end] as [TASK1] lasts 19 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 14 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are named [End's committee]
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+=== Zoom on monthly scale
+==== Without zoom
+
+@startgantt
+projectscale monthly
+Project starts the 20th of september 2020
+[Prototype design] as [TASK1] lasts 130 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 20 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are named [End's committee]
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+==== With zoom
+
+@startgantt
+projectscale monthly zoom 3
+Project starts the 20th of september 2020
+[Prototype design] as [TASK1] lasts 130 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 20 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are named [End's committee]
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+
+=== Zoom on quarterly scale
+==== Without zoom
+
+@startgantt
+projectscale quarterly
+Project starts the 20th of september 2020
+[Prototype design] as [TASK1] lasts 130 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 20 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are named [End's committee]
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+==== With zoom
+
+@startgantt
+projectscale quarterly zoom 7
+Project starts the 20th of september 2020
+[Prototype design] as [TASK1] lasts 130 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 20 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are named [End's committee]
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+=== Zoom on yearly scale
+==== Without zoom
+
+@startgantt
+projectscale yearly
+Project starts the 1st of october 2020
+[Prototype design] as [TASK1] lasts 700 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 200 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-03-22 are colored in salmon
+@endgantt
+
+
+==== With zoom
+
+@startgantt
+projectscale yearly zoom 2
+Project starts the 1st of october 2020
+[Prototype design] as [TASK1] lasts 700 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 200 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-03-22 are colored in salmon
+@endgantt
+
+
+
+== Close day
+It is possible to close some day.
+
+
+@startgantt
+project starts the 2018/04/09
+saturday are closed
+sunday are closed
+2018/05/01 is closed
+2018/04/17 to 2018/04/19 is closed
+[Prototype design] lasts 14 days
+[Test prototype] lasts 4 days
+[Test prototype] starts at [Prototype design]'s end
+[Prototype design] is colored in Fuchsia/FireBrick
+[Test prototype] is colored in GreenYellow/Green
+@endgantt
+
+
+
+Then it is possible to open some closed day.
+
+
+@startgantt
+2020-07-07 to 2020-07-17 is closed
+2020-07-13 is open
+
+Project starts the 2020-07-01
+[Prototype design] lasts 10 days
+Then [Test prototype] lasts 10 days
+@endgantt
+
+
+
+== Definition of a week depending of closed days
+
+A **week** is a synonym for how many non-closed days are in a week, as:
+
+@startgantt
+Project starts 2021-03-29
+[Review 01] happens at 2021-03-29
+[Review 02 - 3 weeks] happens on 3 weeks after [Review 01]'s end
+[Review 02 - 21 days] happens on 21 days after [Review 01]'s end
+@endgantt
+
+
+So if you specify __Saturday__ and __Sunday__ as closed, a **week** will be equivalent to 5 days, as:
+
+@startgantt
+Project starts 2021-03-29
+saturday are closed
+sunday are closed
+[Review 01] happens at 2021-03-29
+[Review 02 - 3 weeks] happens on 3 weeks after [Review 01]'s end
+[Review 02 - 21 days] happens on 21 days after [Review 01]'s end
+@endgantt
+
+
+__[Ref. https://forum.plantuml.net/13434/gantt-milestone-bug?show=13449#c13449[QA-13434]]__
+
+
+== Simplified task succession
+It's possible to use the `+then+` keyword to denote consecutive tasks.
+
+
+@startgantt
+[Prototype design] lasts 14 days
+then [Test prototype] lasts 4 days
+then [Deploy prototype] lasts 6 days
+@endgantt
+
+
+You can also use arrow `+->+`
+
+
+
+@startgantt
+[Prototype design] lasts 14 days
+[Build prototype] lasts 4 days
+[Prepare test] lasts 6 days
+[Prototype design] -> [Build prototype]
+[Prototype design] -> [Prepare test]
+@endgantt
+
+
+
+== Working with resources
+You can affect tasks on resources using the `+on+` keyword and brackets for resource name.
+
+
+
+@startgantt
+[Task1] on {Alice} lasts 10 days
+[Task2] on {Bob:50%} lasts 2 days
+then [Task3] on {Alice:25%} lasts 1 days
+@endgantt
+
+
+Multiple resources can be assigned to a task:
+
+
+
+@startgantt
+[Task1] on {Alice} {Bob} lasts 20 days
+@endgantt
+
+
+Resources can be marked as off on specific days:
+
+
+@startgantt
+project starts on 2020-06-19
+[Task1] on {Alice} lasts 10 days
+{Alice} is off on 2020-06-24 to 2020-06-26
+@endgantt
+
+
+
+== Hide resources
+
+=== Without any hiding (by default)
+
+
+@startgantt
+[Task1] on {Alice} lasts 10 days
+[Task2] on {Bob:50%} lasts 2 days
+then [Task3] on {Alice:25%} lasts 1 days
+then [Task4] on {Alice:25%} {Bob} lasts 1 days
+@endgantt
+
+
+
+=== Hide resources names
+
+You can hide ressources names and percentage, on tasks, using the `+hide ressources names+` keywords.
+
+
+@startgantt
+hide ressources names
+[Task1] on {Alice} lasts 10 days
+[Task2] on {Bob:50%} lasts 2 days
+then [Task3] on {Alice:25%} lasts 1 days
+then [Task4] on {Alice:25%} {Bob} lasts 1 days
+@endgantt
+
+
+=== Hide resources footbox
+
+You can also hide ressources names on bottom of the diagram using the `+ hide ressources footbox+` keywords.
+
+
+@startgantt
+hide ressources footbox
+[Task1] on {Alice} lasts 10 days
+[Task2] on {Bob:50%} lasts 2 days
+then [Task3] on {Alice:25%} lasts 1 days
+then [Task4] on {Alice:25%} {Bob} lasts 1 days
+@endgantt
+
+
+=== Hide the both (resources names and resources footbox)
+
+You can also hide the both.
+
+
+@startgantt
+hide ressources names
+hide ressources footbox
+[Task1] on {Alice} lasts 10 days
+[Task2] on {Bob:50%} lasts 2 days
+then [Task3] on {Alice:25%} lasts 1 days
+then [Task4] on {Alice:25%} {Bob} lasts 1 days
+@endgantt
+
+
+
+== Separator
+
+You can use `+--+` to separate sets of tasks.
+
+
+
+@startgantt
+[Task1] lasts 10 days
+then [Task2] lasts 4 days
+-- Phase Two --
+then [Task3] lasts 5 days
+then [Task4] lasts 6 days
+@endgantt
+
+
+
+== Complex example
+It also possible to use the `+and+` conjunction.
+
+You can also add delays in constraints.
+
+
+
+@startgantt
+[Prototype design] lasts 13 days and is colored in Lavender/LightBlue
+[Test prototype] lasts 9 days and is colored in Coral/Green and starts 3 days after [Prototype design]'s end
+[Write tests] lasts 5 days and ends at [Prototype design]'s end
+[Hire tests writers] lasts 6 days and ends at [Write tests]'s start
+[Init and write tests report] is colored in Coral/Green
+[Init and write tests report] starts 1 day before [Test prototype]'s start and ends at [Test prototype]'s end
+@endgantt
+
+
+
+== Comments
+
+As is mentioned on link::commons#560kta2oz3a2k362kjbm[Common Commands page]:
+> Everything that starts with `+simple quote '+` is a comment.
+>
+> You can also put comments on several lines using `+/'+` to start and `+'/+` to end.
+__(i.e.: the first character (except space character) of a comment line must be a `+simple quote '+`)__
+
+
+
+@startgantt
+' This is a comment
+
+[T1] lasts 3 days
+
+/' this comment
+is on several lines '/
+
+[T2] starts at [T1]'s end and lasts 1 day
+@endgantt
+
+
+
+== Using style
+
+=== Without style (by default)
+
+@startgantt
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@endgantt
+
+
+
+=== With style
+
+You can use link::style-evolution[style] to change rendering of elements.
+
+
+@startgantt
+
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@endgantt
+
+
+__[Ref. https://forum.plantuml.net/10835[QA-10835], https://forum.plantuml.net/12045[QA-12045], https://forum.plantuml.net/11877[QA-11877] and https://github.com/plantuml/plantuml/pull/438[PR-438]]__
+
+=== With style (full example)
+
+
+@startgantt
+
+Project starts the 2020-12-01
+
+[Task1] lasts 10 days
+sunday are closed
+
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+
+[Task2] lasts 20 days
+[Task2] starts 10 days after [Task1]'s end
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+
+
+
+-- end --
+@endgantt
+
+__[Ref. https://forum.plantuml.net/13570/can-you-style-the-days-and-months-of-a-gantt-chart?show=13589#a13589[QA-13570], https://forum.plantuml.net/13672[QA-13672]]__
+
+[[#00D700#DONE]]
+__Thanks for style for Separator and all style for Arrow (thickness...)__
+
+=== Clean style
+
+With style, you can also clean a Gantt diagram __(showing tasks, dependencies and relative durations only - but no actual start date and no actual scale)__:
+
+@startgantt
+
+
+hide footbox
+[Test prototype] lasts 7 days
+[Prototype completed] happens at [Test prototype]'s end
+[Setup assembly line] lasts 9 days
+[Setup assembly line] starts at [Test prototype]'s end
+then [Setup] lasts 5 days
+[T2] lasts 2 days and starts at [Test prototype]'s end
+then [T3] lasts 3 days
+-- end task --
+then [T4] lasts 2 days
+@endgantt
+
+__[Ref. https://forum.plantuml.net/13971[QA-13971]]__
+
+Or:
+
+
+@startgantt
+
+
+hide footbox
+project starts the 2018/04/09
+saturday are closed
+sunday are closed
+2018/05/01 is closed
+2018/04/17 to 2018/04/19 is closed
+[Prototype design] lasts 9 days
+[Test prototype] lasts 5 days
+[Test prototype] starts at [Prototype design]'s end
+[Prototype design] is colored in Fuchsia/FireBrick
+[Test prototype] is colored in GreenYellow/Green
+@endgantt
+
+__[Ref. https://forum.plantuml.net/13464[QA-13464]]__
+
+
+== Add notes
+
+
+@startgantt
+[task01] lasts 15 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+
+[task01] -> [task02]
+
+@endgantt
+
+
+Example with overlap.
+
+@startgantt
+[task01] lasts 15 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+
+[task01] -> [task02]
+[task03] lasts 5 days
+
+@endgantt
+
+
+
+
+@startgantt
+
+-- test01 --
+
+[task01] lasts 4 days
+note bottom
+'note left
+memo1 ...
+memo2 ...
+explanations1 ...
+explanations2 ...
+end note
+
+[task02] lasts 8 days
+[task01] -> [task02]
+note bottom
+'note left
+memo1 ...
+memo2 ...
+explanations1 ...
+explanations2 ...
+end note
+-- test02 --
+
+[task03] as [t3] lasts 7 days
+[t3] -> [t4]
+@endgantt
+
+
+[[#c0ffc0#DONE]]
+__Thanks for correction (of https://github.com/plantuml/plantuml/issues/386[#386] on https://plantuml.com/changes[v1.2020.18]) when overlapping__
+
+
+@startgantt
+
+Project starts 2020-09-01
+
+[taskA] starts 2020-09-01 and lasts 3 days
+[taskB] starts 2020-09-10 and lasts 3 days
+[taskB] displays on same row as [taskA]
+
+[task01] starts 2020-09-05 and lasts 4 days
+
+then [task02] lasts 8 days
+note bottom
+ note for task02
+ more notes
+end note
+
+then [task03] lasts 7 days
+note bottom
+ note for task03
+ more notes
+end note
+
+-- separator --
+
+[taskC] starts 2020-09-02 and lasts 5 days
+[taskD] starts 2020-09-09 and lasts 5 days
+[taskD] displays on same row as [taskC]
+
+[task 10] starts 2020-09-05 and lasts 5 days
+then [task 11] lasts 5 days
+note bottom
+ note for task11
+ more notes
+end note
+@endgantt
+
+
+
+== Pause tasks
+
+
+@startgantt
+Project starts the 5th of december 2018
+saturday are closed
+sunday are closed
+2018/12/29 is opened
+[Prototype design] lasts 17 days
+[Prototype design] pauses on 2018/12/13
+[Prototype design] pauses on 2018/12/14
+[Prototype design] pauses on monday
+[Test prototype] starts at [Prototype design]'s end and lasts 2 weeks
+@endgantt
+
+
+
+== Change link colors
+
+You can change link colors:
+* with this syntax: `+with
+[Prototype design] lasts 7 days
+[Build prototype] lasts 4 days
+[Prepare test] lasts 6 days
+[Prototype design] -[#FF00FF]-> [Build prototype]
+[Prototype design] -[dotted]-> [Prepare test]
+Then [Run test] lasts 4 days
+@endgantt
+
+
+__[Ref. https://forum.plantuml.net/13693[QA-13693]]__
+
+
+== Tasks or Milestones on the same line
+
+You can put Tasks or Milestones on the same line, with this syntax:
+* `+[T|M] displays on same row as [T|M]+`
+
+
+@startgantt
+[Prototype design] lasts 13 days
+[Test prototype] lasts 4 days and 1 week
+[Test prototype] starts 1 week and 2 days after [Prototype design]'s end
+[Test prototype] displays on same row as [Prototype design]
+[r1] happens on 5 days after [Prototype design]'s end
+[r2] happens on 5 days after [r1]'s end
+[r3] happens on 5 days after [r2]'s end
+[r2] displays on same row as [r1]
+[r3] displays on same row as [r1]
+@endgantt
+
+
+
+== Highlight today
+
+
+@startgantt
+Project starts the 20th of september 2018
+sunday are close
+2018/09/21 to 2018/09/23 are colored in salmon
+2018/09/21 to 2018/09/30 are named [Vacation in the Bahamas]
+
+today is 30 days after start and is colored in #AAF
+[Foo] happens 40 days after start
+[Dummy] lasts 10 days and starts 10 days after start
+
+@endgantt
+
+
+
+== Task between two milestones
+
+
+@startgantt
+project starts on 2020-07-01
+[P_start] happens 2020-07-03
+[P_end] happens 2020-07-13
+[Prototype design] occurs from [P_start] to [P_end]
+@endgantt
+
+
+
+== Grammar and verbal form
+
+|===
+| Verbal form | Example
+
+| [__T__] starts
+|
+
+| [__M__] happens
+|
+
+|===
+
+
+== Add title, header, footer, caption or legend
+
+
+@startgantt
+
+header some header
+
+footer some footer
+
+title My title
+
+[Prototype design] lasts 13 days
+
+legend
+The legend
+end legend
+
+caption This is caption
+
+@endgantt
+
+
+__(See also: link::commons[Common commands])__
+
+
+== Removing Foot Boxes (example for all scale)
+
+You can use the `+hide footbox+` keywords to remove the foot boxes
+of the gantt diagram __(as for link::sequence-diagram[sequence diagram])__.
+
+Examples on:
+
+* daily scale __(without project start)__
+
+@startgantt
+
+hide footbox
+title Foot Box removed
+
+[Prototype design] lasts 15 days
+[Test prototype] lasts 10 days
+@endgantt
+
+
+* daily scale
+
+@startgantt
+
+Project starts the 20th of september 2017
+[Prototype design] as [TASK1] lasts 13 days
+[TASK1] is colored in Lavender/LightBlue
+
+hide footbox
+@endgantt
+
+
+* weekly scale
+
+@startgantt
+hide footbox
+
+printscale weekly
+saturday are closed
+sunday are closed
+
+Project starts the 1st of january 2021
+[Prototype design end] as [TASK1] lasts 19 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 14 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are named [End's committee]
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+
+* monthly scale
+
+@startgantt
+
+hide footbox
+
+projectscale monthly
+Project starts the 20th of september 2020
+[Prototype design] as [TASK1] lasts 130 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 20 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are named [End's committee]
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+* quarterly scale
+
+@startgantt
+
+hide footbox
+
+projectscale quarterly
+Project starts the 1st of october 2020
+[Prototype design] as [TASK1] lasts 700 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 200 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-03-22 are colored in salmon
+@endgantt
+
+
+* yearly scale
+
+@startgantt
+
+hide footbox
+
+projectscale yearly
+Project starts the 1st of october 2020
+[Prototype design] as [TASK1] lasts 700 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 200 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-03-22 are colored in salmon
+@endgantt
+
+
+
+== Language of the calendar
+
+You can choose the language of the Gantt calendar, with the `+language +` command where `++` is the https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes[ISO 639 code] of the language.
+
+
+=== English __(en, by default)__
+
+@startgantt
+saturday are closed
+sunday are closed
+
+Project starts 2021-01-01
+[Prototype design end] as [TASK1] lasts 19 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 14 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+=== Deutsch (de)
+
+@startgantt
+language de
+saturday are closed
+sunday are closed
+
+Project starts 2021-01-01
+[Prototype design end] as [TASK1] lasts 19 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 14 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+=== Japanese (ja)
+
+@startgantt
+language ja
+saturday are closed
+sunday are closed
+
+Project starts 2021-01-01
+[Prototype design end] as [TASK1] lasts 19 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 14 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+=== Chinese (zh)
+
+@startgantt
+language zh
+saturday are closed
+sunday are closed
+
+Project starts 2021-01-01
+[Prototype design end] as [TASK1] lasts 19 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 14 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+=== Korean (ko)
+
+@startgantt
+language ko
+saturday are closed
+sunday are closed
+
+Project starts 2021-01-01
+[Prototype design end] as [TASK1] lasts 19 days
+[TASK1] is colored in Lavender/LightBlue
+[Testing] lasts 14 days
+[TASK1]->[Testing]
+
+2021-01-18 to 2021-01-22 are colored in salmon
+@endgantt
+
+
+
+== Delete Tasks or Milestones
+
+You can mark some Tasks or Milestones as `+deleted+` instead of normally completed to distinguish tasks that may possibly have been discarded, postponed or whatever.
+
+
+@startgantt
+[Prototype design] lasts 1 weeks
+then [Prototype completed] lasts 4 days
+[End Prototype completed] happens at [Prototype completed]'s end
+then [Test prototype] lasts 5 days
+[End Test prototype] happens at [Test prototype]'s end
+
+[Prototype completed] is deleted
+[End Prototype completed] is deleted
+@endgantt
+
+
+__[Ref. https://forum.plantuml.net/9129[QA-9129]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/gfm-support.adoc b/plantuml-docs/docs_from_alphadoc/gfm-support.adoc
new file mode 100644
index 00000000..88af7cbf
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/gfm-support.adoc
@@ -0,0 +1,37 @@
+== GFM Support
+
+Some users has request support for https://github.github.com/gfm/[GitHub Flavored Markdown (GFM)] __(see https://forum.plantuml.net/11182/please-support-markdown-formatting-syntax-addition-creole[request on the forum])__
+
+
+== Subset to be supported by PlantUML
+
+__Please list here features that you are expecting to have in PlantUML.__
+
+Indeed, all gfm features will **not** be supported.
+
+
+For Italic:
+----
+*This is Italic*
+----
+
+Titles:
+= Title 1
+== title 2
+
+Lists:
+* list item1
+* list item2
+ - sub item1
+
+images
+
+
+
+== A chapter of gfm-support - Tables
+
+\| Header 1 \| Header 2 \| Header 3 \| Header 4 \|
+\|:---:\|:---\|---:\|---\|
+\|Centered \| Left justified \| Right Justified \| No justification (presumably equivalent to left-justified). \|
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/graphviz-dot.adoc b/plantuml-docs/docs_from_alphadoc/graphviz-dot.adoc
new file mode 100644
index 00000000..13267402
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/graphviz-dot.adoc
@@ -0,0 +1,128 @@
+== GraphViz
+
+https://en.wikipedia.org/wiki/Graphviz[GraphViz] is software system that provides a program called **dot**. This **dot** program is able to generate a directed graph from a textual description.
+
+Depending on diagrams you want to generate, **PlantUML** needs a working version of GraphViz to be able to generate the following diagrams:
+
+* link::use-case-diagram[Usecase diagrams]
+* link::class-diagram[Class diagrams]
+* link::object-diagram[Object diagrams]
+* link::component-diagram[Component diagrams]
+* link::deployment-diagram[Deployment diagram]
+* link::state-diagram[State diagrams]
+* link::activity-diagram-legacy[Legacy activity diagrams]
+
+For all other diagrams, GraphViz is not needed nor used.
+
+
+== New Java-based diagram generation engine "Smetana"
+
+Since version 1.2021.5, you can experimentally use PlantUML without installing Graphviz as described in the following sections, if you add `+!pragma layout smetana+` to your diagrams for the supported types. In that case, the link::smetana02["Smetana" engine] is used instead of Graphviz. If that works for you, you can skip the following sections.
+
+== Installation under Windows
+
+=== Starting from 1.2020.21
+
+If you use a recent version (that is at least version 1.2020.21), **you don't need to manually install GraphViz anymore !**
+
+A https://github.com/plantuml/graphviz-distributions[minimalistic graphviz dot.exe] is packed into PlantUML and will be automagically unzipped in some temporary folder if needed (that is, if no installed GraphViz is available).
+
+This is really the prefered option under Windows.
+
+**Caveat:** Before 1.2020.25, there was an error message during graph generation, so please use 1.2020.25 or more recent.
+
+=== Older PlantUML versions
+
+For older version, you have to install GraphViz by yourself. You can either:
+
+* Install https://www2.graphviz.org/Packages/stable/windows/10/msbuild/Release/Win32[Win32 version of GraphViz 2.44] (easiest)
+* Use the https://github.com/plantuml/graphviz-distributions[minimalistic graphviz dot.exe] and unpack it on your `+c:\+` drive (see below)
+* Install https://www2.graphviz.org/Packages/stable/windows/10/cmake/Release/x64/[x64 version of GraphViz 2.44] (more complex)
+
+With x64 version, you may have to run `+dot -c+` (with with https://www.howtogeek.com/194041/how-to-open-the-command-prompt-as-administrator-in-windows-8.1/[Administrator Right]) in a command line to finalize the installation, like in the following example:
+
+image::dotc.png[]
+
+To retrieve `+dot.exe+`, PlantUML scans your `+c:\+` drive and search for `+c:\*\graphviz*\bin\dot.exe+` or `+c:\*\graphviz*\release\bin\dot.exe+`. This is **not** recursive: you have to use a folder at root level.
+
+Another option is that you specify the environment variable `+GRAPHVIZ_DOT+` to set the exact location of your GraphViz executable.
+
+
+== Installation under Linux
+
+There are multiple ways to https://graphviz.org/download/[install GraphViz under Linux]:
+
+* Fedora packages: `+sudo yum install graphviz+`
+* Ubuntu packages: `+sudo apt install graphviz+`
+* Debian packages: `+sudo apt install graphviz+`
+
+You can also build it from the source. If you do, you have to build it with __libexpat__ in order to work with PlantUML.
+
+
+By default, the dot executable is expected:
+
+* Firstly in: `+/usr/local/bin/dot+`
+* Then in: `+/usr/bin/dot+`
+
+You can also specify the environment variable `+GRAPHVIZ_DOT+` to set the exact location of your GraphViz executable.
+
+
+== Installation under Mac
+
+You can easily install GraphViz by installing brew on your Mac machine. This could fix issues if you have installed GraphViz as .dmg package.
+
+----
+brew install libtool
+brew link libtool
+brew install graphviz
+brew link --overwrite graphviz
+----
+
+
+By default, the dot executable is expected:
+
+* Firstly in: `+/usr/local/bin/dot+`
+* Then in: `+/usr/bin/dot+`
+
+You can also specify the environment variable `+GRAPHVIZ_DOT+` to set the exact location of your GraphViz executable.
+
+
+== Testing
+
+To have information about where PlantUML expects to find dot, you can use the command line:
+----
+java -jar plantuml.jar -testdot
+----
+
+You can also use this special diagram description:
+
+
+@startuml
+testdot
+@enduml
+
+
+
+Try to launch `+dot+` command into a command shell. You __may__ have to finalize the installation by typing `+dot -C+`.
+
+You can also specify the environment variable `+GRAPHVIZ_DOT+` to set the exact location of your GraphViz executable.
+
+
+== Important note about version
+
+The following GraphViz versions have been tested, and are known to work:
+
+* 2.26.3
+* 2.28
+* 2.30.1
+* 2.34
+* 2.36
+* 2.38
+* 2.44
+
+Note that versions 2.39 to 2.42 http://plantuml.sourceforge.net/qa/?qa=4531/possible-bug-with-relation-in-rectangle-screenshot[do not work very well with PlantUML].
+
+
+If you find something wrong, thanks for mailto:plantuml@gmail.com[sending us a note] or posting a message http://forum.plantuml.net[on the forum].
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/gui.adoc b/plantuml-docs/docs_from_alphadoc/gui.adoc
new file mode 100644
index 00000000..0372d0f8
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/gui.adoc
@@ -0,0 +1,30 @@
+== PlantUML GUI
+If the double-click does not work fine, you can try the following command:
+
+----
+java -jar plantuml.jar -gui
+----
+
+You can then select a directory that will be periodically
+scanned by **PlantUML**.
+
+Alternatively you can specify the source directory as part of the command:
+----
+java -jar plantuml.jar -gui /source/directory
+----
+
+The following window lists all images that are generated by **PlantUML**.
+If any modification is done in the directory, the window will be updated.
+
+image::choice_rep.png[]
+
+You can iconify the window while you are creating or changing
+files into the chosen directory.
+
+You can also double-click on an image title to have a look at it.
+If the source file of the diagram is modified, the image will be
+automatically updated.
+
+image::single_image.png[]
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/handwritten.adoc b/plantuml-docs/docs_from_alphadoc/handwritten.adoc
new file mode 100644
index 00000000..1cfd47aa
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/handwritten.adoc
@@ -0,0 +1,323 @@
+== Handwritten diagram style
+
+To emphasize the fact that your diagrams are still under work, you can generate handwritten diagrams.
+
+You have to set `+handwritten+` skinparam to `+true+` to do so.
+
+=== Activity
+
+@startuml
+skinparam handwritten true
+start
+if (Graphviz installed?) then (yes)
+ :process all\ndiagrams;
+else (no)
+ :process only
+ __sequence__ and __activity__ diagrams;
+endif
+stop
+@enduml
+
+
+=== Board
+
+@startboard
+skinparam handwritten true
+scale .75
+A1
++U1.1
+++S1 R1
+++S1 R2
++U1.2
+A2
+@endboard
+
+
+=== Class
+
+@startuml
+skinparam handwritten true
+class Object
+class String extends Object
+class Date extends Object
+@enduml
+
+
+=== Deployment
+==== Deployment shapes
+
+
+@startuml
+skinparam handwritten true
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+
+==== Deployment with Group
+
+
+@startuml
+skinparam handwritten true
+package "Some Group" {
+ HTTP - [First Component]
+ [Another Component]
+}
+
+node "Other Groups" {
+ FTP - [Second Component]
+ [First Component] --> FTP
+}
+
+cloud {
+ [Example 1]
+}
+
+database "MySql" {
+ folder "This is my folder" {
+ [Folder 3]
+ }
+ frame "Foo" {
+ [Frame 4]
+ }
+}
+
+[Another Component] --> [Example 1]
+[Example 1] --> [Folder 3]
+[Folder 3] --> [Frame 4]
+
+@enduml
+
+
+=== Gantt
+
+@startgantt
+skinparam handwritten true
+hide footbox
+Project starts the 2020-12-01
+
+[Task1] lasts 9 days
+sunday are closed
+
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+
+[Task2] lasts 10 days
+[Task2] starts 7 days after [Task1]'s end
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+
+-- end --
+@endgantt
+
+
+=== MindMap
+
+@startmindmap
+skinparam handwritten true
+* World
+** America
+*** Canada
+*** Mexico
+*** USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endmindmap
+
+
+=== Network
+
+@startuml
+skinparam handwritten true
+
+nwdiag {
+ network dmz {
+ address = "210.x.x.x/24"
+
+ web01 [address = "210.x.x.1"];
+ web02 [address = "210.x.x.2"];
+ }
+ network internal {
+ address = "172.x.x.x/24";
+
+ web01 [address = "172.x.x.1"];
+ web02 [address = "172.x.x.2"];
+ db01;
+ db02;
+ }
+}
+@enduml
+
+
+=== Object
+
+@startuml
+skinparam handwritten true
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 "1" -> "1" dia
+dia --> o3
+
+object London
+
+map CapitalCity {
+ UK *-> London
+ USA => Washington
+ Germany => Berlin
+}
+
+note right of London: Big ben
+user1 --> CapitalCity : visits >
+@enduml
+
+
+=== Salt
+
+@startsalt
+skinparam handwritten true
+mainframe This is a **mainframe**
+{+
+ Login | "MyName "
+ Password | "**** "
+ [Cancel] | [ OK ]
+}
+@endsalt
+
+
+=== Sequence
+
+@startuml
+skinparam handwritten true
+Alice -> Bob : hello
+note right: Not validated yet
+@enduml
+
+
+
+=== State
+
+@startuml
+skinparam handwritten true
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+
+
+=== Timing
+
+@startuml
+skinparam handwritten true
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+
+=== WBS
+
+@startwbs
+skinparam handwritten true
+* World
+** America
+*** Canada
+*** Mexico
+*** USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+
+=== Wire
+
+@startwire
+skinparam handwritten true
+* first
+* second_box [100x50]
+* third
+@endwire
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/hcl.adoc b/plantuml-docs/docs_from_alphadoc/hcl.adoc
new file mode 100644
index 00000000..bd6e7a9c
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/hcl.adoc
@@ -0,0 +1,32 @@
+== Display HCL Data
+
+'''
+๐ง - __Under construction__
+
+๐ functionality still in testing stage...
+These new features are still under construction ๐ง
+
+๐ง - __Under construction__
+'''
+
+You can use PlantUML to visualize your https://hcl.readthedocs.io/en/latest/index.html[HCL Configuration Languages].
+
+To activate this feature, the diagram must:
+* begin with `+@starthcl+` keyword
+* end with `+@endhcl+` keyword.
+
+
+@starthcl
+{
+key = "value"
+}
+@endhcl
+
+
+Ref.:
+* https://github.com/hashicorp/hcl[GH@hashicorp/hcl]
+* https://hcl.readthedocs.io/en/latest/index.html[HCL Configuration Languages].
+* https://github.com/plantuml/plantuml/search?q=HCL[HCL on GH@plantuml/plantuml]
+* https://forum.plantuml.net/17357/documentation-of-hcl-and-regex[QA-17357]
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/ie-diagram.adoc b/plantuml-docs/docs_from_alphadoc/ie-diagram.adoc
new file mode 100644
index 00000000..1f660f42
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/ie-diagram.adoc
@@ -0,0 +1,116 @@
+== Entity Relationship Diagram
+
+Based on the Information Engineering notation.
+
+This is an extension to the existing link::class-diagram[Class Diagram]. This extension adds:
+
+* Additional relations for the Information Engineering notation.
+* An `+entity+` alias that maps to the class diagram `+class+`.
+* An additional visibility modifier `+*+` to identify mandatory attributes.
+
+Otherwise, the syntax for drawing diagrams is the same as for class diagrams. All other features of class diagrams are also supported.
+
+
+
+== Information Engineering Relations
+
+|===
+| Type | Symbol
+
+| Zero or One
+| `+|o--+`
+
+| Exactly One
+| `+||--+`
+
+| Zero or Many
+| `+}o--+`
+
+| One or Many
+| `+}|--+`
+
+|===
+
+Examples:
+
+
+@startuml
+Entity01 }|..|| Entity02
+Entity03 }o..o| Entity04
+Entity05 ||--o{ Entity06
+Entity07 |o--|| Entity08
+@enduml
+
+
+
+
+== Entities
+
+
+@startuml
+entity Entity01 {
+ * identifying_attribute
+ --
+ * mandatory_attribute
+ optional_attribute
+}
+@enduml
+
+
+Again, this is the normal class diagram syntax (aside from use of `+entity+` instead of `+class+`). Anything that you can do in a class diagram can be done here.
+
+The `+*+` visibility modifier can be used to identify mandatory attributes. A space can be used after the modifier character to avoid conflicts with the creole bold:
+
+
+@startuml
+entity Entity01 {
+ optional attribute
+ **optional bold attribute**
+ * **mandatory bold attribute**
+}
+@enduml
+
+
+
+
+== Complete Example
+
+
+@startuml
+
+' hide the spot
+hide circle
+
+' avoid problems with angled crows feet
+skinparam linetype ortho
+
+entity "Entity01" as e01 {
+ *e1_id : number <>
+ --
+ *name : text
+ description : text
+}
+
+entity "Entity02" as e02 {
+ *e2_id : number <>
+ --
+ *e1_id : number <>
+ other_details : text
+}
+
+entity "Entity03" as e03 {
+ *e3_id : number <>
+ --
+ e1_id : number <>
+ other_details : text
+}
+
+e01 ||..o{ e02
+e01 |o..o{ e03
+
+@enduml
+
+
+Currently the crows feet do not look very good when the relationship is drawn at an angle to the entity. This can be avoided by using the `+linetype ortho+` skinparam.
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/index-full.adoc b/plantuml-docs/docs_from_alphadoc/index-full.adoc
new file mode 100644
index 00000000..245e7df0
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/index-full.adoc
@@ -0,0 +1,55 @@
+== PlantUML in a nutshell
+
+**PlantUML** is a component that allows to quickly write :
+
+* link::sequence-diagram[Sequence diagram]
+* link::use-case-diagram[Usecase diagram]
+* link::class-diagram[Class diagram]
+* link::activity-diagram-beta[Activity diagram] (here is link::activity-diagram-legacy[the legacy syntax)]
+* link::component-diagram[Component diagram]
+* link::state-diagram[State diagram]
+* link::object-diagram[Object diagram]
+* link::deployment-diagram[Deployment diagram] image::beta-icon.gif[]
+* link::timing-diagram[Timing diagram] image::beta-icon.gif[]
+
+The following non-UML diagrams are also supported:
+
+* link::salt[Wireframe graphical interface]
+* link::archimate-diagram[Archimate diagram]
+* link::activity-diagram-beta#sdl[Specification and Description Language (SDL)]
+* link::ditaa[Ditaa diagram]
+* link::gantt-diagram[Gantt diagram] image::beta-icon.gif[]
+* link::mindmap-diagram[MindMap diagram] image::beta-icon.gif[]
+* link::wbs-diagram[Work Breakdown Structure diagram] image::beta-icon.gif[]
+* link::ascii-math[Mathematic with AsciiMath or JLaTeXMath notation]
+* link::ie-diagram[Entity Relationship diagram]
+
+Diagrams are defined using a simple and intuitive language. (link::guide[see PlantUML Language Reference Guide]).
+
+New users can read the link::starting[quick start page]. There is also a link::faq[F.A.Q. page]. PlantUML can be used within link::running[many other tools].
+
+Images can be generated in PNG, link::svg[in SVG] or link::latex[in LaTeX] format. It is also possible to generate link::ascii-art[ASCII art diagrams] (only for sequence diagrams).
+
+'''
+
+**# online generations:**
+* Since ever __4242424242__
+* Last 24 hours __42424242__
+* Last hour __4242__
+* Last minute __42__
+
+|===
+| +++Example+++: +++ +++ __(You can edit the text if you want, the diagram will be dynamically updated!)__ | +++describes the following diagram :+++
+
+| `+Bob->Alice : hello+`
+| image::syffkj2rkt3coknelr1io4zdosa70000.png[]
+
+|===
+
+This example is working thanks to the http://www.plantuml.com/plantuml[online demo server].
+
+'''
+
+__You can contribute on this page by clicking here.__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/index.adoc b/plantuml-docs/docs_from_alphadoc/index.adoc
new file mode 100644
index 00000000..392e9efb
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/index.adoc
@@ -0,0 +1,44 @@
+== PlantUML in a nutshell
+
+**PlantUML** is a component that allows you to quickly write:
+
+* link::sequence-diagram[Sequence diagram]
+* link::use-case-diagram[Usecase diagram]
+* link::class-diagram[Class diagram]
+* link::object-diagram[Object diagram]
+* link::activity-diagram-beta[Activity diagram] (here is link::activity-diagram-legacy[the legacy syntax])
+* link::component-diagram[Component diagram]
+* link::deployment-diagram[Deployment diagram]
+* link::state-diagram[State diagram]
+* link::timing-diagram[Timing diagram]
+
+The following non-UML diagrams are also supported:
+
+* link::json[JSON data]
+* link::yaml[YAML data]
+* link::ebnf[Extended Backus-Naur Form (EBNF) diagram]
+* link::nwdiag[Network diagram (nwdiag)]
+* link::salt[Wireframe graphical interface or UI mockups (salt)]
+* link::archimate-diagram[Archimate diagram]
+* link::activity-diagram-beta#sdl[Specification and Description Language (SDL)]
+* link::ditaa[Ditaa diagram]
+* link::gantt-diagram[Gantt diagram]
+* link::mindmap-diagram[MindMap diagram]
+* link::wbs-diagram[Work Breakdown Structure diagram (WBS)]
+* link::ascii-math[Mathematic with AsciiMath or JLaTeXMath notation]
+* link::ie-diagram[Entity Relationship diagram (IE/ER)]
+
+Furthermore:
+* link::link[Hyperlinks and tooltips]
+* link::creole[Creole]: rich text, emoticons, unicode, icons
+* link::openiconic[OpenIconic icons]
+* link::sprite[Sprite icons]
+* link::ascii-math[AsciiMath mathematical expressions]
+
+Diagrams are defined using a simple and intuitive language. (link::guide[see PlantUML Language Reference Guide]).
+
+New users can read the link::starting[quick start page]. There is also a link::faq[F.A.Q. page]. PlantUML can be used within link::running[many other tools].
+
+Images can be generated in PNG, link::svg[in SVG] or link::latex[in LaTeX] format. It is also possible to generate link::ascii-art[ASCII art diagrams] (only for sequence diagrams).
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/issues.adoc b/plantuml-docs/docs_from_alphadoc/issues.adoc
new file mode 100644
index 00000000..0730e320
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/issues.adoc
@@ -0,0 +1,51 @@
+== If you see something, say something
+
+Just edit this part to tell us what is not working well.
+
+Thanks!
+
+
+== Links to target URLs with parentheses
+
+Links to URLs with parentheses `+(+` and `+)+` don't seem to work in any of the 3 syntaxes offered. See e.g. the link to `+https://en.wikipedia.org/wiki/Creole_(markup)+` at http://alphadoc.plantuml.com/doc/asciidoc/en/formatting[formatting].
+
+[[#98FB98#DONE]] With use of https://en.wikipedia.org/wiki/Percent-encoding[Percent-encoding] โ https://en.wikipedia.org/wiki/Creole\_%28markup%29[Creole]
+
+
+== How to change order of the first paragraph?
+
+On __"Edit Table Of Content order"__:
+* How to change order of the first paragraph?
+
+We can change the order of all the other ยง, but not of the first!
+
+[[#98fb98#workaround]] A possible workaround is to overwrite the 1st ยง.
+And create a new ยง, with the old 1st ยง.
+
+
+== How to add code and image on table?
+
+How to add code and image on table?
+
+
+Here is a test :
+
+|===
+| code | output
+
+| `+"actor"+`
+| +++ +++"actor"+++ +++
+
+|===
+
+the `++++ +++"actor"+++ ++++` is not evaluate?
+
+like:
+
+
+@startuml
+"actor"
+@enduml
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/javadoc.adoc b/plantuml-docs/docs_from_alphadoc/javadoc.adoc
new file mode 100644
index 00000000..29e88243
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/javadoc.adoc
@@ -0,0 +1,48 @@
+== New Doclet
+A new enhanced doclet (written by Gerald Boersma) is now available.
+
+It has much more option than the legacy previous one.
+
+You will find https://github.com/gboersma/uml-java-doclet[detailed instructions here.]
+
+
+
+== Legacy Javadoc
+When the javadoc tools build the documentation, it copies all files
+included in the `+doc-files+` directory to the javadoc . (see http://www.oracle.com/technetwork/java/javase/documentation/index-137868.html[How to Write Doc Comments for the Javadoc Tool]).
+
+You can take advantage of this feature like this:
+
+----
+package net.demo1;
+/**
+* Demonstration for PlantUML.
+*
+
+
+
+
+----
+
+
+The 3 files `+jquery.js+`, `+jquery_plantuml.js+` and `+rawdeflate.js+` have
+to be available on your server.
+
+
+
+== How does it works?
+There is nothing magic here:
+* http://jquery.com/[JQuery] simply parses the html source file on loading,
+* Then all `+uml+` descriptions are transformed into links to http://www.plantuml.com[plantuml.com] site. (like for link::code-javascript-asynchronous[Javascript integration].)
+
+And you can http://sourceforge.net/projects/plantuml/files/jquery_plantuml.zip/download[download the complete package here].
+
+
+
+== Complete source example
+
+----
+
+
+
+
+
+
+
+
+
Example
+
+
+
+
+
+
+
+----
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/json-issues.adoc b/plantuml-docs/docs_from_alphadoc/json-issues.adoc
new file mode 100644
index 00000000..c7be0647
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/json-issues.adoc
@@ -0,0 +1,24 @@
+== JSON Diagram issues (json-issues)
+
+This page lists issues on link::json[JSON Diagram].
+
+
+== JSON two-character escape sequence issues
+
+
+[[#661111#FIXME]]
+FIXME `+\n+` and `+\+` management in PlantUML ๐
+__See https://forum.plantuml.net/13066[Report Bug on QA-13066]__
+[[#661111#FIXME]]
+
+@startjson
+[
+"\\\\",
+"\\n",
+"\\r",
+"\\t"
+]
+@endjson
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/json.adoc b/plantuml-docs/docs_from_alphadoc/json.adoc
new file mode 100644
index 00000000..76f048c6
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/json.adoc
@@ -0,0 +1,447 @@
+== Display JSON Data
+
+https://en.wikipedia.org/wiki/JSON[JSON] format is widely used in software.
+
+You can use PlantUML to visualize your data.
+
+To activate this feature, the diagram must:
+* begin with `+@startjson+` keyword
+* end with `+@endjson+` keyword.
+
+
+@startjson
+{
+ "fruit":"Apple",
+ "size":"Large",
+ "color": ["Red", "Green"]
+}
+@endjson
+
+
+
+== Complex example
+
+You can use complex JSON structure.
+
+
+@startjson
+{
+ "firstName": "John",
+ "lastName": "Smith",
+ "isAlive": true,
+ "age": 27,
+ "address": {
+ "streetAddress": "21 2nd Street",
+ "city": "New York",
+ "state": "NY",
+ "postalCode": "10021-3100"
+ },
+ "phoneNumbers": [
+ {
+ "type": "home",
+ "number": "212 555-1234"
+ },
+ {
+ "type": "office",
+ "number": "646 555-4567"
+ }
+ ],
+ "children": [],
+ "spouse": null
+}
+@endjson
+
+
+
+== Highlight parts
+
+
+@startjson
+#highlight "lastName"
+#highlight "address" / "city"
+#highlight "phoneNumbers" / "0" / "number"
+{
+ "firstName": "John",
+ "lastName": "Smith",
+ "isAlive": true,
+ "age": 28,
+ "address": {
+ "streetAddress": "21 2nd Street",
+ "city": "New York",
+ "state": "NY",
+ "postalCode": "10021-3100"
+ },
+ "phoneNumbers": [
+ {
+ "type": "home",
+ "number": "212 555-1234"
+ },
+ {
+ "type": "office",
+ "number": "646 555-4567"
+ }
+ ],
+ "children": [],
+ "spouse": null
+}
+@endjson
+
+
+
+== JSON basic element
+
+=== Synthesis of all JSON basic element
+
+@startjson
+{
+"null": null,
+"true": true,
+"false": false,
+"JSON_Number": [-1, -1.1, "TBC"],
+"JSON_String": "a\nb\rc\td TBC...",
+"JSON_Object": {
+ "{}": {},
+ "k_int": 123,
+ "k_str": "abc",
+ "k_obj": {"k": "v"}
+},
+"JSON_Array" : [
+ [],
+ [true, false],
+ [-1, 1],
+ ["a", "b", "c"],
+ ["mix", null, true, 1, {"k": "v"}]
+]
+}
+@endjson
+
+
+
+== JSON array or table
+
+=== Array type
+
+@startjson
+{
+"Numeric": [1, 2, 3],
+"String ": ["v1a", "v2b", "v3c"],
+"Boolean": [true, false, true]
+}
+@endjson
+
+
+
+=== Minimal array or table
+==== Number array
+
+@startjson
+[1, 2, 3]
+@endjson
+
+
+==== String array
+
+@startjson
+["1a", "2b", "3c"]
+@endjson
+
+
+==== Boolean array
+
+@startjson
+[true, false, true]
+@endjson
+
+
+
+== JSON numbers
+
+
+@startjson
+{
+"DecimalNumber": [-1, 0, 1],
+"DecimalNumber . Digits": [-1.1, 0.1, 1.1],
+"DecimalNumber ExponentPart": [1E5]
+}
+@endjson
+
+
+
+== JSON strings
+
+=== JSON Unicode
+
+On JSON you can use Unicode directly or by using escaped form like `+\uXXXX+`.
+
+
+@startjson
+{
+ "code": "value",
+ "a\\u005Cb": "a\u005Cb",
+ "\\uD83D\\uDE10": "\uD83D\uDE10",
+ "๐": "๐"
+}
+@endjson
+
+
+=== JSON two-character escape sequence
+
+
+@startjson
+{
+ "**legend**: character name": ["**two-character escape sequence**", "example (between 'a' and 'b')"],
+ "quotation mark character (U+0022)": ["\\\"", "a\"b"],
+ "reverse solidus character (U+005C)": ["\\\\", "a\\b"],
+ "solidus character (U+002F)": ["\\\/", "a\/b"],
+ "backspace character (U+0008)": ["\\b", "a\bb"],
+ "form feed character (U+000C)": ["\\f", "a\fb"],
+ "line feed character (U+000A)": ["\\n", "a\nb"],
+ "carriage return character (U+000D)": ["\\r", "a\rb"],
+ "character tabulation character (U+0009)": ["\\t", "a\tb"]
+}
+@endjson
+
+
+
+[[#661111#FIXME]]
+FIXME or not ๐, on the same item as `+\n+` management in PlantUML ๐
+__See https://forum.plantuml.net/13066[Report Bug on QA-13066]__
+[[#661111#FIXME]]
+
+@startjson
+[
+"\\\\",
+"\\n",
+"\\r",
+"\\t"
+]
+@endjson
+
+
+
+== Minimal JSON examples
+
+
+@startjson
+"Hello world!"
+@endjson
+
+
+
+@startjson
+42
+@endjson
+
+
+
+@startjson
+true
+@endjson
+
+
+__(Examples come from https://tools.ietf.org/html/std90#page-13[STD 90 - Examples])__
+
+
+== Empty table or list
+
+
+@startjson
+{
+ "empty_tab": [],
+ "empty_list": {}
+}
+@endjson
+
+
+__[Ref. https://forum.plantuml.net/14397[QA-14397]]__
+
+
+== Using (global) style
+
+=== Without style __(by default)__
+
+@startjson
+#highlight "1" / "hr"
+[
+ {
+ "name": "Mark McGwire",
+ "hr": 65,
+ "avg": 0.278
+ },
+ {
+ "name": "Sammy Sosa",
+ "hr": 63,
+ "avg": 0.288
+ }
+]
+@endjson
+
+
+
+=== With style
+
+You can use link::style-evolution[style] to change rendering of elements.
+
+
+@startjson
+
+#highlight "1" / "hr"
+[
+ {
+ "name": "Mark McGwire",
+ "hr": 65,
+ "avg": 0.278
+ },
+ {
+ "name": "Sammy Sosa",
+ "hr": 63,
+ "avg": 0.288
+ }
+]
+@endjson
+
+
+__[Adapted from https://forum.plantuml.net/13123[QA-13123] and https://forum.plantuml.net/13288/[QA-13288]]__
+
+
+== Display JSON Data on Class or Object diagram
+
+=== Simple example
+
+@startuml
+class Class
+object Object
+json JSON {
+ "fruit":"Apple",
+ "size":"Large",
+ "color": ["Red", "Green"]
+}
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/15481/possible-link-elements-from-two-jsons-with-both-jsons-embeded?show=15567#c15567[QA-15481]]__
+
+=== Complex example: with all JSON basic element
+
+
+@startuml
+json "JSON basic element" as J {
+"null": null,
+"true": true,
+"false": false,
+"JSON_Number": [-1, -1.1, "TBC"],
+"JSON_String": "a\nb\rc\td TBC...",
+"JSON_Object": {
+ "{}": {},
+ "k_int": 123,
+ "k_str": "abc",
+ "k_obj": {"k": "v"}
+},
+"JSON_Array" : [
+ [],
+ [true, false],
+ [-1, 1],
+ ["a", "b", "c"],
+ ["mix", null, true, 1, {"k": "v"}]
+]
+}
+@enduml
+
+
+
+== Display JSON Data on Deployment (Usecase, Component, Deployment) diagram
+
+=== Simple example
+
+@startuml
+allowmixing
+
+component Component
+actor Actor
+usecase Usecase
+() Interface
+node Node
+cloud Cloud
+
+json JSON {
+ "fruit":"Apple",
+ "size":"Large",
+ "color": ["Red", "Green"]
+}
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/15481/possible-link-elements-from-two-jsons-with-both-jsons-embeded?show=15567#c15567[QA-15481]]__
+
+Complex example: with arrow
+
+@startuml
+allowmixing
+
+agent Agent
+stack {
+ json "JSON_file.json" as J {
+ "fruit":"Apple",
+ "size":"Large",
+ "color": ["Red", "Green"]
+ }
+}
+database Database
+
+Agent -> J
+J -> Database
+@enduml
+
+
+
+== Display JSON Data on State diagram
+
+=== Simple example
+
+@startuml
+state "A" as stateA
+state "C" as stateC {
+ state B
+}
+
+json J {
+ "fruit":"Apple",
+ "size":"Large",
+ "color": ["Red", "Green"]
+}
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/17275/composite-state-functionality-with-allow_mixing?show=17287#a17287[QA-17275]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/latex.adoc b/plantuml-docs/docs_from_alphadoc/latex.adoc
new file mode 100644
index 00000000..86766bbf
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/latex.adoc
@@ -0,0 +1,67 @@
+== LaTeX
+
+Starting from version 7997, PlantUML allows to generate diagrams into http://en.wikipedia.org/wiki/LaTeX[LaTeX], thanks to http://en.wikipedia.org/wiki/Tikz[Tikz package].
+
+Note that this is still beta, and many things won't probably work. Since we do not want to spend time on features not used, we will wait for users http://forum.plantuml.net/1798/latex-tikz-support[to report bugs here].
+
+You just have to use the flag `+-tlatex+` with the link::command-line[command line], or `+format="latex"+` with the link::ant-task[Ant task].
+
+If you want to include the LaTeX output directly into another LaTeX document you can use `+-tlatex:nopreamble+`. This way PlantUML will only export the tikz-picture itself, without the document preamble.
+
+
+== Class diagram example
+
+----
+@startuml
+class Subscriber {
+ subscriberId
+}
+
+class AccumUsage {
+ subscriberId
+}
+
+class IpSession {
+ ipAddress
+ specificData
+ sapcOriginStateId
+ apnId
+}
+
+Subscriber "1" -[#blue]-> "1..*" IpSession
+Subscriber "1" --> "0..1" AccumUsage
+@enduml
+----
+
+https://www.writelatex.com/read/pgkkspzgzgpb[See result online] (TODO: https://github.com/plantuml/plantuml/issues/362[#362])
+
+
+== Sequence diagram example
+
+----
+@startuml
+Bob -> Alice: hello
+return Ok
+@enduml
+----
+
+https://www.writelatex.com/read/vmrvxnvzytbr[See result online] (TODO: https://github.com/plantuml/plantuml/issues/362[#362])
+
+
+== Latex Links
+
+If you use the `+hyperref+` package then you can make links to defined anchors within your Latex/PDF document.
+For example, the second and last links below are to the Latx document:
+
+----
+@startuml
+participant Bob [[http://www.yahoo.com]]
+participant Alice [[latex://resource-interaction]]
+Bob -> Alice : [[http://www.google.com]] hello
+Bob -> Alice : [[latex://resource-interaction]] interact
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/3558[QA-3558]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/link.adoc b/plantuml-docs/docs_from_alphadoc/link.adoc
new file mode 100644
index 00000000..fc3704c5
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/link.adoc
@@ -0,0 +1,480 @@
+== Format definition
+
+[plantuml]
+----
+@startuml
+scale 0.75
+left to right direction
+frame "How is a PlantUML hyperlink?" #aliceblue {
+
+rectangle rb [
+""[[""
+]
+
+frame "optional" as fu #palegreen {
+frame u [
+URL
+]
+}
+
+frame "optional" as ft #palegreen {
+rectangle tb [
+""{""
+]
+frame t [
+a tooltip
+]
+rectangle te [
+""}""
+]
+}
+
+frame "optional" as l #palegreen {
+rectangle s [
+""โฃ""
+]
+frame ll [
+a label
+]
+}
+rectangle fe [
+""]]""
+]
+}
+rb -- u
+u -- tb
+tb -- t
+t -- te
+te - s
+ll -- fe
+u -- s
+s -- ll
+u -- fe
+te -- fe
+@enduml
+----
+
+
+==== Simple link
+
+Simple links are define using two square brackets (or three square brackets for field or method on class diagram).
+
++++Example+++:
+* `+[[http://plantuml.com]]+`
+* `+[[]]+` __(empty link)__
+
+==== Link with optional label
+
+It is possible to give an optional label that will be printed instead of the link itself.
+A space is used as separator after the URL itself.
+
++++Example+++:
+`+[[http://plantuml.com This label is printed]]+`
+
+==== Link with optional tooltip
+
+Finally you can also have an optional tooltip using round brackets, just after the URL and before the optional label.
+
++++Example+++:
+`+[[http://plantuml.com{Optional tooltip} This label is printed]]+`
+
+==== Only tooltip
+You can also have only a tooltip using round brackets.
+
++++Example+++:
+`+[[{A tooltip}]]+`
+
+==== Only tooltip and label
+You can also have only a tooltip using round brackets, and a label.
+
++++Example+++:
+`+[[{A tooltip} This label is printed]]+`
+
+==== URL authentication
+
+With link::url-authentication[URL authentication] it is possible to provide an authentication method, credentials, and a proxy config to URL endpoints.
+
+
+== Links contained curly bracket
+
+A link can contain some curly brackets.
+
+
+@startuml
+[[link{with_bracket}&id=10]]:Some activity\n(with link with brackets)\n""link{with_bracket}&id=10"";
+[["link{with_bracket}"{}]]:Some activity\n(with link with brackets and empy tooltip)\n"""link{with_bracket}"{}"";
+[["link{with_bracket}"{with tooltip}]]:Some activity\n(with link finished by brackets and tooltip)\n"""link{with_bracket}"{with tooltip}"";
+[["link{with_bracket}&id=10"{with tooltip}]]:Some activity\n(with link with brackets and tooltip)\n"""link{with_bracket}&id=10"{with tooltip}"";
+@enduml
+
+
+
+__[Ref. https://forum.plantuml.net/13489/[QA-13489]]__
+
+
+== Links in sequence diagram
+
+The following example lists some links features:
+
+
+
+@startuml
+actor Bob [[http://plantuml.com/sequence]]
+actor "This is [[http://plantuml.com/sequence Alice]] actor" as Alice
+Bob -> Alice [[http://plantuml.com/start]] : hello
+note left [[http://plantuml.com/start]]
+ a note with a link
+end note
+Alice -> Bob : hello with [[http://plantuml.com/start{Tooltip for message} some link]]
+note right [[http://plantuml.com/start]] : another note
+note left of Bob
+You can use [[http://plantuml.com/start links in notes]] also.
+end note
+@enduml
+
+
+
+
+== Links in class diagram
+
+@startuml
+class Car [[http://plantuml.com/link]]
+class Wheel [[http://plantuml.com/sequence]]
+note left [[http://plantuml.com]]
+foo
+end note
+Car *-- Wheel [[http://plantuml.com/class]] : has some
+@enduml
+
+
+There is a special syntax with 3 square brackets in class definition when you want to define
+a link on field or method.
+For example:
+
+
+@startuml
+class Car {
+ - Some field [[[http://plantuml.com]]]
+ Some method() [[[http://plantuml.com/link]]]
+}
+@enduml
+
+
+
+@startuml
+Object <|-- Foo
+
+class Foo {
+ + Object[] [[[http://www.google.com]]]
+ + methods1() [[[http://www.yahoo.com/A1{Some explainations about this method}]]]
+ + methods2() [[[http://www.yahoo.com/A2]]]
+}
+
+class Foo2 {
+ + methods1() [[[http://www.yahoo.com/B1]]]
+ + methods2() [[[http://www.yahoo.com/B2]]]
+}
+
+class Object [[http://www.yahoo.com]]
+@enduml
+
+
+
+== Links in activity diagram
+
+=== On activity label
+
+@startuml
+start
+[[http://plantuml.com]]:Some activity;
+:Some [[http://plantuml.com link]];
+end
+@enduml
+
+
+=== On partition
+
+@startuml
+start
+partition "[[http://plantuml.com partition_name]]" {
+ :read doc. on [[http://plantuml.com plantuml_website]];
+ :test diagram;
+}
+end
+@enduml
+
+__[Ref. https://forum.plantuml.net/542/ability-to-define-hyperlink-on-diagram-elements?show=14003#c14003[QA-542]]__
+
+
+== Links in Network diagram (nwdiag)
+
+
+@startuml
+nwdiag {
+ network Network {
+ Server [description="A [[http://plantuml.com link]] on nwdiag"];
+ }
+}
+@enduml
+
+
+
+== Links in JSON/YAML diagram
+
+=== JSON
+
+@startjson
+{
+"@fruit": "Apple",
+"$size": "Large",
+"Appli.": "A [[http://plantuml.com link]] on JSON"
+}
+@endjson
+
+
+=== YAML
+
+@startyaml
+@fruit: Apple
+$size: Large
+Appli.: A [[http://plantuml.com link]] on YAML
+@endyaml
+
+
+
+== Links in notes
+
+It is also possible to specify a link at the beginning of a note (the link applies to the full note), or inside a note (for a portion of the note).
+
+@startuml
+:Foo:
+note left of Foo [[http://www.google.com]]
+This is a note
+end note
+
+note right of Foo
+Yet another link to [[http://www.google.com]] as demo.
+You can also [[http://www.yahoo.fr specify a text]] for the link.
+And even [[http://www.yahoo.fr{This is a tooltip} add a tooltip]] to the link.
+end note
+@enduml
+
+
+__[Ref. http://wiki.plantuml.net/site/incubation#url_in_diagrams[Incubation: URL in diagrams]]__
+
+
+== Links with explicit URL directive
+
+You can use the `+url of XXX is [[yyy]]+` syntax:
+
+=== On sequence diagram
+
+@startuml
+Bob -> Alice : ok
+url of Bob is [[http://www.google.com]]
+@enduml
+
+
+=== On class diagram
+
+@startuml
+skinparam topurl http://www.google.com
+Dog --|> Mammal
+url of Mammal is [[/search]]
+url of Dog is [[http://www.yahoo.com{This is Dog}]]
+Dog o-- Cat
+Cat --|> Mammal
+@enduml
+
+
+
+=== On usecase diagram
+
+@startuml
+actor Mamal
+usecase Dog
+
+url of Mamal is [[http://www.google.com]]
+url of Dog is [[http://www.yahoo.com{This is Dog}]]
+@enduml
+
+
+=== On component or deployment diagram
+
+@startuml
+node Mamal
+component Dog
+
+url of Mamal is [[http://www.google.com]]
+url of Dog is [[http://www.yahoo.com{This is Dog}]]
+@enduml
+
+
+__[Ref. http://wiki.plantuml.net/site/incubation#url_in_diagrams[Incubation: URL in diagrams]]__
+
+
+== Links in arrow (or Hyperlinks in link or connection)
+
+=== Class diagram
+
+@startuml
+class Car
+Car *-- Wheel [[http://plantuml.com/class-diagram]] : has some
+@enduml
+
+
+=== Component or Deployment diagram
+
+[[#FFD700#FIXME]] ๐ฉ
+See Wanted features https://forum.plantuml.net/6397[QA-6397]
+[[#FFD700#FIXME]]
+
+@startuml
+node Car
+Car *-- Wheel [[http://plantuml.com/deployment-diagram]] : has some
+@enduml
+
+
+
+__[Ref. https://forum.plantuml.net/6397[QA-6397]]__
+
+
+=== State diagram
+
+[[#FFD700#FIXME]] ๐ฉ
+Same Issue
+[[#FFD700#FIXME]]
+
+@startuml
+state Car
+state CarWithWheel
+Car -> CarWithWheel [[http://plantuml.com/state-diagram]] : Add wheel to car
+@enduml
+
+
+
+== Specific SkinParameter for Link
+
+=== hyperlinkColor
+
+You can change the `+color+` value of the links with the `+hyperlinkColor+` setting.
+
+
+@startuml
+:hyperlinkColor setting, by default;
+:[[http://plantuml.com]];
+@enduml
+
+
+
+@startuml
+skinparam hyperlinkColor red
+:hyperlinkColor setting;
+:[[http://plantuml.com]];
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/2322/increasing-visibility-of-links[QA-2322]]__
+
+=== hyperlinkUnderline
+
+You can underline or not the links with the `+hyperlinkUnderline+` setting.
+
+
+@startuml
+skinparam hyperlinkUnderline true
+:hyperlinkColor setting;
+:[[http://plantuml.com]];
+@enduml
+
+
+@startuml
+skinparam hyperlinkUnderline false
+:hyperlinkColor setting;
+:[[http://plantuml.com]];
+@enduml
+
+
+๐ฉ__'hyperlinkUnderline false' seems broken...__ ๐
+
+__[Ref. https://forum.plantuml.net/2866/decreasing-visibility-of-links[QA-2866], https://forum.plantuml.net/15114[QA-15114]]__
+
+
+=== topurl
+
+You can use `+topurl+` setting, in order to define the prefix for all the links on a PlantUML diagram, as:
+
+
+@startmindmap
+
+skinparam topurl https://plantuml.com/
+
+* [[index PlantUML website]]
+** [[sequence-diagram Sequence]]
+** [[mindmap-diagram MindMap]]
+** [[wbs-diagram WBS]]
+** ...
+@endmindmap
+
+
+__[Ref. https://forum.plantuml.net/9016/dashed-vs-solid-lines-in-sequence-diagrams?show=9023#c9023[QA-9016], https://forum.plantuml.net/13179/how-the-skinparam-topurl-works-url-links[QA-13179] ]__
+
+== Other SkinParameter for Link
+
+You can see also on:
+* link::svg#34q86jw7xgn8k362kjon[Specific SkinParameter for SVG]
+
+
+== Using (global) style
+
+=== Without style __(by default)__
+
+@startuml
+title test on HyperlinkColor [[test link]]
+
+ class test <> {
+ * aaa
+ + [[normal model]]
+ - bb
+ }
+
+ class test_with_stereo AS "[[http://www.plantuml.com test]]" <> {
+ * aaa
+ + [[red model]]
+ - bb
+ }
+@enduml
+
+
+
+=== With style
+
+You can use link::style-evolution[style] to change rendering of elements.
+
+
+@startuml
+
+
+title test on HyperlinkColor [[test link]]
+
+ class test <> {
+ * aaa
+ + [[normal model]]
+ - bb
+ }
+
+ class test_with_stereo AS "[[http://www.plantuml.com test]]" <> {
+ * aaa
+ + [[red model]]
+ - bb
+ }
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/8071/[QA-8071]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/menu.adoc b/plantuml-docs/docs_from_alphadoc/menu.adoc
new file mode 100644
index 00000000..b34fdbf5
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/menu.adoc
@@ -0,0 +1,77 @@
+== Translation of the menus
+
+|===
+| EN | EN
+
+| Sequence
+| Sequence
+
+| Use Case
+| Use Case
+
+| Class
+| Class
+
+| Activity
+| Activity
+
+| Component
+| Component
+
+| State
+| State
+
+| Object
+| Object
+
+| Deployment
+| Deployment
+
+| Timing
+| Timing
+
+| Home
+| Home
+
+| What's New ?
+| What's New ?
+
+| Getting Started
+| Getting Started
+
+| Running
+| Running
+
+| F.A.Q.
+| F.A.Q.
+
+| Dedication
+| Dedication
+
+| Download
+| Download
+
+| Forum
+| Forum
+
+| Preprocessing
+| Preprocessing
+
+| Commons
+| Commons
+
+| Standard Library
+| Standard Library
+
+| Site Map
+| Site Map
+
+| PDF Guide
+| PDF Guide
+
+| External Links
+| External Links
+
+|===
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/mindmap-diagram.adoc b/plantuml-docs/docs_from_alphadoc/mindmap-diagram.adoc
new file mode 100644
index 00000000..afdd8b06
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/mindmap-diagram.adoc
@@ -0,0 +1,443 @@
+== MindMap
+
+MindMap diagram are still in beta: the syntax may change without notice.
+
+
+
+== OrgMode syntax
+
+This syntax is compatible with OrgMode
+
+
+@startmindmap
+* Debian
+** Ubuntu
+*** Linux Mint
+*** Kubuntu
+*** Lubuntu
+*** KDE Neon
+** LMDE
+** SolydXK
+** SteamOS
+** Raspbian with a very long name
+*** Raspmbc => OSMC
+*** Raspyfi => Volumio
+@endmindmap
+
+
+
+== Markdown syntax
+
+This syntax is compatible with Markdown
+
+
+@startmindmap
+* root node
+ * some first level node
+ * second level node
+ * another second level node
+ * another first level node
+@endmindmap
+
+
+
+== Arithmetic notation
+
+You can use the following notation to choose diagram side.
+
+
+@startmindmap
++ OS
+++ Ubuntu
++++ Linux Mint
++++ Kubuntu
++++ Lubuntu
++++ KDE Neon
+++ LMDE
+++ SolydXK
+++ SteamOS
+++ Raspbian
+-- Windows 95
+-- Windows 98
+-- Windows NT
+--- Windows 8
+--- Windows 10
+@endmindmap
+
+
+
+== Multilines
+
+You can use `+:+` and `+;+` to have multilines box.
+
+
+@startmindmap
+* Class Templates
+**:Example 1
+
+template
+class cname{
+void f1()
+...
+}
+
+;
+**:Example 2
+
+other template
+class cname{
+...
+
+;
+@endmindmap
+
+
+
+@startmindmap
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+
+
+== Multiroot Mindmap
+
+You can create multiroot mindmap, as:
+
+
+@startmindmap
+* Root 1
+** Foo
+** Bar
+* Root 2
+** Lorem
+** Ipsum
+@endmindmap
+
+
+__[Ref. https://github.com/plantuml/plantuml/issues/773[QH-773]]__
+
+
+== Colors
+
+It is possible to change node link::color[color].
+
+=== With inline color
+
+* OrgMode syntax mindmap
+
+@startmindmap
+*[#Orange] Colors
+**[#lightgreen] Green
+**[#FFBBCC] Rose
+**[#lightblue] Blue
+@endmindmap
+
+
+* Arithmetic notation syntax mindmap
+
+@startmindmap
++[#Orange] Colors
+++[#lightgreen] Green
+++[#FFBBCC] Rose
+--[#lightblue] Blue
+@endmindmap
+
+
+* Markdown syntax mindmap
+
+@startmindmap
+*[#Orange] root node
+ *[#lightgreen] some first level node
+ *[#FFBBCC] second level node
+ *[#lightblue] another second level node
+ *[#lightgreen] another first level node
+@endmindmap
+
+
+=== With style color
+
+* OrgMode syntax mindmap
+
+@startmindmap
+
+* Colors
+** Green <>
+** Rose <>
+** Blue <>
+@endmindmap
+
+
+* Arithmetic notation syntax mindmap
+
+@startmindmap
+
++ Colors
+++ Green <>
+++ Rose <>
+-- Blue <>
+@endmindmap
+
+
+* Markdown syntax mindmap
+
+@startmindmap
+
+* root node
+ * some first level node <>
+ * second level node <>
+ * another second level node <>
+ * another first level node <>
+@endmindmap
+
+
+
+== Removing box
+
+You can remove the box drawing using an underscore.
+
+
+@startmindmap
+* root node
+** some first level node
+***_ second level node
+***_ another second level node
+***_ foo
+***_ bar
+***_ foobar
+** another first level node
+@endmindmap
+
+
+@startmindmap
+*_ root node
+**_ some first level node
+***_ second level node
+***_ another second level node
+***_ foo
+***_ bar
+***_ foobar
+**_ another first level node
+@endmindmap
+
+
+
+@startmindmap
++ root node
+++ some first level node
++++_ second level node
++++_ another second level node
++++_ foo
++++_ bar
++++_ foobar
+++_ another first level node
+-- some first right level node
+--_ another first right level node
+@endmindmap
+
+
+
+== Changing diagram direction
+
+It is possible to use both sides of the diagram.
+
+
+@startmindmap
+* count
+** 100
+*** 101
+*** 102
+** 200
+
+left side
+
+** A
+*** AA
+*** AB
+** B
+@endmindmap
+
+
+
+== Complete example
+
+
+@startmindmap
+caption figure 1
+title My super title
+
+* <&flag>Debian
+** <&globe>Ubuntu
+*** Linux Mint
+*** Kubuntu
+*** Lubuntu
+*** KDE Neon
+** <&graph>LMDE
+** <&pulse>SolydXK
+** <&people>SteamOS
+** <&star>Raspbian with a very long name
+*** Raspmbc => OSMC
+*** Raspyfi => Volumio
+
+header
+My super header
+endheader
+
+center footer My super footer
+
+legend right
+ Short
+ legend
+endlegend
+@endmindmap
+
+
+
+== Changing style
+
+=== node, depth
+
+@startmindmap
+
+* Linux
+** NixOS
+** Debian
+*** Ubuntu
+**** Linux Mint
+**** Kubuntu
+**** Lubuntu
+**** KDE Neon
+@endmindmap
+
+
+=== boxless
+
+@startmindmap
+
+* Linux
+** NixOS
+** Debian
+***_ Ubuntu
+**** Linux Mint
+**** Kubuntu
+**** Lubuntu
+**** KDE Neon
+@endmindmap
+
+
+
+== Word Wrap
+
+Using `+MaximumWidth+` setting you can control automatic word wrap. Unit used is pixel.
+
+
+@startmindmap
+
+
+
+
+* Hi =)
+** sometimes i have node in wich i want to write a long text
+*** this results in really huge diagram
+**** of course, i can explicit split with a\nnew line
+**** but it could be cool if PlantUML was able to split long lines, maybe with an option
+
+@endmindmap
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/notes.adoc b/plantuml-docs/docs_from_alphadoc/notes.adoc
new file mode 100644
index 00000000..1d1ea9e2
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/notes.adoc
@@ -0,0 +1,431 @@
+== Notes
+
+Here are some examples of notes on diagrams.
+
+
+== Appendice: Examples of "Note on link" on all diagrams
+
+=== Activity
+N/A
+
+=== Class
+
+@startuml
+class a
+
+a -> b: //link label//
+note on link
+ Link note
+end note
+@enduml
+
+
+=== Component, Deployment
+
+@startuml
+node a
+node b
+
+a -> b: //link label//
+note on link
+ Link note
+end note
+@enduml
+
+
+=== Gantt project planning
+
+N/A
+
+
+=== Object
+
+@startuml
+object a
+object b
+
+a -> b: //link label//
+note on link
+ Link note
+end note
+@enduml
+
+
+=== MindMap
+
+N/A
+
+=== Network (nwdiag)
+
+N/A
+
+
+=== Sequence
+
+N/A
+
+=== State
+
+@startuml
+state a
+state b
+
+a -> b: //link label//
+note on link
+ Link note
+end note
+@enduml
+
+
+=== Use-Case
+
+@startuml
+(a)
+(b)
+
+a -> b: //link label//
+note on link
+ Link note
+end note
+@enduml
+
+
+
+== Appendice: Examples of "Note [top\|right\|bottom\|left] on link" on all diagrams
+
+=== Activity
+N/A
+
+=== Class
+
+@startuml
+class a
+
+a -> b: //link label//
+note top on link
+ Link note
+end note
+b ---> c: //link label//
+note right on link
+ Link note
+end note
+d <- c: //link label//
+note bottom on link
+ Link note
+end note
+a <--- d: //link label//
+note left on link
+ Link note
+end note
+@enduml
+
+
+=== Component, Deployment
+
+@startuml
+node a
+node b
+node c
+node d
+
+a -> b: //link label//
+note top on link
+ Link note
+end note
+b ---> c: //link label//
+note right on link
+ Link note
+end note
+d <- c: //link label//
+note bottom on link
+ Link note
+end note
+a <--- d: //link label//
+note left on link
+ Link note
+end note
+@enduml
+
+
+=== Gantt project planning
+
+N/A
+
+
+=== Object
+
+@startuml
+object a
+object b
+object c
+object d
+
+a -> b: //link label//
+note top on link
+ Link note
+end note
+b ---> c: //link label//
+note right on link
+ Link note
+end note
+d <- c: //link label//
+note bottom on link
+ Link note
+end note
+a <--- d: //link label//
+note left on link
+ Link note
+end note
+@enduml
+
+
+=== MindMap
+
+N/A
+
+=== Network (nwdiag)
+
+N/A
+
+
+=== Sequence
+
+N/A
+
+=== State
+
+@startuml
+state a
+state b
+state c
+state d
+
+a -> b: //link label//
+note top on link
+ Link note
+end note
+b -down-> c: //link label//
+note right on link
+ Link note
+end note
+c -left-> d: //link label//
+note bottom on link
+ Link note
+end note
+d -up-> a: //link label//
+note left on link
+ Link note
+end note
+@enduml
+
+
+=== Use-Case
+
+@startuml
+(a)
+(b)
+(c)
+(d)
+
+a -> b: //link label//
+note top on link
+ Link note
+end note
+b ---> c: //link label//
+note right on link
+ Link note
+end note
+d <- c: //link label//
+note bottom on link
+ Link note
+end note
+a <--- d: //link label//
+note left on link
+ Link note
+end note
+@enduml
+
+
+
+== Appendice: Examples of "Note [top\|right\|bottom\|left] of link" on all diagrams
+
+Test of the new feature "Note [top\|right\|bottom\|left] **of** link" (from v1.2020.20):
+
+* OK for Component, Deployment, Use-case
+* KO for Class, Objet, State
+
+[[#FFD700#FIXME]]
+๐ฉ
+FIXME for Class, Objet, State
+[[#FFD700#FIXME]]
+
+=== Activity
+N/A
+
+=== Class
+
+@startuml
+class a
+
+a -> b: //link label//
+note top of link
+ Link note
+end note
+b ---> c: //link label//
+note right of link
+ Link note
+end note
+d <- c: //link label//
+note bottom of link
+ Link note
+end note
+a <--- d: //link label//
+note left of link
+ Link note
+end note
+@enduml
+
+
+[[#FFD700#FIXME]]
+๐ฉ
+FIXME for Class
+[[#FFD700#FIXME]]
+
+
+=== Component, Deployment
+
+@startuml
+node a
+node b
+node c
+node d
+
+a -> b: //link label//
+note top of link
+ Link note
+end note
+b ---> c: //link label//
+note right of link
+ Link note
+end note
+d <- c: //link label//
+note bottom of link
+ Link note
+end note
+a <--- d: //link label//
+note left of link
+ Link note
+end note
+@enduml
+
+
+=== Gantt project planning
+
+N/A
+
+
+=== Object
+
+@startuml
+object a
+object b
+object c
+object d
+
+a -> b: //link label//
+note top of link
+ Link note
+end note
+b ---> c: //link label//
+note right of link
+ Link note
+end note
+d <- c: //link label//
+note bottom of link
+ Link note
+end note
+a <--- d: //link label//
+note left of link
+ Link note
+end note
+@enduml
+
+
+[[#FFD700#FIXME]]
+๐ฉ
+FIXME for Objet
+[[#FFD700#FIXME]]
+
+=== MindMap
+
+N/A
+
+=== Network (nwdiag)
+
+N/A
+
+
+=== Sequence
+
+N/A
+
+=== State
+
+@startuml
+state a
+state b
+state c
+state d
+
+a -> b: //link label//
+note top of link
+ Link note
+end note
+b -down-> c: //link label//
+note right of link
+ Link note
+end note
+c -left-> d: //link label//
+note bottom of link
+ Link note
+end note
+d -up-> a: //link label//
+note left of link
+ Link note
+end note
+@enduml
+
+
+[[#FFD700#FIXME]]
+๐ฉ
+FIXME for State
+[[#FFD700#FIXME]]
+
+=== Use-Case
+
+@startuml
+(a)
+(b)
+(c)
+(d)
+
+a -> b: //link label//
+note top of link
+ Link note
+end note
+b ---> c: //link label//
+note right of link
+ Link note
+end note
+d <- c: //link label//
+note bottom of link
+ Link note
+end note
+a <--- d: //link label//
+note left of link
+ Link note
+end note
+@enduml
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/nwdiag-issues.adoc b/plantuml-docs/docs_from_alphadoc/nwdiag-issues.adoc
new file mode 100644
index 00000000..1dacb083
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/nwdiag-issues.adoc
@@ -0,0 +1,462 @@
+== Network diagram issues (nwdiag-issues)
+
+This page lists issues on link::nwdiag[nwdiag].
+
+
+== Example __KO__ on group of Peer networks
+
+=== Group on first
+
+@startuml
+nwdiag {
+ internet [ shape = cloud];
+ internet -- router;
+
+ group {
+ color = "pink";
+ app;
+ db;
+ }
+
+ network proxy {
+ router;
+ app;
+ }
+
+ network default {
+ app;
+ db;
+ }
+}
+@enduml
+
+
+=== Group on second
+
+@startuml
+nwdiag {
+ internet [ shape = cloud];
+ internet -- router;
+
+ network proxy {
+ router;
+ app;
+ }
+
+ group {
+ color = "pink";
+ app;
+ db;
+ }
+
+ network default {
+ app;
+ db;
+ }
+}
+@enduml
+
+[[#FFAAAA#FIXME]] Why the line on proxy for 'db'? ('db' must be only on 'default network') [See example without group]
+
+
+=== Group on third
+
+@startuml
+nwdiag {
+ internet [ shape = cloud];
+ internet -- router;
+
+ network proxy {
+ router;
+ app;
+ }
+ network default {
+ app;
+ db;
+ }
+ group {
+ color = "pink";
+ app;
+ db;
+ }
+}
+@enduml
+
+
+__[Ref. https://github.com/plantuml/plantuml/issues/408[Issue#408] and https://forum.plantuml.net/12655/nwdiag-overlapp-problem-with-3-newtorks?show=12661#c12661[QA-12655]]__
+
+
+== Example __KO__ with shape
+
+. Overlap of label for folder
+. Hexagon shape is missing
+
+
+@startuml
+nwdiag {
+network Network {
+Folder [shape = folder]
+Hexagon [shape = hexagon]
+}
+}
+@enduml
+
+
+
+@startuml
+nwdiag {
+network Network {
+Folder [shape = folder, description = "Test, long long label\nTest, long long label"]
+Hexagon [shape = hexagon, description = "Test, long long label\nTest, long long label"]
+}
+}
+@enduml
+
+
+
+== Borderline cases of nwdiag (test of number lines)
+
+=== Element or Server
+
+* How many adress lines before overlap? __[Hints: 7 (tested on V1.2021.8)]__
+
+
+@startuml
+nwdiag {
+network Network {
+server0 [address = "Adress_line_1\nAdress_line_2\nAdress_line_3\nAdress_line_4\nAdress_line_5\nAdress_line_6\nAdress_line_7\nAdress_line_8\nAdress_line_9"]
+server1 [address = "Adress_line_1\nAdress_line_2\nAdress_line_3\nAdress_line_4\nAdress_line_5\nAdress_line_6\nAdress_line_7"]
+}
+}
+@enduml
+
+
+
+=== Network
+
+* How many adress lines before overlap? __[Hints: 7 or 16]__
+
+
+@startuml
+nwdiag {
+network Network1 {
+address = "Adress_line_1\nAdress_line_2\nAdress_line_3\nAdress_line_4\nAdress_line_5\nAdress_line_6\nAdress_line_7\nAdress_line_8\nAdress_line_9"
+server
+}
+network Network2 {
+address = "Adress_line_1\nAdress_line_2\nAdress_line_3\nAdress_line_4\nAdress_line_5\nAdress_line_6\nAdress_line_7\nAdress_line_8\nAdress_line_9"
+server
+}
+}
+@enduml
+
+
+@startuml
+nwdiag {
+network Network1 {
+address = "Adress_line_1\nAdress_line_2\nAdress_line_3\nAdress_line_4\nAdress_line_5\nAdress_line_6\nAdress_line_7\nAdress_line_8\nAdress_line_9\nAdress_line_10\nAdress_line_11\nAdress_line_12\nAdress_line_13\nAdress_line_14\nAdress_line_15\nAdress_line_16\nAdress_line_17"
+server [address = "\nAdress_line_1\nAdress_line_2\nAdress_line_3\nAdress_line_4\nAdress_line_5\nAdress_line_6\nAdress_line_7\n"]
+}
+network Network2 {
+address = "Adress_line_1\nAdress_line_2\nAdress_line_3\nAdress_line_4\nAdress_line_5\nAdress_line_6\nAdress_line_7\nAdress_line_8\nAdress_line_9\nAdress_line_10\nAdress_line_11\nAdress_line_12\nAdress_line_13\nAdress_line_14\nAdress_line_15\nAdress_line_16\nAdress_line_17"
+server
+}
+}
+@enduml
+
+
+
+== Example __KO__ with incoming server (e.g. the Internet or Web)
+
+
+@startuml
+nwdiag {
+ web1 [shape = cloud]
+ web2 [shape = cloud]
+}
+@enduml
+
+
+
+@startuml
+nwdiag {
+ web1 [shape = cloud]
+ web2 [shape = cloud]
+
+ network {
+ web1
+ web2
+ }
+}
+@enduml
+
+
+
+@startuml
+nwdiag {
+ web1 [shape = cloud]
+ web2 [shape = cloud]
+
+ network {
+ web1
+ web2
+ appli
+ }
+ network {
+ appli
+ db [shape = database]
+ }
+}
+@enduml
+
+
+* Q?: What is the line on the top of web2 ?
+
+
+== Minimal __KO__ example...
+
+
+@startuml
+nwdiag {
+ a
+ b
+}
+@enduml
+
+
+
+@startuml
+nwdiag {
+ ok
+ ko
+}
+@enduml
+
+
+
+@startuml
+nwdiag {
+ 1
+ 2
+ network {
+ 1
+ 2
+ 3
+ 4
+ }
+}
+@enduml
+
+
+
+@startuml
+nwdiag {
+ 1
+ 2
+ 3
+ 6
+ network 1 {
+ 1
+ 2
+ 3
+ 4
+ 5
+ 6
+ }
+ network 2 {
+ 1
+ 2
+ 3
+ 4
+ }
+}
+@enduml
+
+
+
+== Other internal networks (stretched) examples
+
+
+@startuml
+nwdiag {
+ network {
+ a;
+ b;
+ c;
+ }
+ a -- 1
+ b -- 2
+ c -- 3
+}
+@enduml
+
+
+
+@startuml
+nwdiag {
+ network {
+ a;
+ b;
+ c;
+ }
+ b -- 2
+ c -- 3
+}
+@enduml
+
+
+
+== Example __KO__ on of Peer networks
+
+
+
+@startuml
+nwdiag {
+ Internet [shape = cloud]
+ Internet -- A
+}
+@enduml
+
+
+VS
+
+
+@startuml
+nwdiag {
+ Internet [shape = cloud]
+ Internet -- A
+ Internet -- B
+}
+@enduml
+
+
+
+== OK: Example with 3 or more groups
+
+@startuml
+nwdiag {
+ group {
+ color = "#FFaaaa";
+ web01;
+ db01;
+ }
+ group {
+ color = "#aaFFaa";
+ web02;
+ db02;
+ }
+ group {
+ color = "#aaaaFF";
+ web03;
+ db03;
+ }
+
+ network dmz {
+ web01;
+ web02;
+ web03;
+ }
+ network internal {
+ web01;
+ db01 ;
+ web02;
+ db02 ;
+ web03;
+ db03;
+ }
+}
+@enduml
+
+__[Ref. https://forum.plantuml.net/13138[QA-13138]]__
+
+
+@startuml
+nwdiag {
+ group {
+ color = "#FFaaaa";
+ web01;
+ db01;
+ }
+ group {
+ color = "#aaFFaa";
+ web02;
+ db02;
+ }
+ group {
+ color = "#aaaaFF";
+ web03;
+ db03;
+ }
+ group {
+ color = "#aaFFFF";
+ web04;
+ db04;
+ }
+
+ network dmz {
+ web01;
+ web02;
+ web03;
+ web04;
+ }
+ network internal {
+ web01;
+ db01 ;
+ web02;
+ db02 ;
+ web03;
+ db03;
+ web04;
+ db04;
+ }
+}
+@enduml
+
+
+โถ Seems to be corrected on V1.2021.10beta4-5+ __(but only on **opposite layout**)__
+
+
+== Example __KO__ on Goup of Peer networks between networks
+
+=== Group first: OK
+
+@startuml
+nwdiag {
+ group group02 {
+ color = palegreen
+ a02;
+ a01;
+ }
+ network net01 {
+ a01;
+ }
+ a01 -- a02;
+ network net02 {
+ a02;
+ }
+}
+@enduml
+
+
+=== Group at the end: KO
+
+
+@startuml
+nwdiag {
+ network net01 {
+ a01;
+ }
+ a01 -- a02;
+ network net02 {
+ a02;
+ }
+ group group02 {
+ color = pink
+ a02;
+ a01;
+ }
+}
+@enduml
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/nwdiag.adoc b/plantuml-docs/docs_from_alphadoc/nwdiag.adoc
new file mode 100644
index 00000000..443ecc18
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/nwdiag.adoc
@@ -0,0 +1,909 @@
+= Network diagram (nwdiag)
+
+http://blockdiag.com/en/nwdiag/nwdiag-examples.html[nwdiag] has been created by https://twitter.com/tk0miya[Takeshi Komiya] and allows to quickly draw network diagrams. So we thank him for his creation!
+
+Since the syntax is clear and simple, this has been integrated within PlantUML.
+We reuse here the examples that Takeshi has documented.
+
+
+== Simple diagram
+
+=== Define a network
+
+@startuml
+nwdiag {
+ network dmz {
+ address = "210.x.x.x/24"
+ }
+}
+@enduml
+
+
+=== Define some elements or servers on a network
+
+@startuml
+nwdiag {
+ network dmz {
+ address = "210.x.x.x/24"
+
+ web01 [address = "210.x.x.1"];
+ web02 [address = "210.x.x.2"];
+ }
+}
+@enduml
+
+
+=== Full example
+
+@startuml
+nwdiag {
+ network dmz {
+ address = "210.x.x.x/24"
+
+ web01 [address = "210.x.x.1"];
+ web02 [address = "210.x.x.2"];
+ }
+ network internal {
+ address = "172.x.x.x/24";
+
+ web01 [address = "172.x.x.1"];
+ web02 [address = "172.x.x.2"];
+ db01;
+ db02;
+ }
+}
+@enduml
+
+
+
+== Define multiple addresses
+
+
+@startuml
+nwdiag {
+ network dmz {
+ address = "210.x.x.x/24"
+
+ // set multiple addresses (using comma)
+ web01 [address = "210.x.x.1, 210.x.x.20"];
+ web02 [address = "210.x.x.2"];
+ }
+ network internal {
+ address = "172.x.x.x/24";
+
+ web01 [address = "172.x.x.1"];
+ web02 [address = "172.x.x.2"];
+ db01;
+ db02;
+ }
+}
+@enduml
+
+
+
+== Grouping nodes
+
+=== Define group inside network definitions
+
+@startuml
+nwdiag {
+ network Sample_front {
+ address = "192.168.10.0/24";
+
+ // define group
+ group web {
+ web01 [address = ".1"];
+ web02 [address = ".2"];
+ }
+ }
+ network Sample_back {
+ address = "192.168.20.0/24";
+ web01 [address = ".1"];
+ web02 [address = ".2"];
+ db01 [address = ".101"];
+ db02 [address = ".102"];
+
+ // define network using defined nodes
+ group db {
+ db01;
+ db02;
+ }
+ }
+}
+@enduml
+
+
+=== Define group outside of network definitions
+
+@startuml
+nwdiag {
+ // define group outside of network definitions
+ group {
+ color = "#FFAAAA";
+
+ web01;
+ web02;
+ db01;
+ }
+
+ network dmz {
+ web01;
+ web02;
+ }
+ network internal {
+ web01;
+ web02;
+ db01;
+ db02;
+ }
+}
+@enduml
+
+
+=== Define several groups on same network
+==== Example with 2 group
+
+@startuml
+nwdiag {
+ group {
+ color = "#FFaaaa";
+ web01;
+ db01;
+ }
+ group {
+ color = "#aaaaFF";
+ web02;
+ db02;
+ }
+ network dmz {
+ address = "210.x.x.x/24"
+
+ web01 [address = "210.x.x.1"];
+ web02 [address = "210.x.x.2"];
+ }
+ network internal {
+ address = "172.x.x.x/24";
+
+ web01 [address = "172.x.x.1"];
+ web02 [address = "172.x.x.2"];
+ db01 ;
+ db02 ;
+ }
+}
+@enduml
+
+__[Ref. https://forum.plantuml.net/12663[QA-12663]]__
+
+==== Example with 3 groups
+
+@startuml
+nwdiag {
+ group {
+ color = "#FFaaaa";
+ web01;
+ db01;
+ }
+ group {
+ color = "#aaFFaa";
+ web02;
+ db02;
+ }
+ group {
+ color = "#aaaaFF";
+ web03;
+ db03;
+ }
+
+ network dmz {
+ web01;
+ web02;
+ web03;
+ }
+ network internal {
+ web01;
+ db01 ;
+ web02;
+ db02 ;
+ web03;
+ db03;
+ }
+}
+@enduml
+
+__[Ref. https://forum.plantuml.net/13138[QA-13138]]__
+
+
+== Extended Syntax (for network or group)
+
+=== Network
+
+For network or network's component, you can add or change:
+* addresses __(separated by comma `+,+`)__;
+* link::color[color];
+* description;
+* link::deployment-diagram#5k3cq00k8n5ek362kjdn[shape].
+
+
+@startuml
+nwdiag {
+ network Sample_front {
+ address = "192.168.10.0/24"
+ color = "red"
+
+ // define group
+ group web {
+ web01 [address = ".1, .2", shape = "node"]
+ web02 [address = ".2, .3"]
+ }
+ }
+ network Sample_back {
+ address = "192.168.20.0/24"
+ color = "palegreen"
+ web01 [address = ".1"]
+ web02 [address = ".2"]
+ db01 [address = ".101", shape = database ]
+ db02 [address = ".102"]
+
+ // define network using defined nodes
+ group db {
+ db01;
+ db02;
+ }
+ }
+}
+@enduml
+
+
+=== Group
+
+For a group, you can add or change:
+* link::color[color];
+* description.
+
+
+@startuml
+nwdiag {
+ group {
+ color = "#CCFFCC";
+ description = "Long group description";
+
+ web01;
+ web02;
+ db01;
+ }
+
+ network dmz {
+ web01;
+ web02;
+ }
+ network internal {
+ web01;
+ web02;
+ db01 [address = ".101", shape = database];
+ }
+}
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/12056[QA-12056]]__
+
+
+== Using Sprites
+
+You can use all link::sprite[sprites] (icons) from the link::stdlib[Standard Library] or any other library.
+
+Use the notation `+<$sprite>+` to use a sprite, `+\n+` to make a new line, or any other link::creole[Creole] syntax.
+
+
+@startuml
+!include
+!include
+
+nwdiag {
+ network dmz {
+ address = "210.x.x.x/24"
+
+ // set multiple addresses (using comma)
+ web01 [address = "210.x.x.1, 210.x.x.20", description = "<$application_server>\n web01"]
+ web02 [address = "210.x.x.2", description = "<$application_server>\n web02"];
+ }
+ network internal {
+ address = "172.x.x.x/24";
+
+ web01 [address = "172.x.x.1"];
+ web02 [address = "172.x.x.2"];
+ db01 [address = "172.x.x.100", description = "<$database_server>\n db01"];
+ db02 [address = "172.x.x.101", description = "<$database_server>\n db02"];
+ }
+}
+@enduml
+
+
+
+__[Ref. https://forum.plantuml.net/11862/nwdiag-beautifier?show=11866#a11866[QA-11862]]__
+
+
+== Using OpenIconic
+
+You can also use the icons from link::openiconic[OpenIconic] in network or node descriptions.
+
+Use the notation `+<&icon>+` to make an icon, `+<&icon*n>+` to multiply the size by a factor `+n+`, and `+\n+` to make a newline:
+
+
+@startuml
+
+nwdiag {
+ group nightly {
+ color = "#FFAAAA";
+ description = "<&clock> Restarted nightly <&clock>";
+ web02;
+ db01;
+ }
+ network dmz {
+ address = "210.x.x.x/24"
+
+ user [description = "<&person*4.5>\n user1"];
+ // set multiple addresses (using comma)
+ web01 [address = "210.x.x.1, 210.x.x.20", description = "<&cog*4>\nweb01"]
+ web02 [address = "210.x.x.2", description = "<&cog*4>\nweb02"];
+
+ }
+ network internal {
+ address = "172.x.x.x/24";
+
+ web01 [address = "172.x.x.1"];
+ web02 [address = "172.x.x.2"];
+ db01 [address = "172.x.x.100", description = "<&spreadsheet*4>\n db01"];
+ db02 [address = "172.x.x.101", description = "<&spreadsheet*4>\n db02"];
+ ptr [address = "172.x.x.110", description = "<&print*4>\n ptr01"];
+ }
+}
+@enduml
+
+
+
+== Same nodes on more than two networks
+
+You can use same nodes on different networks (more than two networks); __nwdiag__ use in this case __'jump line'__ over networks.
+
+
+@startuml
+nwdiag {
+ // define group at outside network definitions
+ group {
+ color = "#7777FF";
+
+ web01;
+ web02;
+ db01;
+ }
+
+ network dmz {
+ color = "pink"
+
+ web01;
+ web02;
+ }
+
+ network internal {
+ web01;
+ web02;
+ db01 [shape = database ];
+ }
+
+ network internal2 {
+ color = "LightBlue";
+
+ web01;
+ web02;
+ db01;
+ }
+
+}
+@enduml
+
+
+
+== Peer networks
+
+Peer networks are simple connections between two nodes, for which we don't use a horizontal "busbar" network
+
+@startuml
+nwdiag {
+ inet [shape = cloud];
+ inet -- router;
+
+ network {
+ router;
+ web01;
+ web02;
+ }
+}
+@enduml
+
+
+
+== Peer networks and group
+
+=== Without group
+
+@startuml
+nwdiag {
+ internet [ shape = cloud];
+ internet -- router;
+
+ network proxy {
+ router;
+ app;
+ }
+ network default {
+ app;
+ db;
+ }
+}
+@enduml
+
+
+=== Group on first
+
+@startuml
+nwdiag {
+ internet [ shape = cloud];
+ internet -- router;
+
+ group {
+ color = "pink";
+ app;
+ db;
+ }
+
+ network proxy {
+ router;
+ app;
+ }
+
+ network default {
+ app;
+ db;
+ }
+}
+@enduml
+
+
+=== Group on second
+
+@startuml
+nwdiag {
+ internet [ shape = cloud];
+ internet -- router;
+
+ network proxy {
+ router;
+ app;
+ }
+
+ group {
+ color = "pink";
+ app;
+ db;
+ }
+
+ network default {
+ app;
+ db;
+ }
+}
+@enduml
+
+[[#FFAAAA#FIXME]] Why the line on proxy for 'db'? ('db' must be only on 'default network') [See example without group]
+
+
+=== Group on third
+
+@startuml
+nwdiag {
+ internet [ shape = cloud];
+ internet -- router;
+
+ network proxy {
+ router;
+ app;
+ }
+ network default {
+ app;
+ db;
+ }
+ group {
+ color = "pink";
+ app;
+ db;
+ }
+}
+@enduml
+
+
+[[#FFAAAA#FIXME]]
+__[Ref. https://github.com/plantuml/plantuml/issues/408[Issue#408] and https://forum.plantuml.net/12655/nwdiag-overlapp-problem-with-3-newtorks?show=12661#c12661[QA-12655]]__
+[[#FFAAAA#Not totally fixed]]
+
+
+== Add title, caption, header, footer or legend on network diagram
+
+
+@startuml
+
+header some header
+
+footer some footer
+
+title My title
+
+nwdiag {
+ network inet {
+ web01 [shape = cloud]
+ }
+}
+
+legend
+The legend
+end legend
+
+caption This is caption
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/11303/nwdiag-ignores-on-title-keyword-in-plantuml-1-2020-7[QA-11303] and link::commons[Common commands]]__
+
+
+== With or without shadow
+
+=== With shadow (by default)
+
+@startuml
+nwdiag {
+ network nw {
+ server;
+ internet;
+ }
+ internet [shape = cloud];
+}
+@enduml
+
+
+
+=== Without shadow
+
+@startuml
+
+nwdiag {
+ network nw {
+ server;
+ internet;
+ }
+ internet [shape = cloud];
+}
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/14516/[QA-14516]]__
+
+
+== Change width of the networks
+
+You can change the width of the networks, especially in order to have the same full width for only some or all networks.
+
+Here are some examples, with all the possibilities:
+* without
+
+@startuml
+nwdiag {
+ network NETWORK_BASE {
+ dev_A [address = "dev_A" ]
+ dev_B [address = "dev_B" ]
+ }
+ network IntNET1 {
+ dev_B [address = "dev_B1" ]
+ dev_M [address = "dev_M1" ]
+ }
+ network IntNET2 {
+ dev_B [address = "dev_B2" ]
+ dev_M [address = "dev_M2" ]
+ }
+}
+@enduml
+
+
+* only the first
+
+@startuml
+nwdiag {
+ network NETWORK_BASE {
+ width = full
+ dev_A [address = "dev_A" ]
+ dev_B [address = "dev_B" ]
+ }
+ network IntNET1 {
+ dev_B [address = "dev_B1" ]
+ dev_M [address = "dev_M1" ]
+ }
+ network IntNET2 {
+ dev_B [address = "dev_B2" ]
+ dev_M [address = "dev_M2" ]
+ }
+}
+@enduml
+
+
+* the first and the second
+
+@startuml
+nwdiag {
+ network NETWORK_BASE {
+ width = full
+ dev_A [address = "dev_A" ]
+ dev_B [address = "dev_B" ]
+ }
+ network IntNET1 {
+ width = full
+ dev_B [address = "dev_B1" ]
+ dev_M [address = "dev_M1" ]
+ }
+ network IntNET2 {
+ dev_B [address = "dev_B2" ]
+ dev_M [address = "dev_M2" ]
+ }
+}
+@enduml
+
+
+* all the network (with same full width)
+
+@startuml
+nwdiag {
+ network NETWORK_BASE {
+ width = full
+ dev_A [address = "dev_A" ]
+ dev_B [address = "dev_B" ]
+ }
+ network IntNET1 {
+ width = full
+ dev_B [address = "dev_B1" ]
+ dev_M [address = "dev_M1" ]
+ }
+ network IntNET2 {
+ width = full
+ dev_B [address = "dev_B2" ]
+ dev_M [address = "dev_M2" ]
+ }
+}
+@enduml
+
+
+
+== Other internal networks
+
+You can define other internal networks (TCP/IP, USB, SERIAL,...).
+
+* Without address or type
+
+@startuml
+nwdiag {
+ network LAN1 {
+ a [address = "a1"];
+ }
+ network LAN2 {
+ a [address = "a2"];
+ switch;
+ }
+ switch -- equip;
+ equip -- printer;
+}
+@enduml
+
+
+
+* With address or type
+
+@startuml
+nwdiag {
+ network LAN1 {
+ a [address = "a1"];
+ }
+ network LAN2 {
+ a [address = "a2"];
+ switch [address = "s2"];
+ }
+ switch -- equip;
+ equip [address = "e3"];
+ equip -- printer;
+ printer [address = "USB"];
+}
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/12824[QA-12824]]__
+
+
+== Using (global) style
+
+=== Without style __(by default)__
+
+@startuml
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+
+
+=== With style
+
+You can use link::style-evolution[style] to change rendering of elements.
+
+
+@startuml
+
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/14479[QA-14479]]__
+
+
+== Appendix: Test of all shapes on Network diagram (nwdiag)
+
+
+@startuml
+nwdiag {
+ network Network {
+ Actor [shape = actor]
+ Agent [shape = agent]
+ Artifact [shape = artifact]
+ Boundary [shape = boundary]
+ Card [shape = card]
+ Cloud [shape = cloud]
+ Collections [shape = collections]
+ Component [shape = component]
+ }
+}
+@enduml
+
+
+
+@startuml
+nwdiag {
+ network Network {
+ Control [shape = control]
+ Database [shape = database]
+ Entity [shape = entity]
+ File [shape = file]
+ Folder [shape = folder]
+ Frame [shape = frame]
+ Hexagon [shape = hexagon]
+ Interface [shape = interface]
+ }
+}
+@enduml
+
+
+
+@startuml
+nwdiag {
+ network Network {
+ Label [shape = label]
+ Node [shape = node]
+ Package [shape = package]
+ Person [shape = person]
+ Queue [shape = queue]
+ Stack [shape = stack]
+ Rectangle [shape = rectangle]
+ Storage [shape = storage]
+ Usecase [shape = usecase]
+ }
+}
+@enduml
+
+
+[[#FFAAAA#FIXME]]
+. Overlap of label for folder
+. Hexagon shape is missing
+
+
+@startuml
+nwdiag {
+network Network {
+Folder [shape = folder]
+Hexagon [shape = hexagon]
+}
+}
+@enduml
+
+
+
+@startuml
+nwdiag {
+network Network {
+Folder [shape = folder, description = "Test, long long label\nTest, long long label"]
+Hexagon [shape = hexagon, description = "Test, long long label\nTest, long long label"]
+}
+}
+@enduml
+
+
+[[#FFAAAA#FIXME]]
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/object-diagram.adoc b/plantuml-docs/docs_from_alphadoc/object-diagram.adoc
new file mode 100644
index 00000000..cc15ceca
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/object-diagram.adoc
@@ -0,0 +1,281 @@
+== Object Diagram
+
+
+
+== Definition of objects
+
+You define instances of objects using the `+object+`
+keyword.
+
+
+@startuml
+object firstObject
+object "My Second Object" as o2
+@enduml
+
+
+
+== Relations between objects
+
+Relations between objects are defined using the following symbols :
+
+|===
+| Type | Symbol | Image
+
+| Extension
+| `+<|--+`
+| image::extends01.png[]
+
+| Composition
+| `+*--+`
+| image::sym03.png[]
+
+| Aggregation
+| `+o--+`
+| image::sym01.png[]
+
+|===
+
+It is possible to replace `+--+` by `+..+` to have a dotted line.
+
+Knowing those rules, it is possible to draw the following drawings.
+
+It is possible a add a label on the relation, using `+:+` followed by the text of the label.
+
+For cardinality, you can use double-quotes `+""+` on
+each side of the relation.
+
+
+
+@startuml
+object Object01
+object Object02
+object Object03
+object Object04
+object Object05
+object Object06
+object Object07
+object Object08
+
+Object01 <|-- Object02
+Object03 *-- Object04
+Object05 o-- "4" Object06
+Object07 .. Object08 : some labels
+@enduml
+
+
+
+== Associations objects
+
+
+@startuml
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+
+
+== Adding fields
+
+To declare fields, you can use the symbol `+:+` followed by
+the field's name.
+
+
+@startuml
+
+object user
+
+user : name = "Dummy"
+user : id = 123
+
+@enduml
+
+
+It is also possible to group all fields between brackets `+{}+`.
+
+
+@startuml
+
+object user {
+ name = "Dummy"
+ id = 123
+}
+
+@enduml
+
+
+
+== Common features with class diagrams
+
+* link::class-diagram#Hide[Hide attributes, methods...]
+* link::class-diagram#Notes[Defines notes]
+* link::class-diagram#Using[Use packages]
+* link::class-diagram#Skinparam[Skin the output]
+
+
+== Map table or associative array
+
+You can define a map table or https://en.wikipedia.org/wiki/Associative_array[associative array], with `+map+` keyword and `+=>+` separator.
+
+
+@startuml
+map CapitalCity {
+ UK => London
+ USA => Washington
+ Germany => Berlin
+}
+@enduml
+
+
+
+@startuml
+map "Map **Contry => CapitalCity**" as CC {
+ UK => London
+ USA => Washington
+ Germany => Berlin
+}
+@enduml
+
+
+
+@startuml
+map "map: Map" as users {
+ 1 => Alice
+ 2 => Bob
+ 3 => Charlie
+}
+@enduml
+
+
+
+And add link with object.
+
+@startuml
+object London
+
+map CapitalCity {
+ UK *-> London
+ USA => Washington
+ Germany => Berlin
+}
+@enduml
+
+
+
+@startuml
+object London
+object Washington
+object Berlin
+object NewYork
+
+map CapitalCity {
+ UK *-> London
+ USA *--> Washington
+ Germany *---> Berlin
+}
+
+NewYork --> CapitalCity::USA
+@enduml
+
+__[Ref. https://github.com/plantuml/plantuml/issues/307[#307]]__
+
+
+@startuml
+package foo {
+ object baz
+}
+
+package bar {
+ map A {
+ b *-> foo.baz
+ c =>
+ }
+}
+
+A::c --> foo
+@enduml
+
+__[Ref. https://forum.plantuml.net/12934[QA-12934]]__
+
+
+@startuml
+object Foo
+map Bar {
+ abc=>
+ def=>
+}
+object Baz
+
+Bar::abc --> Baz : Label one
+Foo --> Bar::def : Label two
+@enduml
+
+__[Ref. https://github.com/plantuml/plantuml/issues/307[#307]]__
+
+
+== Program (or project) evaluation and review technique (PERT) with map
+
+You can use `+map table+` in order to make https://en.wikipedia.org/wiki/Program_evaluation_and_review_technique[Program (or project) evaluation and review technique (PERT)] diagram.
+
+
+@startuml PERT
+left to right direction
+' Horizontal lines: -->, <--, <-->
+' Vertical lines: ->, <-, <->
+title PERT: Project Name
+
+map Kick.Off {
+}
+map task.1 {
+ Start => End
+}
+map task.2 {
+ Start => End
+}
+map task.3 {
+ Start => End
+}
+map task.4 {
+ Start => End
+}
+map task.5 {
+ Start => End
+}
+Kick.Off --> task.1 : Label 1
+Kick.Off --> task.2 : Label 2
+Kick.Off --> task.3 : Label 3
+task.1 --> task.4
+task.2 --> task.4
+task.3 --> task.4
+task.4 --> task.5 : Label 4
+@enduml
+
+__[Ref. https://forum.plantuml.net/12337/there-any-support-for-pert-style-project-management-diagrams?show=14426#a14426[QA-12337]]__
+
+
+== Display JSON Data on Class or Object diagram
+
+=== Simple example
+
+@startuml
+class Class
+object Object
+json JSON {
+ "fruit":"Apple",
+ "size":"Large",
+ "color": ["Red", "Green"]
+}
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/15481/possible-link-elements-from-two-jsons-with-both-jsons-embeded?show=15567#c15567[QA-15481]]__
+
+For another example, see on link::json#jinnkhaa7d65l0fkhfec[JSON page].
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/openiconic.adoc b/plantuml-docs/docs_from_alphadoc/openiconic.adoc
new file mode 100644
index 00000000..1141929f
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/openiconic.adoc
@@ -0,0 +1,40 @@
+== OpenIconic
+
+https://useiconic.com/open/[OpenIconic] is an very nice open source icon set.
+Those icons have been integrated into the link::creole[creole parser], so you can use them out-of-the-box.
+
+You can use the following syntax: `+<&ICON_NAME>+`.
+
+
+@startuml
+title: <&heart>Use of OpenIconic<&heart>
+class Wifi
+note left
+ Click on <&wifi>
+end note
+@enduml
+
+
+
+It also works with link::salt[salt, the graphical interface designer].
+
+@startsalt
+{
+ Login<&person> | "MyName "
+ Password<&key> | "**** "
+ [Cancel <&circle-x>] | [OK <&account-login>]
+}
+@endsalt
+
+
+The complete list is available on https://useiconic.com/open/[OpenIconic Website], or
+you can use the following special diagram:
+
+
+
+@startuml
+listopeniconic
+@enduml
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/oregon-trail.adoc b/plantuml-docs/docs_from_alphadoc/oregon-trail.adoc
new file mode 100644
index 00000000..8c35520f
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/oregon-trail.adoc
@@ -0,0 +1,69 @@
+== The Oregon Trail
+
+The https://en.wikipedia.org/wiki/The_Oregon_Trail_%28series%29[Oregon Trail] is a __very old__ game created
+in 1971.
+
+A version from http://www.atariarchives.org/bca[David Ahl's] (named as
+http://www.atariarchives.org/bca/Chapter02_WestwardHo.php[Westward Ho!] for some reasons)
+has been ported to Java and integrated in **PlantUML**...
+
+This page is dedicated to:
+* Dan Rawitsch
+* Bill Heinemann
+* Paul Dillenberger
+* David Ahl
+
+
+== Let's play
+
+To launch the game, you will have to use the good old `+RUN+` Basic command :
+
+@startuml
+run oregon trail
+@enduml
+
+
+Every input has to be added in the text file:
+
+
+@startuml
+run oregon trail
+150
+@enduml
+
+
+Every input has to be added in the text file:
+
+
+@startuml
+run oregon trail
+150
+100
+10
+40
+40
+4
+@enduml
+
+
+For shooting, you will have to type **as fast as possible**
+the word printed on the screen (__like in the original version!__).
+
+
+@startuml
+run oregon trail
+150
+100
+10
+40
+40
+3
+1
+blam
+@enduml
+
+Good luck to you on the __Oregon Trail__ !
+
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/patreon-support.adoc b/plantuml-docs/docs_from_alphadoc/patreon-support.adoc
new file mode 100644
index 00000000..2a30c113
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/patreon-support.adoc
@@ -0,0 +1,25 @@
+== Why crowdfunding?
+
+**PlantUML** is free software. The code is Open Source and the tool is free to use.
+
+PlantUML is open to the community. Feedbacks, suggestions, ideas, codes, plugins coming... from the community are a great part in the success of PlantUML.
+
+However, developing and hosting PlantUML take time. Some users have already made link::donors[donation] to help us, and again we thank them for that.
+
+Since this was not sufficient, we have to use ads to be able to survive in the real world.
+
+Another option that we are considering now is to use some crowdfunding.
+We do not want to get a large funding in one shot, we would like better to obtain funding from patrons on a recurring basis.
+
+That's why we decide to go to https://www.patreon.com/bePatron?patAmt=1&u=527450&rid=152970[Patreon].
+
+
+== Patreon
+If you are using PlantUML, if you like it and want to improve it, you can decide to help us with a monthly tip.
+
+We decide to go for **1โฌ** or **1$ per month**. This may sound quite low to you, but if hundreds of people apply to a subscription, it will mean a lot to us.
+
+And to show you that we are serious here, we will give to ours patrons an access to an ad-free version of the current website.
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/pdf.adoc b/plantuml-docs/docs_from_alphadoc/pdf.adoc
new file mode 100644
index 00000000..47bb23b2
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/pdf.adoc
@@ -0,0 +1,54 @@
+== PDF Support
+
+Some users have asked for the ability to generate diagrams directly in PDF format.
+Unfortunately, this is not an easy task, and would require the need of several external libraries (http://xmlgraphics.apache.org/batik[Batik] and http://xmlgraphics.apache.org/fop[FOP]).
+
+This goes against the wish to keep `+plantuml.jar+` file not too big and to facilitate its integration with other products.
+
+Fortunately, it is possible to use some kind of __dynamic__ linkage, so that those libraries
+are not needed for compilation or execution if not present. A SVG file is first generated, then translated to PDF.
+
+Note that in some case, shadowing is an issue for PDF export, http://forum.plantuml.net/1026/instruction-how-enable-pdf-support-seems-not-correct-anymore[so you can find here a way to disable it].
+
+
+
+== Make it work
+So by default PDF generation is not enabled. This will probably fit a majority of users' needs.
+
+If you want to use PDF, you have to download the following files:
+
+* avalon-framework-4.2.0.jar
+* batik-all-1.7.jar
+* commons-io-1.3.1.jar
+* commons-logging-1.0.4.jar
+* fop.jar
+* xml-apis-ext-1.3.04.jar
+* xmlgraphics-commons-1.4.jar
+
+
+You have to download those files from http://xmlgraphics.apache.org/batik[Batik] and http://xmlgraphics.apache.org/fop[FOP] web site.
+
+For testing purposes only, those files have been put together in a zip http://beta.plantuml.net/batikAndFop.zip[here].
+
+Those files have to be in the very same folder as `+plantuml.jar+` (this is important).
+
+Now, you can use the `+-tpdf+` flag in the command line:
+
+----
+java -jar plantuml.jar -tpdf diagram.txt
+----
+
+Or `+format="pdf"+` in the ant task:
+
+----
+
+
+
+
+
+
+
+
+----
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/picoweb.adoc b/plantuml-docs/docs_from_alphadoc/picoweb.adoc
new file mode 100644
index 00000000..feb53770
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/picoweb.adoc
@@ -0,0 +1,37 @@
+== PlantUML PicoWeb Server
+
+Many plugins take advantage http://plantuml.com/plantuml[of the online web server] to generate images.
+
+For some reasons (security, performance...) you may need to use your own local server instead. This is possible link::server[thanks to the PlantUML Server which is available here].
+
+However, installing and configuring a full webserver may be too complex for some users so we have decided to integrate a tiny webserver inside `+plantuml.jar+`.
+
+This means that you only need a Java Runtime Environment and `+plantuml.jar+` to run this very simple web server.
+
+
+== Running the server
+
+Running the server is pretty simple. You just have to launch:
+
+----
+java -jar plantuml.jar -picoweb
+----
+
+__Attention__: By default, the server listens on __all__ interfaces on port `+8080+`. To change the default behavior, you can specify a colon separated port (still listening on all interfaces) or, both, a port and a bind address:
+
+----
+java -jar plantuml.jar -picoweb:8000
+java -jar plantuml.jar -picoweb:8000:127.0.0.1
+----
+
+The server is __really__ basic. It only understands GET requests with following patterns:
+
+* `+/plantuml/png/xyz....+`
+* `+/plantuml/svg/xyz....+`
+
+Those GET requests are used by various PlantUML plugins.
+Once you have launched your server, you can simply test it. With any web browser, you just have to point to: `+http://127.0.0.1:8080+`.
+
+This way, you can very easily use any plugins which need some PlantUML HTTP server __without__ the official online server.
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/plantuml-text-encoding.adoc b/plantuml-docs/docs_from_alphadoc/plantuml-text-encoding.adoc
new file mode 100644
index 00000000..e4236977
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/plantuml-text-encoding.adoc
@@ -0,0 +1,5 @@
+== PlantUML Text Encoding
+
+DELETE, duplicate of link::text-encoding[text-encoding]
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/plantumlshell.adoc b/plantuml-docs/docs_from_alphadoc/plantumlshell.adoc
new file mode 100644
index 00000000..45d73620
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/plantumlshell.adoc
@@ -0,0 +1,460 @@
+== Beta implementation
+
+Following the __First Round Of Brainstorming__, some functionalities have been implemented in http://beta.plantuml.net/plantuml.jar[last beta] (V1.2019.4beta14)
+
+We have somehow changed our mind since the __First Round Of Brainstorming__. Instead of having scripts features that would have been executed after the existing preprocessing, we have decided to completely rewrite the preprocessor with all new functionalities. The idea is to keep ascending compatibilies with the current (legacy now) preprocessor.
+
+* You have to switch to the new preprocessor using a special directive `+!preprocessorV2+`
+* Error management is very basic
+
+Things are now working fine. The idea is to let people play with this beta to see if we are on the right path, talking about syntax.
+
+
+
+== Variable definition
+
+Although this is not mandotary, we highly suggest that variable name start with a `+$+`.
+There are two kind of data:
+* Integer number
+* String, that must be surrended by simple quote or double quote.
+
+----
+@startuml
+!preprocessorV2
+!$ab = "foo1"
+!$cd = "foo2"
+!$ed = $ab + $cd
+
+Alice -> Bob : $ab
+Alice -> Bob : $cd
+Alice -> Bob : $ef
+@enduml
+----
+
+
+
+
+== Conditions
+
+* You can use expression in condition.
+* __else__ is also implemented
+
+----
+@startuml
+!preprocessorV2
+!$a = 10
+!$ijk = "foo"
+Alice -> Bob : A
+!if ($ijk == "foo") && ($a+10>=4)
+Alice -> Bob : yes
+!else
+Alice -> Bob : This should not appear
+!endif
+Alice -> Bob : B
+@enduml
+----
+
+
+
+== Void function
+
+* Function name __should__ start by a `+$+`
+* Argument names __should__ start by a `+$+`
+* Void functions can call other void functions
+
+Example:
+
+----
+@startuml
+!preprocessorV2
+!function msg($source, $destination)
+$source --> $destination
+!endfunction
+
+!function init_class($name)
+class $name {
+$addCommonMethod()
+}
+!endfunction
+
+
+!function $addCommonMethod()
+ toString()
+ hashCode()
+!endfunction
+
+
+init_class("foo1")
+init_class("foo2")
+msg("foo1", "foo2")
+@enduml
+----
+
+
+
+
+== Return function
+
+A return function does not ouput any text.
+It just define a function that you can call:
+* directly in variable definition or in diagram text
+* from other return function
+* from other void function
+
+
+* Function name __should__ start by a `+$+`
+* Argument names __should__ start by a `+$+`
+
+
+----
+@startuml
+!preprocessorV2
+!function $double($a)
+!return $a + $a
+!endfunction
+
+Alice -> Bob : The double of 3 is $double(3)
+@enduml
+----
+
+It is possible to shorten simple function definition in one line:
+
+----
+@startuml
+!preprocessorV2
+!function $double($a) return $a + $a
+
+Alice -> Bob : The double of 3 is $double(3)
+Alice -> Bob : $double("This work also for strings.")
+
+@enduml
+----
+
+
+
+
+== Default argument value
+
+In both return and void function, you can define default value for argument.
+
+
+----
+@startuml
+!preprocessorV2
+!function $inc($value, $step=1)
+!if $step==0
+!return $value
+!endif
+!return $value + $step
+!endfunction
+
+Alice -> Bob : Just one more $inc(3)
+Alice -> Bob : Add two to three : $inc(3, 2)
+@enduml
+----
+
+
+
+
+== First Round Of Brainstorming
+
+
+
+== Objectives
+
+Currently, users are doing more and more complex stuff with the preprocessor.
+
+The goal of this page is to discuss about a future implementation within PlantUML of some scripting feature within diagram text.
+Those scripts feature will be executed **after** preprocessing.
+
+A good start would be to scope the feature. What should the new functionality handle and what not, e.g.
+
+----
+* Variable initialization
+* Substitution of variable
+* Substrings and replace parts
+* Conditions (if, else)
+ * arithmetic-based
+ * string-based
+ * file-based
+ * condition concatenation || and &&
+* Loops (for, while)
+* Length of a variable
+----
+
+IMHO we should restrict the scope as much as it makes sense.
+
+You can edit this page to add your through and suggestions. We will wait until the design is complete before implementing anything.
+
+Here a first example :
+----
+@startuml
+$i = 0
+Alice -> Bob : The value of "i" is $i
+'It prints: The value of "i" is 0
+$i = $i+1
+Alice -> Bob : The value of "i" is now $i
+'It prints: The value of "i" is now 1
+$if ( $i > 0)
+Alice -> Bob : this is printed because i value is $i
+$endif
+$for ($i=0; $i<10; $i++)
+Alice -> Bob : in the for loop, "i" value is $i
+$endfor
+' If a variable is not known, it's simply ignored, and the $ is printed as usually.
+' This allows to not break compatibility with previous diagrams.
+Alice -> Bob : The $price is in USD
+@enduml
+----
+
+I think the first example looks promising. Putting $ in front of a variable to initialize and to access it is a good choice. The $if/$endif/$for/$endfor scopes the condition/loop, I guess? --> Yes
+
+If a variable is undefined, then it is simply ignored.
+MG--> Will there be a test if a variable is undefined or null?
+About variable testing, we could also test if a variable is undefined:
+----
+$ifdef $j
+Alice -> Bob : The variable j is defined and its value is $j
+$else
+Alice -> Bob : I don't know any j variable
+$endif
+----
+
+
+
+MG--> For sake of the stability yes, maybe a log should be written here in case one need to bugfix the own diagrams. However, think about two cases:
+. The variable is used as text substitution for the void function, here you can just treat is as text. --> Yes, agree
+. How do you want to handle the return function variables that are not defined?
+.. Do you ignore the whole function? --> No
+.. Do you add a "note" with the error? --> Not exactly. Return function should be syntaxically correct. Otherwhise we print an error message like http://www.plantuml.com/plantuml/png/SoWkIImgAStDuV98BKfLICnJI2qgoYyYWUUGcfS2r0y0
+MG-->Printing the error message is perfect. I think this way the user gets the hint to correct it.
+
+
+
+== Return function
+
+A function doing some computation and returning a result is called **return function**.
+
+Return function should be syntaxically correct. Otherwhise we print an error message like http://www.plantuml.com/plantuml/png/SoWkIImgAStDuV98BKfLICnJI2qgoYyYWUUGcfS2r0y0
+
+Example:
+----
+@startuml
+$function square($i)
+$return $i*$i
+$endfunction
+
+$function inc($i)
+$return $i+1
+$endfunction
+
+$function abs($i)
+$if $i>0 then
+$return $i
+$else
+$return -$i
+$endfunction
+
+Alice -> Bob : The price is $square($inc($abs(-9)))
+' print The price is 100
+
+@enduml
+----
+
+
+
+== Void function
+A **void function** does not contain any **return**.
+It's used to generate some part of a text diagram.
+
+Example:
+----
+@startuml
+$function msg($source, $destination)
+$source --> $destination
+$endfunction
+
+$function init_class($name)
+class $name {
+ init()
+ toString()
+ hashCode()
+}
+$endfunction
+
+init_class(foo1)
+init_class(foo2)
+msg(foo1, foo2)
+@enduml
+----
+
+**void function** can call **return function** but the other way is not possible.
+
+so you can have:
+----
+@startuml
+$function msg2($source, $destination, $price)
+$source --> $destination : the price is $square($inc($abs($price)))
+$endfunction
+
+msg2(foo1, foo2, 30)
+@enduml
+----
+
+
+
+== Visibility scope of variables
+* Did you think about visibility of variables?
+** --> Not really :-)
+* Is there something like local and global space for those variables or do you want to work with global visibility of variables only?
+
+Here is our proposal:
+* variables defined in return or void function are local : they are not know outside the function
+* variables defined outside of function are global : they are visible everywhere, including from function
+
+MG -> Sounds consistent. Restricting local variables sounds perfect. Think about how to handle errors that are related to global-local overrides, meaning somebody defines first a global variable and later a local variable with the same name in the function.
+
+[chillin] Keep it simple. Forbid redefinition of a function or variable (with scope visibility). In case this happens, show a clear error message of the redefinition line, the name of the variable, and the line of the original function/variable definition (include the file name if it's a different (library) file).
+The target should be to cover most use cases while keeping the implementation and usage as simple a possible.
+Note: the scope of !included functions/variables shall depend on the location of the !include line.
+
+[SW].OK to forbid redefinition of a function or variable. In order to avoid problems with identical variable names, it would be wise to propose to prefix global variables with \_\_ (or something else). It would be a great pity to define global variables such as i or j (idem for functions).
+
+
+== Data types and arithmethic expressions
+Supported data types are:
+
+* String
+* Integer [SW](32-64 bits?)
+* Boolean
+* Float [SW](32-64 bits?)
+
+Proposal [chillin]: define boolean states by built-in global variables $true and $false. This makes a clear and easy distinction of a boolean and string definition.
+
+When using arithmetic functions the following cases for data types are possible, e.g.:
+* String + String = concatenated string (no implicit conversion needed)
+* String + Integer = concatenated string (implicitly does "string + str(integer)")
+* String + Float = concatenated string (implicitly does "string + str(float)")
+* Integer + Integer = Integer
+* Float + Float = Float
+* [SW]Integer + Float = Float
+* [SW]Float + Integer = Float
+
+Example:
+----
+ $a = "a_string"
+ $b = "and a non-string operation always results in "
+ $i = 1
+ $z_final = " string"
+
+ A -> B : $a + $b + $i + $z_final
+ 'results in: A -> B : a_string and a non-string operation always results in 1 string
+----
+
+Support the following operators:
+
+* strings: + (concatenation)
+* float: all normal mathematical operators
+* integer: all normal mathematical operators, [SW](included % as reminder), shift and bitwise operators
+* boolean: all normal boolean operators (and, or, not, xor)
+
+An operation on the built-in $undefined symbol shall always yield $undefined.
+
+Implicit conversions and their results:
+
+* integer to string (if one of the operands is a string, python-like str() conversion)
+* float to string (if one of the operands is a string, python-like str() conversion)
+* boolean to string (if one of the operands is a string, python-like str() conversion)
+* undefined to string (if one of the operands is a string, the $undefined state results in the 'undefined' string)
+* boolean to integer (if the other operand is an integer the boolean is converted to 1 (if $true), or 0 (if $false))
+* boolean to float (if the other operand is a float the boolean is converted to 1.0 (if $true), or 0.0 (if $false))
+* [SW]integer to float
+
+Explicit conversions:
+
+* to string: via built-in function $str()
+* to boolean: via built-in function $bool()
+** from string: $false (if the string is empty or whitespace only), or $true otherwise
+** from integer: $true if non-zero, or $false otherwise
+** from float: $true if non-zero, or $false otherwise
+* [SW]to integer: via built-in function $int()
+* [SW]to float: via built-in function $float()
+
+Evaluation order is from left to right and can be controlled through parentheses.
+
+Examples:
+----
+$a = "implicit conversion results: "
+$b = 1
+$c = 0
+$d = $true
+A -> B : $a + $b + $c
+'results in: A -> B : implicit conversion results: 10
+A -> B : $a + ($b + $c)
+'results in: A -> B : implicit conversion results: 1
+A -> B : $a + ($b + $d)
+'results in: A -> B : implicit conversion results: 2
+A -> B : $a + $b + $d
+'results in: A -> B : implicit conversion results: 1 true
+----
+
+
+
+== Allowed function and variable names
+Any function and variable name shall be constructed from the symbol set [A-Zaz0-9\_]. An additional constraint is that a name shall not start with a digit.
+Function and variable names are case sensitive.
+
+This seems sufficient for most use cases and does not conflict with existing PlantUML naming conventions.
+
+
+
+== Builtin functions
+
+Some functions are defined by default. Their name starts by `+%+`
+
+|===
+| Name | Description | Example | Return
+
+| `+%strlen+`
+| Calculate the length of a String
+| `+%strlen("foo")+`
+| `+3+` in the example
+
+| `+%substr+`
+| Extract a substring. Takes 2 or 3 arguments
+| `+%substr("abcdef", 3, 2)+`
+| `+"de"+` in the example
+
+| `+%strpos+`
+| Search a substring in a string
+| `+%strpos("abcdef", "ef")+`
+| 4 (position of `+ef+`)
+
+| `+%file_exists+`
+| Check if a file exists on the local filesystem
+| `+%file_exists("c:/foo/dummy.txt")+`
+| `+true+` if the file exists, this function requires an absolute path
+
+| `+%getenv+`
+| Retrieve environment variable value
+| `+%getenv("OS")+`
+| The value of `+OS+` variable
+
+| `+%dirpath+`
+| Retrieve current dirpath
+| `+%dirpath()+`
+| Current path without ending path separator
+
+| `+%filename+`
+| Retrieve current filename
+| `+%filename()+`
+| Current filename
+
+| `+%date+`
+| Retrieve current date. You can provide an optional https://docs.oracle.com/javase/7/docs/api/java/text/SimpleDateFormat.html[format for the date]
+| `+%date("yyyy.MM.dd at HH:mm")+`
+| Current date
+
+|===
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/pmwiki.adoc b/plantuml-docs/docs_from_alphadoc/pmwiki.adoc
new file mode 100644
index 00000000..0b61a53f
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/pmwiki.adoc
@@ -0,0 +1,38 @@
+== PmWiki integration
+
+
+
+== Description
+This recipe uses PlantUML to produce UML diagrams inside http://www.pmwiki.org[PmWiki].
+
+The syntax is described on the http://plantuml.com[PlantUML website].
+
+Images are generated by the online service http://plantuml.com/plantuml[http://www.plantuml.com].
+
+
+
+
+== Installation
+
+Download `+[[pmplantuml_php.txt|pmplantuml.php]]+` file and copy if into your cookbook directory (e.g. __/.../pmwiki/cookbook__)
+with the correct name `+pmplantuml.php+`.
+
+Include the following line in your __local/config.php__ :
+
+----
+include_once("$FarmD/cookbook/pmplantuml.php");
+----
+
+
+
+== Usage
+
+You can use standard `+@startuml+` and `+@enduml+` keywords into your page:
+
+The images are generated automatically:
+
+image::pmwiki03.png[]
+
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/poll-about-package-and-namespace.adoc b/plantuml-docs/docs_from_alphadoc/poll-about-package-and-namespace.adoc
new file mode 100644
index 00000000..c5f95333
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/poll-about-package-and-namespace.adoc
@@ -0,0 +1,211 @@
+== Issue about Namespace and Package
+
+Right now, the management of `+namespace+` and `+package+` may sound odd to users.
+
+The real reason for this is some bad design decision made 10 years ago.
+
+**So here is our new proposal:**
+
+__Merge the notion of package or namespace in PlantUML so that package or namespace will be synonymous and behave as in all regular programming languages.__
+
+* vote::no[Do not change anything] and keep the actual behaviour of PlantUML.
+* vote::go[Ok, implement this] I understand that I __may__ have to add `+set separator none+` to some old class diagrams to let them work as today.
+* vote::another[Find another solution] that won't break ascending compatibility.
+
+You just have to click on one of the buttons to vote.
+
+You have to add `+!pragma useNewPackage+` directive to your diagrams to activate the new package behaviour.
+
+
+== Beta testing this new feature
+
+The pool shows that the vast majority of users are welcoming this change.
+
+Since this change may have some impact on existing diagrams, we are going to move slowly on this new feature.
+
+Note that many diagrams are impacted by this changes:
+
+* https://plantuml.com/class-diagram[class diagram]
+* https://plantuml.com/use-case[use case diagram]
+* https://plantuml.com/activity-diagram-legacy[activity diagram]
+* https://plantuml.com/component-diagram[component diagram]
+* https://plantuml.com/state-diagram[state diagram]
+* https://plantuml.com/deployment-diagram[deployment diagram]
+
+Other diagrams (including https://plantuml.com/sequence-diagram[sequence diagrams] and https://plantuml.com/activity-diagram-beta[activity beta diagrams]) are not impacted.
+
+For starting, we need feedback from users to know if we still are on the right path.
+So last beta http://beta.plantuml.net/plantuml.jar[last beta plantuml.jar] and http://www.plantuml.com/plantuml/uml/SoWkIImgAStDuL8iA4fCpqrKA2rEzKij3qXCpavCJ-LApaaiBbR8IotHIyqhoIp9J2tMAovDqalBp-ToICrB0Me40000[the online server] provides now a convenient way for testing this feature.
+
+Those versions __temporary__ implement both behaviours. You just have to add `+!pragma useNewPackage+` directive to activate the new package behaviour.
+
+If you are already using PlantUML, it is very important that you test now this beta feature. Indeed, nothing has been definitively settled yet, http://alphadoc.plantuml.com/doc/dokuwiki/en/poll-about-package-and-namespace#2ou4k28pt3ukk5v9fq2d[so feedback] will help us to find out any regressions.
+
+This way, we will commit the right change for you. And when this beta feature will become the default behaviour, your diagrams will be safe.
+
+
+== Proposition of new behaviour
+
+You can use `+!pragma useNewPackage+` to enable the new behaviour.
+
+By default, the double colon `+::+` will be interpreted by PlantUML as a separator.
+
+Even if package are not explicitly nested, they will be printed as nested:
+
+@startuml
+!pragma useNewPackage
+package net {
+ class foo1
+}
+
+package net::entities {
+ class foo2
+}
+
+package net::entities::sub {
+ class foo3
+}
+@enduml
+
+
+
+
+The following diagrams will give the same image:
+
+
+@startuml
+!pragma useNewPackage
+package net {
+ class foo1
+
+ package entities {
+ class foo2
+
+ package sub {
+ class foo3
+ }
+ }
+}
+@enduml
+
+
+or
+
+
+@startuml
+!pragma useNewPackage
+class net::foo1
+class net::entities::foo2
+class net::entities::sub::foo3
+@enduml
+
+
+Note that if you prefer, you could change `+package+` to `+namespace+` in those examples and you will get the same image.
+
+
+== Separator change
+
+Following first poll result, the double colon `+::+` is the default separator. You can still vote so that we decide to confirm this.
+
+What should be the default value for `+set separator+` directive:
+
+* vote::none[set separator none] This will help compatibility with the legacy behaviour of PlantUML.
+* vote::point[set separator .] This is consistent with Java/C#/C++ usage.
+* vote::doublecolon[set separator ::] This is consistent with UML standard, and will also help compatibility with legacy PlantUML
+* vote::other[Another value] You don't like the first choices.
+
+
+As said, right now, in last beta, the double colon `+::+` is the default separator. But you can change it using `+set separator+` directive.
+
+@startuml
+!pragma useNewPackage
+package net {
+ class foo1
+}
+
+package net::entities {
+ class foo2
+}
+
+package net::entities::sub {
+ class foo3
+}
+@enduml
+class net::entities::sub::foo4
+
+
+
+This separator feature would also be useful to retrieve the current behaviour, if **you don't** want the double colon `+::+` to be interpreted as a separator.
+
+For example, you could have:
+
+@startuml
+!pragma useNewPackage
+set separator none
+package net {
+ class foo1
+}
+
+package net.entities {
+ class foo2
+}
+
+package net.entities.sub {
+ class foo3
+}
+@enduml
+
+
+Here we fall back to the actual drawing of legacy PlantUML version.
+
+Once again, you could change `+package+` to `+namespace+` in those examples and you will get the same images.
+
+If using `+set separator none+` do not give you an acceptable result, http://alphadoc.plantuml.com/doc/dokuwiki/en/poll-about-package-and-namespace#2ou4k28pt3ukk5v9fq2d[please contact us].
+
+
+== Nested namespaces
+
+Setting separator to `+none+` disable the merge of nested packages.
+For example, compare :
+
+
+@startuml
+!pragma useNewPackage
+namespace f1 {
+ namespace f2 {
+ class f3
+ }
+}
+@enduml
+
+
+and
+
+
+@startuml
+!pragma useNewPackage
+set separator none
+namespace f1 {
+ namespace f2 {
+ class f3
+ }
+}
+@enduml
+
+
+
+== Feedback
+
+If during your tests you find some issues:
+
+* non-working diagram
+* regression with `+set separator none+` on your diagram
+
+please give us some feedback. You can either:
+
+* Edit this part.
+* Use the chat window.
+* mailto:plantuml@gmail.com[Send us an email.]
+* https://forum.plantuml.net/[Post a message on the forum.]
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/poll-about-wiki-syntax.adoc b/plantuml-docs/docs_from_alphadoc/poll-about-wiki-syntax.adoc
new file mode 100644
index 00000000..bb631d26
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/poll-about-wiki-syntax.adoc
@@ -0,0 +1,27 @@
+== Vote for your syntax!
+
+We do not want to force users to learn some new syntax for this wiki.
+
+So this website will __transparently__ allow users to use their preferred syntax.
+
+Right now, only three syntaxes are (partially) supported:
+* link::syntax-asciidoc[Asciidoc syntax]
+* link::syntax-dokuwiki[Dokuwiki syntax]
+* link::syntax-markdown[Markdown syntax]
+
+You can vote to choose which others syntaxes should also be supported.
+
+You just have to click on one vote button:
+
+* vote::asciidoctor[I vote for Asciidoc Syntax] (**Already working**)
+* vote::confluence[I vote for Confluence Markup]
+* vote::creole[I vote for Creole syntax]
+* vote::dokuwiki[I vote for Dokuwiki syntax] (**Already working**)
+* vote::markdown[I vote for Markdown syntax] (**Already working**)
+* vote::mediawiki[I vote for MediaWiki syntax]
+* vote::pandoc[I vote for pandoc syntax]
+* vote::another[I vote for another syntax] __(Please update the pool in that case or use the post-it to indicate which syntax you're thinking of)__
+
+(Tooltips on vote buttons display vote results.)
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/preprocessing-gallery.adoc b/plantuml-docs/docs_from_alphadoc/preprocessing-gallery.adoc
new file mode 100644
index 00000000..d32c7aac
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/preprocessing-gallery.adoc
@@ -0,0 +1,213 @@
+== Preprocessing Gallery (preprocessing-gallery)
+
+
+== Preprocessing User Gallery
+
+Gathered here all user preprocessing codes.
+
+
+== Template
+
+
+@startuml
+
+[code here]
+
+@enduml
+
+
+__[Ref. https://forum.plantuml.net[QA-nnn]]__
+
+
+== Note on Member [noteMember] (Class Diagram)
+
+
+@startuml
+'Source: QA-10113
+!unquoted function DRAW($x) return %set_variable_value($x, 1)
+!procedure noteMember($part, $direction, $class, $member, $note)
+ !if %variable_exists($part)
+ note $direction of $class::"$member"
+ $note
+ end note
+ !endif
+!endprocedure
+
+DRAW(PART1)
+
+!ifdef PART1
+title Elements and Notes Part1
+!endif
+
+class elementArray <<(E,#32DC32)element>> {
+ name : someId
+ name : MemberA
+ name : MemberB
+ name : MemberC
+ name : MemberD
+ name : MemberE
+}
+
+noteMember("PART1", "left", "elementArray", "name : MemberB", "Member of Interest")
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/10113[QA-10113]]__
+
+
+== Msg (used on Sequence Diagram)
+
+
+@startuml
+!function LineColor() return "#blue"
+
+!unquoted procedure Msg($from, $to, $note = "", $activate = "false")
+ !if (($activate == "true") || ($activate == "TRUE"))
+ $from [LineColor()]->> $to ++
+ !else
+ $from [LineColor()]->> $to
+ !endif
+
+ !if ($note!="")
+ note left : $note
+!endprocedure
+
+box
+ participant "Service A" as A
+ participant "Service B" as B
+end box
+
+box
+ database "Service C" as C
+end box
+
+Msg(A, B, "", true)
+Msg(B, C, "B to C msg", false)
+deactivate B
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/9954[QA-9954]]__
+
+
+== Example of date
+
+
+@startuml
+!THE_DATE=%date()
+!ANOTHER_DATE=%date("yyyy.MM.dd G' at 'HH:mm:ss z")
+Title Generated THE_DATE \nor ANOTHER_DATE
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/5095[QA-5095]]__
+
+
+== Table and Link demo using JSON and preprocessing (Class diagram)
+
+
+@startuml
+'table and link demo using JSON and preprocessing
+
+hide stereotype
+hide class circle
+hide methods
+skinparam shadowing false
+skinparam defaultFontName Helvetica
+skinparam DefaultTextAlignment left
+skinparam RoundCorner 10
+skinparam pathHoverColor black
+skinparam arrow {
+ Color grey
+}
+
+skinparam class {
+ BackgroundColor grey
+ BorderColor black
+ FontColor white
+ FontStyle bold
+ AttributeFontColor white
+}
+
+title JSON Tables
+
+!$foo = {
+ "table": [
+ {
+ "table_name": "table1",
+ "description": "table1 is a table",
+ "columns": [
+ {
+ "name": "+id"
+ },
+ {
+ "name": "*name"
+ },
+ {
+ "name": "#foreign_key"
+ }
+ ]
+ },
+ {
+ "table_name": "table2",
+ "description": "table2 is a table",
+ "columns": [
+ {
+ "name": "-id"
+ },
+ {
+ "name": "~name"
+ }
+ ]
+ },
+ {
+ "table_name": "table3",
+ "description": "table3 is a table",
+ "columns": [
+ {
+ "name": "name"
+ },
+ {
+ "name": "value"
+ }
+ ]
+ }
+ ],
+ "link": [
+ {
+ "source_table": "table1",
+ "target_table": "table2",
+ "description": "table1.foreign_key = table2.id",
+ "cardinality": "M:1"
+ },
+ {
+ "source_table": "table1",
+ "target_table": "table3",
+ "description": "table1.name = table3.name",
+ "cardinality": "1:M"
+ }
+ ]
+}
+
+!foreach $tab in $foo.table
+class "%upper($tab.table_name)" as $tab.table_name {
+ !foreach $col in $tab.columns
+ $col.name
+ !endfor
+}
+url for $tab.table_name is [[{$tab.description}]]
+!endfor
+
+!foreach $link in $foo.link
+!if ($link.cardinality == "M:1")
+ $link.source_table }-- $link.target_table [[{$link.description}]]: " "
+!else
+ $link.source_table -- $link.target_table [[{$link.description}]]: " "
+!endif
+!endfor
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/13152/do-you-like-this-puml-fom-schema?show=13189#c13189[Comment on QA-13152]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/preprocessing-json.adoc b/plantuml-docs/docs_from_alphadoc/preprocessing-json.adoc
new file mode 100644
index 00000000..ed324295
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/preprocessing-json.adoc
@@ -0,0 +1,374 @@
+== Preprocessing JSON
+
+Some __JSON preprocessing__ capabilities are included in PlantUML, and available for all diagrams.
+
+That extends the current link::preprocessing[preprocessing].
+
+๐ __If you are looking for how to display JSON data: see rather link::json[Display JSON Data].__
+
+
+== Variable definition
+
+In addition to existing type (__String__ and __Integer__), you can define JSON variable.
+
+Example:
+
+----
+!$foo = { "name": "John", "age" : 30 }
+----
+
+Corresponding of this structure:
+
+
+@startjson
+{
+"$foo": { "name": "John", "age" : 30 }
+}
+@endjson
+
+
+
+== Access to data
+
+Once a variable is defined, you can access to its members:
+
+
+@startuml
+!$foo = { "name": "John", "age" : 30 }
+Alice -> Bob : Do you know **$foo.name** ?
+@enduml
+
+
+
+== Complex structures
+
+It is possible to use complex JSON objects and arrays, with definition on several lines.
+
+Let `+$foo+`, the structure:
+
+@startjson
+{
+"$foo":{ "company": "Skynet", "employees" : [
+ {"name" : "alice", "salary": 100 },
+ {"name" : "bob", "salary": 50} ]
+}
+}
+@endjson
+
+
+
+You can acess to the values:
+* `+$foo.employees[0].name+`
+* `+$foo.employees[0].salary+`
+
+
+
+@startuml
+!$foo = { "company": "Skynet", "employees" : [
+ {"name" : "alice", "salary": 100 },
+ {"name" : "bob", "salary": 50} ]
+}
+start
+:The salary of $foo.employees[0].name is $foo.employees[0].salary;
+@enduml
+
+
+
+Or using intermediate variables:
+* `+!$attribute_1="name"+`
+* `+!$attribute_2="salary"+`
+to acess to the values:
+* `+$foo.employees[0][$attribute_1]+`
+* `+$foo.employees[0][$attribute_2]+`
+
+
+@startuml
+!$foo = { "company": "Skynet", "employees" : [
+ {"name" : "alice", "salary": 100 },
+ {"name" : "bob", "salary": 50} ]
+}
+
+!$attribute_1="name"
+!$attribute_2="salary"
+
+start
+:The salary of $foo.employees[0][$attribute_1] is $foo.employees[0][$attribute_2];
+@enduml
+
+
+
+== Loading data
+
+Some standard function provides a way to load JSON object from URL or local files:
+
+----
+!$foo = %loadJSON("http://foo.net/users/list.json")
+!$foo2 = %loadJSON("myDir/localFile.json")
+----
+
+__Available since 1.2021.15__
+
+
+== Loop [foreach]
+
+If you define array, you can loop over.
+
+
+@startmindmap
+!$foo = { "company": "Skynet", "employees" : [
+ {"name" : "alice", "salary": 100 },
+ {"name" : "bob", "salary": 50} ]
+}
+
+* The salary of
+!foreach $emp in $foo.employees
+ ** **$emp.name**
+ *** is
+ **** **$emp.salary**
+!endfor
+@endmindmap
+
+
+[SW] Some remarks
+* for or better foreach ? -> `+foreach+`
+* It would be nice to also have "break" and "continue"
+* It would be nice to also have the for or while loop with a standard variable
+
+
+== Full Example
+
+From a example worked in a forum question, with this JSON structure:
+
+@startjson
+{
+"data":
+ {
+ "participants": [
+ {"name": "XYZ", "as": "xyz"},
+ {"name": "RST", "as": "rst"},
+ {"name": "UVW", "as": "uvw"}]
+ }
+}
+@endjson
+
+
+
+@startuml
+!unquoted function DRAW($x) return %set_variable_value($x, 1)
+
+!procedure addComponent($part, $component, $as)
+ !if %variable_exists($part)
+ participant "$component" as $as
+ !endif
+!end procedure
+
+!procedure addBox2($part, $box, $colour, $data)
+ !if %variable_exists($part)
+ box "$box" #$colour
+ !foreach $item in $data.participants
+ addComponent($part, $item.name, $item.as)
+ !endfor
+ end box
+ !endif
+!end procedure
+
+DRAW(PART25)
+
+!ifdef PART25
+title TESTING (Boxes & Participants) //Part25//
+!endif
+
+!$data={
+ "participants": [
+ {"name": "XYZ", "as": "xyz"},
+ {"name": "RST", "as": "rst"},
+ {"name": "UVW", "as": "uvw"}]
+}
+
+addBox2("PART25", "New Box", "white", $data)
+@enduml
+
+
+
+== Self-descriptive example
+
+Here is a self-descriptive example:
+
+
+@startuml
+left to right direction
+
+!$data={"parts":[
+{"shape": "cloud", "name": "id1", "colour": "#palegreen", "desc": "some text"},
+{"shape": "folder", "name": "id2", "colour": "#lightblue", "desc": "more text"},
+{"shape": "database", "name": "id3", "colour": "#pink", "desc": "even more text"}
+]}
+
+rectangle Outer {
+rectangle Inner #tan as "
+{{json
+$data
+}}
+"
+together {
+!foreach $part in $data.parts
+ $part.shape $part.colour $part.name as "$part.desc"
+ Inner --> $part.name
+!endfor
+}
+}
+@enduml
+
+
+__[Adapted from https://forum.plantuml.net/12917/how-to-mix-json-objects-into-a-components-diagram?show=12927#c12927[QA-12917]]__
+
+
+== `+%get_json_keys+` builtin function
+
+You can use `+%get_json_keys+` to get all the keys of one level on a JSON structure.
+
+
+@startuml
+!$myjson = {
+"root" : [{
+ "fruits": [
+ {"name": "apple", "colorId": "1"},
+ {"name": "pear", "colorId": "2"},
+ {"name": "pineapple", "colorId": "3"}
+ ]
+},
+{
+ "colors": [
+ {"id": "1", "name": "red"},
+ {"id": "2", "name": "green"},
+ {"id": "3", "name": "yellow"}
+ ]
+}]
+}
+
+!foreach $key in %get_json_keys($myjson.root)
+ rectangle $key
+!endfor
+@enduml
+
+
+
+@startwbs
+!$json_object = {
+ "name": "Mark McGwire", "hr": 65, "avg": 0.278
+}
+
+* json_object
+ * keys of json_object
+!foreach $key in %get_json_keys($json_object)
+ * $key
+!endfor
+@endwbs
+
+
+
+__[Ref. https://forum.plantuml.net/15360/ideas-for-2-new-json-builtins[QA-15360], https://forum.plantuml.net/15423/functions-check-exists-default-value-get_variable_value[QA-15423]]__
+
+
+== `+%get_json_type+` builtin function
+
+You can use `+%get_json_type+` to get the type of an element of a JSON structure (returns a string).
+
+@startuml
+!$json_object = {
+ "name": "Mark McGwire", "hr": 65, "avg": 0.278,
+ "letters": ["a", "b", "c"]
+}
+
+label l [
+=json_object:
+{{json
+$json_object
+}}
+
+|= $variable |= get_json_type($var) |
+| json_object | %get_json_type($json_object) |
+| json_object.name | %get_json_type($json_object.name) |
+| json_object.hr | %get_json_type($json_object.hr) |
+| json_object.letters | %get_json_type($json_object.letters) |
+
+Test on type:
+!if %get_json_type($json_object.letters)=="array"
+ json_object.letters is an **%get_json_type($json_object.letters)**
+!endif
+]
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/15360/ideas-for-2-new-json-builtins[QA-15360]]__
+
+
+== `+ %json_key_exists+` builtin function
+
+You can use `+%json_key_exists+` to know if a key exists on a JSON structure (returns a boolean).
+
+
+@startuml
+!$json_object= {
+ "name": "Mark McGwire", "hr": 65, "avg": 0.278
+}
+
+label l [
+|= key |= json_key_exists(json_object, key) |
+| "hr" | %json_key_exists($json_object, "hr") |
+| "foo" | %json_key_exists($json_object, "foo")|
+| null | %json_key_exists($json_object, null) |
+]
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/15423/functions-check-exists-default-value-get_variable_value[QA-15423]]__
+
+
+== `+ %size+` builtin function
+
+You can use `+%size+` to know the size of different elements on a JSON structure.
+
+For each type here are the return value:
+|===
+| **Type** | **Return value**
+
+| `+JSON Object+`
+| the number of pairs it contains
+
+| `+JSON Array+`
+| the number of values it contains
+
+| `+string+` value
+| the number of characters it contains
+
+| `+numeric+` value
+| zero
+
+| `+true+`/`+false+`/`+null+`
+| zero
+
+|===
+
+
+@startuml
+!$json_object= {
+ "name" : "Mark McGwire",
+ "hr" : 65,
+ "avg" : 0.278,
+ "letters": ["a", "b", "c"]
+}
+
+label l [
+|= $variable |= get_json_type($var) |= size($var) |
+| json_object | %get_json_type($json_object) | %size($json_object) |
+| json_object.name | %get_json_type($json_object.name) | %size($json_object.name) |
+| json_object.hr | %get_json_type($json_object.hr) | %size($json_object.hr) |
+| json_object.letters | %get_json_type($json_object.letters) | %size($json_object.letters) |
+]
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/14901/number-of-elements-in-list-during-json-preprocessing[QA-14901]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/preprocessing-v2.adoc b/plantuml-docs/docs_from_alphadoc/preprocessing-v2.adoc
new file mode 100644
index 00000000..b3998eaf
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/preprocessing-v2.adoc
@@ -0,0 +1,554 @@
+== Preprocessing-v2 (old)
+
+Some minor preprocessing capabilities are included in **PlantUML**,
+and available for __all__ diagrams.
+
+Those functionalities are very similar to the http://en.wikipedia.org/wiki/C_preprocessor[C language preprocessor], except that the special character `+#+` has been changed to the exclamation mark `+!+`.
+
+The actual preprocessor will be replaced by a new one, with new functionalities. This new preprocessor is 95% compatible with the current one.
+
+Right now, you have to switch to the new preprocessor using a special directive `+!preprocessorV2+` with last offical release (that is V1.2019.5). Or you can directly use http://beta.plantuml.net/plantuml.jar[the last beta] where the V2 preprocessor is enabled by default.
+
+This way, you can check that your diagram are still working with the future version.
+In some future, the **old preprocessor** will be removed.
+
+
+== Migration notes
+
+The new preprocessor will be enable by default in the incoming versions of PlantUML.
+
+Even if some legacy feature are still supported with the new preprocessor, you should not use them any more (they might be finally removed in some long term future).
+
+* You should not use `+!define+` and `+!definelong+` anymore. Use `+!function+` and variable definition instead
+* `+!include+` allows now multiple inclusions : you don't have to use `+!include_many+` anymore
+* `+!include+` now accept URL, so you don't need `+!includeurl+`
+* Some features (like `+%date%+`) have been replaced by builtin functions (for example `+%date()+`)
+* When calling a legacy `+!definelong+` macro with no arguments, you do have to use parenthesis. That is you have to use `+my_own_definelong()+` because `+my_own_definelong+` without parenthesis is not recognized by the new preprocessor.
+
+
+
+Please contact us if you have any issues.
+
+
+
+== Variable definition
+
+Although this is not mandatory, we highly suggest that variable name start with a `+$+`.
+There are two kind of data:
+* Integer number
+* String, that must be surrender by simple quote or double quote.
+
+Variable created outside function are **global**, that is you can access to them from everywhere (including from functions). You can emphasize this by using the optional `+global+` keyword when defining a variable.
+
+
+
+@startuml
+'!preprocessorV2
+!$ab = "foo1"
+!$cd = "foo2"
+!$ef = $ab + $cd
+
+Alice -> Bob : $ab
+Alice -> Bob : $cd
+Alice -> Bob : $ef
+@enduml
+
+
+
+== Conditions
+
+* You can use expression in condition.
+* __else__ is also implemented
+
+
+@startuml
+'!preprocessorV2
+!$a = 10
+!$ijk = "foo"
+Alice -> Bob : A
+!if ($ijk == "foo") && ($a+10>=4)
+Alice -> Bob : yes
+!else
+Alice -> Bob : This should not appear
+!endif
+Alice -> Bob : B
+@enduml
+
+
+
+== Void function
+
+* Function name __should__ start by a `+$+`
+* Argument names __should__ start by a `+$+`
+* Void functions can call other void functions
+
+Example:
+
+
+
+@startuml
+!preprocessorV2
+!function msg($source, $destination)
+$source --> $destination
+!endfunction
+
+!function init_class($name)
+class $name {
+$addCommonMethod()
+}
+!endfunction
+
+
+!function $addCommonMethod()
+ toString()
+ hashCode()
+!endfunction
+
+
+init_class("foo1")
+init_class("foo2")
+msg("foo1", "foo2")
+@enduml
+
+
+Variables defined in functions are **local**. It means that the variable is destroyed when the function is exited.
+
+
+
+== Return function
+
+A return function does not output any text.
+It just define a function that you can call:
+* directly in variable definition or in diagram text
+* from other return function
+* from other void function
+
+
+* Function name __should__ start by a `+$+`
+* Argument names __should__ start by a `+$+`
+
+
+@startuml
+'!preprocessorV2
+!function $double($a)
+!return $a + $a
+!endfunction
+
+Alice -> Bob : The double of 3 is $double(3)
+@enduml
+
+
+It is possible to shorten simple function definition in one line:
+
+
+@startuml
+'!preprocessorV2
+!function $double($a) return $a + $a
+
+Alice -> Bob : The double of 3 is $double(3)
+Alice -> Bob : $double("This work also for strings.")
+@enduml
+
+
+As in void function, variable are local by default (they are destroyed when the function is exited). However, you can access to global variables from function. However, you can use the `+local+` keyword to create a local variable if ever a global variable exists with the same name.
+
+----
+@startuml
+'!preprocessorV2
+
+!function $dummy()
+!local $ijk = "local"
+Alice -> Bob : $ijk
+!endfunction
+
+!global $ijk = "foo"
+
+Alice -> Bob : $ijk
+$dummy()
+Alice -> Bob : $ijk
+
+@enduml
+----
+
+
+== Default argument value
+
+In both return and void function, you can define default value for argument.
+
+
+@startuml
+'!preprocessorV2
+!function $inc($value, $step=1)
+!if $step==0
+!return $value
+!endif
+!return $value + $step
+!endfunction
+
+Alice -> Bob : Just one more $inc(3)
+Alice -> Bob : Add two to three : $inc(3, 2)
+@enduml
+
+
+
+== Unquoted function
+
+By default, you have to put quotes when you call a function.
+It is possible to use the `+unquoted+` keyword to indicate that a function does not require quotes for its arguments.
+
+
+
+@startuml
+'!preprocessorV2
+
+!unquoted function id($text1, $text2="FOO") return $text1 + $text2
+
+alice -> bob : id(aa)
+alice -> bob : id(ab,cd)
+@enduml
+
+
+
+== Including files or URL
+
+Use the `+!include+` directive to include file in your diagram. Using URL, you can also include file from Internet/Intranet.
+
+Imagine you have the very same class that appears in many
+diagrams. Instead of duplicating the description of this class, you can
+define a file that contains the description.
+
+
+@startuml
+'!preprocessorV2
+interface List
+List : int size()
+List : void clear()
+List <|.. ArrayList
+@enduml
+
+
+**File List.iuml**
+----
+interface List
+List : int size()
+List : void clear()
+----
+
+The file `+List.iuml+` can be included in many diagrams, and
+any modification in this file will change all diagrams that include it.
+
+You can also put several `+@startuml/@enduml+` text block in an included file and then specify which block
+you want to include adding `+!0+` where `+0+` is the block number. The `+!0+` notation denotes the first diagram.
+
+For example, if you use `+!include foo.txt!1+`, the second `+@startuml/@enduml+` block
+within `+foo.txt+` will be included.
+
+You can also put an id to some `+@startuml/@enduml+` text block in an included file using
+`+@startuml(id=MY_OWN_ID)+` syntax and then include the block adding `+!MY_OWN_ID+` when including the file,
+so using something like `+!include foo.txt!MY_OWN_ID+`.
+
+By default, a file can only be included once. You can use `+!include_many+` instead of `+!include+` if you want to include some file several times. Note that there is also a `+!include_once+` directive that raises an error if a file is included several times.
+
+
+== Including Subpart
+
+You can also use `+!startsub NAME+` and `+!endsub+` to indicate sections of text to include from other files using `+!includesub+`. For example:
+
+**file1.puml:**
+----
+@startuml
+!preprocessorV2
+A -> A : stuff1
+!startsub BASIC
+B -> B : stuff2
+!endsub
+C -> C : stuff3
+!startsub BASIC
+D -> D : stuff4
+!endsub
+@enduml
+----
+
+file1.puml would be rendered exactly as if it were:
+----
+@startuml
+!preprocessorV2
+A -> A : stuff1
+B -> B : stuff2
+C -> C : stuff3
+D -> D : stuff4
+@enduml
+----
+
+
+However, this would also allow you to have another file2.puml like this:
+
+**file2.puml**
+----
+@startuml
+!preprocessorV2
+title this contains only B and D
+!includesub file1.puml!BASIC
+@enduml
+----
+
+This file would be rendered exactly as if:
+
+----
+@startuml
+!preprocessorV2
+title this contains only B and D
+B -> B : stuff2
+D -> D : stuff4
+@enduml
+----
+
+
+
+== Builtin functions
+
+Some functions are defined by default. Their name starts by `+%+`
+
+|===
+| Name | Description | Example | Return
+
+| `+%strlen+`
+| Calculate the length of a String
+| `+%strlen("foo")+`
+| `+3+` in the example
+
+| `+%substr+`
+| Extract a substring. Takes 2 or 3 arguments
+| `+%substr("abcdef", 3, 2)+`
+| `+"de"+` in the example
+
+| `+%strpos+`
+| Search a substring in a string
+| `+%strpos("abcdef", "ef")+`
+| 4 (position of `+ef+`)
+
+| `+%inval+`
+| Convert a String to Int
+| `+%intval("42")+`
+| 42
+
+| `+%file_exists+`
+| Check if a file exists on the local filesystem
+| `+%file_exists("c:/foo/dummy.txt")+`
+| `+true+` if the file exists
+
+| `+%function_exists+`
+| Check if a function exists
+| `+%function_exists("$some_function")+`
+| `+true+` if the function has been defined
+
+| `+%variable_exists+`
+| Check if a variable exists
+| `+%variable_exists("$my_variable")+`
+| `+true+` if the variable has been defined exists
+
+| `+%set_variable_value+`
+| Set a global variable
+| `+%set_variable_value("$my_variable", "some_value")+`
+| An empty string
+
+| `+%get_variable_value+`
+| Retrieve some variable value
+| `+%get_variable_value("$my_variable")+`
+| the value of the variable
+
+| `+%getenv+`
+| Retrieve environment variable value
+| `+%getenv("OS")+`
+| The value of `+OS+` variable
+
+| `+%dirpath+`
+| Retrieve current dirpath
+| `+%dirpath()+`
+| Current path
+
+| `+%filename+`
+| Retrieve current filename
+| `+%filename()+`
+| Current filename
+
+| `+%date+`
+| Retrieve current date. You can provide an optional https://docs.oracle.com/javase/7/docs/api/java/text/SimpleDateFormat.html[format for the date]
+| `+%date("yyyy.MM.dd at HH:mm")+`
+| Current date
+
+| `+%true+`
+| Return always `+true+`
+| `+%true()+`
+| `+true+`
+
+| `+%false+`
+| Return always `+false+`
+| `+%false()+`
+| `+false+`
+
+| `+%not+`
+| Return the logical negation of an expression
+| `+%not(2+2==4)+`
+| `+false+` in that example
+
+|===
+
+
+
+
+== Logging
+
+You can use `+!log+` to add some log output when generating the diagram. This has no impact at all on the diagram itself. However, those logs are printed in the command line's output stream. This could be useful for debug purpose.
+
+----
+@startuml
+!preprocessorV2
+!function bold($text)
+!$result = ""+ $text +""
+!log Calling bold function with $text. The result is $result
+!return $result
+!endfunction
+
+Alice -> Bob : This is bold("bold")
+Alice -> Bob : This is bold("a second call")
+@enduml
+----
+
+
+
+== Memory dump
+
+You can use `+!memory_dump+` to dump the full content of the memory when generating the diagram. An optional string can be put after `+!memory_dump+`. This has no impact at all on the diagram itself. This could be useful for debug purpose.
+
+----
+@startuml
+!preprocessorV2
+
+!function $inc($string)
+!$val = %intval($string)
+!log value is $val
+!dump_memory
+!return $val+1
+!endfunction
+
+Alice -> Bob : 4 $inc("3")
+!unused = "foo"
+!dump_memory EOF
+
+@enduml
+----
+
+
+
+
+== Assertion
+
+You can put assertion in your diagram.
+
+
+
+@startuml
+!preprocessorV2
+Alice -> Bob : Hello
+!assert %strpos("abcdef", "cd")==3 : "This always fail"
+@enduml
+
+
+
+
+
+
+== Building custom library
+
+It's possible to package a set of included files into a single .zip or .jar archive.
+This single zip/jar can then be imported into your diagram using `+!import+` directive.
+
+Once the library has been imported, you can `+!include+` file from this single zip/jar.
+
+**Example:**
+----
+@startuml
+!preprocessorV2
+!import /path/to/customLibrary.zip
+' This just adds "customLibrary.zip" in the search path
+
+!include myFolder/myFile.iuml
+' Assuming that myFolder/myFile.iuml is located somewhere
+' either inside "customLibrary.zip" or on the local filesystem
+
+...
+----
+
+
+== Search path
+
+You can specify the java property `+plantuml.include.path+` in the command line.
+
+For example:
+
+----
+java -Dplantuml.include.path="c:/mydir" -jar plantuml.jar atest1.txt
+----
+
+
+Note the this -D option has to put before the -jar option. -D options
+after the -jar option will be used to define constants within plantuml preprocessor.
+
+
+
+== Argument concatenation
+
+
+It is possible to append text to a macro argument using the `+##+` syntax.
+
+
+@startuml
+!preprocessorV2
+!unquoted function COMP_TEXTGENCOMP(name)
+[name] << Comp >>
+interface Ifc << IfcType >> AS name##Ifc
+name##Ifc - [name]
+!endfunction
+COMP_TEXTGENCOMP(dummy)
+@enduml
+
+
+
+
+
+== Dynamic function invocation
+
+You can dynamically invoke a void function using the special `+%invoke_void_func()+` void function.
+This function takes as first argument the name of the actual void function to be called. The following argument are copied to the called function.
+
+For example, you can have:
+----
+@startuml
+!preprocessorV2
+
+!function $go()
+ Bob -> Alice : hello
+!endfunction
+
+!$wrapper = "$go"
+
+%invoke_void_func($wrapper)
+@enduml
+----
+
+For return functions, you can use the corresponding special function `+%call_user_func()+` :
+
+----
+@startuml
+!preprocessorV2
+
+!function bold($text)
+!return ""+ $text +""
+!endfunction
+
+Alice -> Bob : %call_user_func("bold", "Hello") there
+@enduml
+----
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/preprocessing.adoc b/plantuml-docs/docs_from_alphadoc/preprocessing.adoc
new file mode 100644
index 00000000..04a3af88
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/preprocessing.adoc
@@ -0,0 +1,860 @@
+== Preprocessing
+
+Some preprocessing capabilities are included in **PlantUML**,
+and available for __all__ diagrams.
+
+Those functionalities are very similar to the http://en.wikipedia.org/wiki/C_preprocessor[C language preprocessor], except that the special character `+#+` has been changed to the exclamation mark `+!+`.
+
+
+== Variable definition [=, ?=]
+
+Although this is not mandatory, we highly suggest that variable names start with a `+$+`.
+
+There are three types of data:
+* **Integer number** __(int)__;
+* **String** __(str)__ - these must be surrounded by single quote or double quote;
+* **JSON**__ __(JSON) - these must be surrounded by curly brackets.
+__(for JSON variable definition and usage, see more details on link::preprocessing-json[Preprocessing-JSON page])__
+
+Variables created outside function are **global**, that is you can access them from everywhere (including from functions). You can emphasize this by using the optional `+global+` keyword when defining a variable.
+
+
+
+@startuml
+!$a = 42
+!$ab = "foo1"
+!$cd = "foo2"
+!$ef = $ab + $cd
+!$foo = { "name": "John", "age" : 30 }
+
+Alice -> Bob : $a
+Alice -> Bob : $ab
+Alice -> Bob : $cd
+Alice -> Bob : $ef
+Alice -> Bob : Do you know **$foo.name** ?
+@enduml
+
+
+
+
+You can also assign a value to a variable, only if it is not already defined, with the syntax: `+!$a ?= "foo"+`
+
+
+@startuml
+Alice -> Bob : 1. **$name** should be empty
+
+!$name ?= "Charlie"
+Alice -> Bob : 2. **$name** should be Charlie
+
+!$name = "David"
+Alice -> Bob : 3. **$name** should be David
+
+!$name ?= "Ethan"
+Alice -> Bob : 4. **$name** should be David
+@enduml
+
+
+
+== Boolean expression
+
+=== Boolean representation [0 is false]
+
+There is not real boolean type, but PlantUML use this integer convention:
+
+* Integer `+0+` means `+false+`
+* and any non-null number (as `+1+`) or any string (as `+"1"+`, or even `+"0"+`) means `+true+`.
+
+__[Ref. https://forum.plantuml.net/9702/%25false-returns-0-not-false-%25true-returns-1-not-true?show=9710#a9710[QA-9702]]__
+
+=== Boolean operation and operator [&&, \|\|, ()]
+You can use boolean expression, in the test, with :
+* __parenthesis__ `+()+`;
+* __and operator__ `+&&+`;
+* __or operator__ `+||+`.
+
+__(See next example, within `+if+` test.)__
+
+
+=== Boolean builtin functions [%false(), %true(), %not()]
+For convenience, you can use those boolean builtin functions:
+
+* `+%false()+`
+* `+%true()+`
+* `+%not()+`
+
+
+__[See also link::preprocessing#0umqmmdy1n9yk362kjka[Builtin functions]]__
+
+
+== Conditions [!if, !else, !elseif, !endif]
+
+* You can use expression in condition.
+* __else__ and __elseif__ are also implemented
+
+
+@startuml
+!$a = 10
+!$ijk = "foo"
+Alice -> Bob : A
+!if ($ijk == "foo") && ($a+10>=4)
+Alice -> Bob : yes
+!else
+Alice -> Bob : This should not appear
+!endif
+Alice -> Bob : B
+@enduml
+
+
+
+== While loop [!while, !endwhile]
+
+You can use `+!while+` and `+!endwhile+` keywords to have repeat loops.
+
+=== While loop (on Activity diagram)
+
+
+@startuml
+!procedure $foo($arg)
+ :procedure start;
+ !while $arg!=0
+ !$i=3
+ #palegreen:arg=$arg;
+ !while $i!=0
+ :arg=$arg and i=$i;
+ !$i = $i - 1
+ !endwhile
+ !$arg = $arg - 1
+ !endwhile
+ :procedure end;
+!endprocedure
+
+start
+$foo(2)
+end
+@enduml
+
+
+__[Adapted from https://forum.plantuml.net/10838/there-better-way-implement-while-loop-perprocess-function?show=10870#a10870[QA-10838]]__
+
+=== While loop (on Mindmap diagram)
+
+@startmindmap
+!procedure $foo($arg)
+ !while $arg!=0
+ !$i=3
+ **[#palegreen] arg = $arg
+ !while $i!=0
+ *** i = $i
+ !$i = $i - 1
+ !endwhile
+ !$arg = $arg - 1
+ !endwhile
+!endprocedure
+
+*:While
+Loop;
+$foo(2)
+@endmindmap
+
+
+=== While loop (on Component/Deployment diagram)
+
+
+@startuml
+!procedure $foo($arg)
+ !while $arg!=0
+ [Component $arg] as $arg
+ !$arg = $arg - 1
+ !endwhile
+!endprocedure
+
+$foo(4)
+
+1->2
+3-->4
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/14088/how-to-generate-a-series-of-same-component-at-once?show=14089#a14089[QA-14088]]__
+
+
+== Procedure [!procedure, !endprocedure]
+
+* Procedure names __should__ start with a `+$+`
+* Argument names __should__ start with a `+$+`
+* Procedures can call other procedures
+
+Example:
+
+
+
+@startuml
+!procedure $msg($source, $destination)
+ $source --> $destination
+!endprocedure
+
+!procedure $init_class($name)
+ class $name {
+ $addCommonMethod()
+ }
+!endprocedure
+
+
+!procedure $addCommonMethod()
+ toString()
+ hashCode()
+!endprocedure
+
+
+$init_class("foo1")
+$init_class("foo2")
+$msg("foo1", "foo2")
+@enduml
+
+
+Variables defined in procedures are **local**. It means that the variable is destroyed when the procedure ends.
+
+
+== Return function [!function, !endfunction]
+
+A return function does not output any text.
+It just define a function that you can call:
+* directly in variable definition or in diagram text
+* from other return functions
+* from procedures
+
+
+* Function name __should__ start with a `+$+`
+* Argument names __should__ start with a `+$+`
+
+
+@startuml
+!function $double($a)
+!return $a + $a
+!endfunction
+
+Alice -> Bob : The double of 3 is $double(3)
+@enduml
+
+
+It is possible to shorten simple function definition in one line:
+
+
+@startuml
+!function $double($a) !return $a + $a
+
+Alice -> Bob : The double of 3 is $double(3)
+Alice -> Bob : $double("This work also for strings.")
+@enduml
+
+
+As in procedure (void function), variable are local by default (they are destroyed when the function is exited). However, you can access to global variables from function. However, you can use the `+local+` keyword to create a local variable if ever a global variable exists with the same name.
+
+
+@startuml
+!function $dummy()
+!local $ijk = "local"
+!return "Alice -> Bob : " + $ijk
+!endfunction
+
+!global $ijk = "foo"
+
+Alice -> Bob : $ijk
+$dummy()
+Alice -> Bob : $ijk
+@enduml
+
+
+
+== Default argument value
+
+In both procedure and return functions, you can define default values for arguments.
+
+
+@startuml
+!function $inc($value, $step=1)
+!return $value + $step
+!endfunction
+
+Alice -> Bob : Just one more $inc(3)
+Alice -> Bob : Add two to three : $inc(3, 2)
+@enduml
+
+
+Only arguments at the end of the parameter list can have default values.
+
+
+@startuml
+!procedure defaulttest($x, $y="DefaultY", $z="DefaultZ")
+note over Alice
+ x = $x
+ y = $y
+ z = $z
+end note
+!endprocedure
+
+defaulttest(1, 2, 3)
+defaulttest(1, 2)
+defaulttest(1)
+@enduml
+
+
+
+== Unquoted procedure or function [!unquoted]
+
+By default, you have to put quotes when you call a function or a procedure.
+It is possible to use the `+unquoted+` keyword to indicate that a function or a procedure does not require quotes for its arguments.
+
+
+
+@startuml
+!unquoted function id($text1, $text2="FOO") !return $text1 + $text2
+
+alice -> bob : id(aa)
+alice -> bob : id(ab,cd)
+@enduml
+
+
+
+== Keywords arguments
+
+Like in Python, you can use keywords arguments :
+
+
+@startuml
+
+!unquoted procedure $element($alias, $description="", $label="", $technology="", $size=12, $colour="green")
+rectangle $alias as "
+<<$alias>>
+==$label==
+//[$technology]//
+
+ $description"
+!endprocedure
+
+$element(myalias, "This description is %newline()on several lines", $size=10, $technology="Java")
+@enduml
+
+
+
+== Including files or URL [!include, !include\_many, !include\_once]
+
+Use the `+!include+` directive to include file in your diagram. Using URL, you can also include file from Internet/Intranet. Protected Internet resources can also be accessed, this is described in link::url-authentication[URL authentication].
+
+Imagine you have the very same class that appears in many
+diagrams. Instead of duplicating the description of this class, you can
+define a file that contains the description.
+
+
+@startuml
+
+interface List
+List : int size()
+List : void clear()
+List <|.. ArrayList
+@enduml
+
+
+**File List.iuml**
+----
+interface List
+List : int size()
+List : void clear()
+----
+
+The file `+List.iuml+` can be included in many diagrams, and
+any modification in this file will change all diagrams that include it.
+
+You can also put several `+@startuml/@enduml+` text block in an included file and then specify which block
+you want to include adding `+!0+` where `+0+` is the block number. The `+!0+` notation denotes the first diagram.
+
+For example, if you use `+!include foo.txt!1+`, the second `+@startuml/@enduml+` block
+within `+foo.txt+` will be included.
+
+You can also put an id to some `+@startuml/@enduml+` text block in an included file using
+`+@startuml(id=MY_OWN_ID)+` syntax and then include the block adding `+!MY_OWN_ID+` when including the file,
+so using something like `+!include foo.txt!MY_OWN_ID+`.
+
+By default, a file can only be included once. You can use `+!include_many+` instead of `+!include+` if you want to include some file several times. Note that there is also a `+!include_once+` directive that raises an error if a file is included several times.
+
+
+== Including Subpart [!startsub, !endsub, !includesub]
+
+You can also use `+!startsub NAME+` and `+!endsub+` to indicate sections of text to include from other files using `+!includesub+`. For example:
+
+**file1.puml:**
+----
+@startuml
+
+A -> A : stuff1
+!startsub BASIC
+B -> B : stuff2
+!endsub
+C -> C : stuff3
+!startsub BASIC
+D -> D : stuff4
+!endsub
+@enduml
+----
+
+file1.puml would be rendered exactly as if it were:
+----
+@startuml
+
+A -> A : stuff1
+B -> B : stuff2
+C -> C : stuff3
+D -> D : stuff4
+@enduml
+----
+
+
+However, this would also allow you to have another file2.puml like this:
+
+**file2.puml**
+----
+@startuml
+
+title this contains only B and D
+!includesub file1.puml!BASIC
+@enduml
+----
+
+This file would be rendered exactly as if:
+
+----
+@startuml
+
+title this contains only B and D
+B -> B : stuff2
+D -> D : stuff4
+@enduml
+----
+
+
+== Builtin functions [%]
+
+Some functions are defined by default. Their name starts by `+%+`
+
+|===
+| Name | Description | Example | Return
+
+| `+%chr+`
+| Return a character from a give Unicode value
+| `+%chr(65)+`
+| `+A+`
+
+| `+%darken+`
+| Return a darken color of a given color with some ratio
+| `+%darken("red", 20)+`
+| `+#CC0000+`
+
+| `+%date+`
+| Retrieve current date. You can provide an optional https://docs.oracle.com/javase/7/docs/api/java/text/SimpleDateFormat.html[format for the date]
+| `+%date("yyyy.MM.dd' at 'HH:mm")+`
+| current date
+
+| `+%dec2hex+`
+| Return the hexadecimal string (String) of a decimal value (Int)
+| `+%dec2hex(12)+`
+| `+c+`
+
+| `+%dirpath+`
+| Retrieve current dirpath
+| `+%dirpath()+`
+| current path
+
+| `+%feature+`
+| Check if some feature is available in the current PlantUML running version
+| `+%feature("theme")+`
+| `+true+`
+
+| `+%false+`
+| Return always `+false+`
+| `+%false()+`
+| `+false+`
+
+| `+%file_exists+`
+| Check if a file exists on the local filesystem
+| `+%file_exists("c:/foo/dummy.txt")+`
+| `+true+` if the file exists
+
+| `+%filename+`
+| Retrieve current filename
+| `+%filename()+`
+| current filename
+
+| `+%function_exists+`
+| Check if a function exists
+| `+%function_exists("$some_function")+`
+| `+true+` if the function has been defined
+
+| `+%get_variable_value+`
+| Retrieve some variable value
+| `+%get_variable_value("$my_variable")+`
+| the value of the variable
+
+| `+%getenv+`
+| Retrieve environment variable value
+| `+%getenv("OS")+`
+| the value of `+OS+` variable
+
+| `+%hex2dec+`
+| Return the decimal value (Int) of a hexadecimal string (String)
+| `+%hex2dec("d")+` or `+%hex2dec(d)+`
+| `+13+`
+
+| `+%hsl_color+`
+| Return the RGBa color from a HSL color `+%hsl_color(h, s, l)+` or `+%hsl_color(h, s, l, a)+`
+| `+%hsl_color(120, 100, 50)+`
+| `+#00FF00+`
+
+| `+%intval+`
+| Convert a String to Int
+| `+%intval("42")+`
+| 42
+
+| `+%is_dark+`
+| Check if a color is a dark one
+| `+%is_dark("#000000")+`
+| `+true+`
+
+| `+%is_light+`
+| Check if a color is a light one
+| `+%is_light("#000000")+`
+| `+false+`
+
+| `+%lighten+`
+| Return a lighten color of a given color with some ratio
+| `+%lighten("red", 20)+`
+| `+#CC3333+`
+
+| `+%load_json+`
+| https://github.com/plantuml/plantuml/pull/755[Load JSON data from local file or external URL]
+| `+%load_json("http://localhost:7778/management/health")+`
+| JSON data
+
+| `+%lower+`
+| Return a lowercase string
+| `+%lower("Hello")+`
+| `+hello+` in that example
+
+| `+%newline+`
+| Return a newline
+| `+%newline()+`
+| a newline
+
+| `+%not+`
+| Return the logical negation of an expression
+| `+%not(2+2==4)+`
+| `+false+` in that example
+
+| `+%lighten+`
+| Return a lighten color of a given color with some ratio
+| `+%lighten("red", 20)+`
+| `+#CC3333+`
+
+| `+%reverse_color+`
+| Reverse a color using RGB
+| `+%reverse_color("#FF7700")+`
+| `+#0088FF+`
+
+| `+%reverse_hsluv_color+`
+| Reverse a color https://www.hsluv.org/[using HSLuv]
+| `+%reverse_hsluv_color("#FF7700")+`
+| `+#602800+`
+
+| `+%set_variable_value+`
+| Set a global variable
+| `+%set_variable_value("$my_variable", "some_value")+`
+| an empty string
+
+| `+%size+`
+| Return the size of any string or JSON structure
+| `+%size("foo")+`
+| `+3+` in the example
+
+| `+%string+`
+| Convert an expression to String
+| `+%string(1 + 2)+`
+| `+3+` in the example
+
+| `+%strlen+`
+| Calculate the length of a String
+| `+%strlen("foo")+`
+| `+3+` in the example
+
+| `+%strpos+`
+| Search a substring in a string
+| `+%strpos("abcdef", "ef")+`
+| 4 (position of `+ef+`)
+
+| `+%substr+`
+| Extract a substring. Takes 2 or 3 arguments
+| `+%substr("abcdef", 3, 2)+`
+| `+"de"+` in the example
+
+| `+%true+`
+| Return always `+true+`
+| `+%true()+`
+| `+true+`
+
+| `+%upper+`
+| Return an uppercase string
+| `+%upper("Hello")+`
+| `+HELLO+` in that example
+
+| `+%variable_exists+`
+| Check if a variable exists
+| `+%variable_exists("$my_variable")+`
+| `+true+` if the variable has been defined exists
+
+| `+%version+`
+| Return PlantUML current version
+| `+%version()+`
+| `+1.2020.8+` for example
+
+|===
+
+
+== Logging [!log]
+
+You can use `+!log+` to add some log output when generating the diagram. This has no impact at all on the diagram itself. However, those logs are printed in the command line's output stream. This could be useful for debug purpose.
+
+
+@startuml
+!function bold($text)
+!$result = ""+ $text +""
+!log Calling bold function with $text. The result is $result
+!return $result
+!endfunction
+
+Alice -> Bob : This is bold("bold")
+Alice -> Bob : This is bold("a second call")
+@enduml
+
+
+
+== Memory dump [!dump\_memory]
+
+You can use `+!dump_memory+` to dump the full content of the memory when generating the diagram. An optional string can be put after `+!dump_memory+`. This has no impact at all on the diagram itself. This could be useful for debug purpose.
+
+
+@startuml
+!function $inc($string)
+!$val = %intval($string)
+!log value is $val
+!dump_memory
+!return $val+1
+!endfunction
+
+Alice -> Bob : 4 $inc("3")
+!unused = "foo"
+!dump_memory EOF
+@enduml
+
+
+
+== Assertion [!assert]
+
+You can put assertions in your diagram.
+
+
+
+@startuml
+Alice -> Bob : Hello
+!assert %strpos("abcdef", "cd")==3 : "This always fails"
+@enduml
+
+
+
+== Building custom library [!import, !include]
+
+It's possible to package a set of included files into a single .zip or .jar archive.
+This single zip/jar can then be imported into your diagram using `+!import+` directive.
+
+Once the library has been imported, you can `+!include+` file from this single zip/jar.
+
+**Example:**
+----
+@startuml
+
+!import /path/to/customLibrary.zip
+' This just adds "customLibrary.zip" in the search path
+
+!include myFolder/myFile.iuml
+' Assuming that myFolder/myFile.iuml is located somewhere
+' either inside "customLibrary.zip" or on the local filesystem
+
+...
+----
+
+
+== Search path
+
+You can specify the java property `+plantuml.include.path+` in the command line.
+
+For example:
+
+----
+java -Dplantuml.include.path="c:/mydir" -jar plantuml.jar atest1.txt
+----
+
+
+Note the this -D option has to put before the -jar option. -D options
+after the -jar option will be used to define constants within plantuml preprocessor.
+
+
+
+== Argument concatenation [##]
+
+
+It is possible to append text to a macro argument using the `+##+` syntax.
+
+
+@startuml
+!unquoted procedure COMP_TEXTGENCOMP(name)
+[name] << Comp >>
+interface Ifc << IfcType >> AS name##Ifc
+name##Ifc - [name]
+!endprocedure
+COMP_TEXTGENCOMP(dummy)
+@enduml
+
+
+
+== Dynamic invocation [`+%invoke_procedure()+`, `+%call_user_func()+`]
+
+You can dynamically invoke a procedure using the special `+%invoke_procedure()+` procedure.
+This procedure takes as first argument the name of the actual procedure to be called. The optional following arguments are copied to the called procedure.
+
+For example, you can have:
+
+
+@startuml
+!procedure $go()
+ Bob -> Alice : hello
+!endprocedure
+
+!$wrapper = "$go"
+
+%invoke_procedure($wrapper)
+@enduml
+
+
+
+@startuml
+!procedure $go($txt)
+ Bob -> Alice : $txt
+!endprocedure
+
+%invoke_procedure("$go", "hello from Bob...")
+@enduml
+
+
+
+For return functions, you can use the corresponding special function `+%call_user_func()+` :
+
+
+@startuml
+!function bold($text)
+!return ""+ $text +""
+!endfunction
+
+Alice -> Bob : %call_user_func("bold", "Hello") there
+@enduml
+
+
+
+== Evaluation of addition depending of data types [+]
+
+Evaluation of `+$a + $b+` depending of type of `+$a+` or `+$b+`
+
+@startuml
+title
+<#LightBlue>|= |= $a |= $b |= string($a + $b)|
+<#LightGray>| type | str | str | str (concatenation) |
+| example |= "a" |= "b" |= %string("a" + "b") |
+<#LightGray>| type | str | int | str (concatenation) |
+| ex.|= "a" |= 2 |= %string("a" + 2) |
+<#LightGray>| type | str | int | str (concatenation) |
+| ex.|= 1 |= "b" |= %string(1 + "b") |
+<#LightGray>| type | bool | str | str (concatenation) |
+| ex.|= true() |= "b" |= %string(%true() + "b") |
+<#LightGray>| type | str | bool | str (concatenation) |
+| ex.|= "a" |= false() |= %string("a" + %false()) |
+<#LightGray>| type | int | int | int (addition of int) |
+| ex.|= 1 |= 2 |= %string(1 + 2) |
+<#LightGray>| type | bool | int | int (addition) |
+| ex.|= true() |= 2 |= %string(%true() + 2) |
+<#LightGray>| type | int | bool | int (addition) |
+| ex.|= 1 |= false() |= %string(1 + %false()) |
+<#LightGray>| type | int | int | int (addition) |
+| ex.|= 1 |= intval("2") |= %string(1 + %intval("2")) |
+end title
+@enduml
+
+
+
+== Preprocessing JSON
+
+You can extend the functionality of the current Preprocessing with link::preprocessing-json[JSON Preprocessing] features:
+
+* JSON Variable definition
+* Access to JSON data
+* Loop over JSON array
+
+__(See more details on link::preprocessing-json[Preprocessing-JSON page])__
+
+
+== Including theme [!theme]
+
+Use the `+!theme+` directive to change link::theme[the default theme of your diagram].
+
+
+@startuml
+!theme spacelab
+class Example {
+ Theme spacelab
+}
+@enduml
+
+
+You will find more information link::theme[on the dedicated page].
+
+
+== Migration notes
+
+The current preprocessor is an update from some legacy preprocessor.
+
+Even if some legacy features are still supported with the actual preprocessor, you should not use them any more (they might be removed in some long term future).
+
+* You should not use `+!define+` and `+!definelong+` anymore. Use `+!function+`, `+!procedure+` or variable definition instead.
+** `+!define+` should be replaced by return `+!function+`
+** `+!definelong+` should be replaced by `+!procedure+`.
+* `+!include+` now allows multiple inclusions : you don't have to use `+!include_many+` anymore
+* `+!include+` now accepts a URL, so you don't need `+!includeurl+`
+* Some features (like `+%date%+`) have been replaced by builtin functions (for example `+%date()+`)
+* When calling a legacy `+!definelong+` macro with no arguments, you do have to use parenthesis. You have to use `+my_own_definelong()+` because `+my_own_definelong+` without parenthesis is not recognized by the new preprocessor.
+
+
+
+Please contact us if you have any issues.
+
+
+== `+%Splitstr+` builtin function
+
+
+@startmindmap
+!$list = %splitstr("abc~def~ghi", "~")
+
+* root
+!foreach $item in $list
+ ** $item
+!endfor
+@endmindmap
+
+
+__[Ref. https://forum.plantuml.net/15374/delimited-string-split-into-an-array[QA-15374]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/problem-diagram.adoc b/plantuml-docs/docs_from_alphadoc/problem-diagram.adoc
new file mode 100644
index 00000000..9c362436
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/problem-diagram.adoc
@@ -0,0 +1,237 @@
+== Problem diagram
+
+Extension of PlantUML __(See https://github.com/plantuml/plantuml/pull/120[Pull\_Request-120])__, initiate by https://github.com/yijunyu[Yijun Yu], to draw Problem Diagrams or diagram for https://en.wikipedia.org/wiki/Problem_frames_approach[problem analysis or problem frames approach], a rather useful requirements modeling diagram based on Michael Jackson's Problem Frames.
+
+
+== Example R1
+
+
+@startuml
+left to right direction
+title Problem Diagram R1
+requirement "Collect and display drone flight paths on a map" as R1
+domain "Google Map" as D1 <>
+domain "Onboard LiveBox" as D2 <>
+domain "Drone" as D3 <>
+domain "Path" as D4 <>
+domain "Map" as D5 <>
+domain "Monitor" as M <>
+M -- D1: a1
+M -- D2: b1
+D1 -- D4: d1
+D4 <-[dashed]- R1: d
+D2 -- D3: e1
+D3 -[dashed]- R1: e
+D2 -- D4: d2
+D5 <-[dashed]- R1: c
+D1 -- D5: c1
+@enduml
+
+
+__[from https://github.com/plantuml/plantuml/pull/120[Pull\_Request-120]]__
+
+
+== Example R1-1
+
+
+@startuml
+left to right direction
+title Problem Diagram R1-1
+requirement "Collect drone flight paths" as R
+domain "Drone collocated \n with Smartphone" as D31 <> {
+ domain "Drone" as D3 <>
+ domain "Smartphone" as D321 <> {
+ domain "LiveBox App" as D32 <>
+ }
+}
+'D3 -- D321: f
+'note bottom on link
+' assume that the smartphone and the drone are always collocated
+'end note
+domain "Path" as D4 <>
+domain "Onboard LiveBox" as M <>
+D4 <-- R: d
+note bottom on link
+ the flight path consists of
+ zero to many geolocations
+end note
+D3 -- R: e
+note bottom on link
+ the drone's geolocation includes
+ latitude, longitude, altitude
+ and the timestamp
+end note
+M -- D4: d2
+note bottom on link
+ <(geolocation, timestamp)>
+ by the order of timestamps
+end note
+M -- D32: e1
+note bottom on link
+ (geolocation, timestamp) from
+ the smart phone as a payload
+ of the drone
+end note
+@enduml
+
+
+Sequence:
+
+@startuml
+'skinparam backgroundColor lightblue
+hide footbox
+participant "Onboard LiveBox" as LB
+participant "Drone" as D
+participant "Path" as P
+D -> LB: d2: takeoff(initial location)
+LB -> P: e1: save(initial location)
+loop
+ D -> LB: d2: send(location)
+ LB -> P: e1: save(location)
+end
+D -> LB: d2: landing(final location)
+LB -> P: e1: save(final location)
+@enduml
+
+
+
+== Example R1-2
+
+
+@startuml
+left to right direction
+title <&caret-right> Problem Diagram R1-2<&caret-left>
+
+requirement "Display paths on a map" as R1
+domain "Path" as D4 <>
+domain "Map" as D5 <>
+domain "Google Map" as M <>
+M -- D4: d1
+D4 -[dashed]- R1: d
+D5 <-[dashed]- R1: c
+M -- D5: c1
+@enduml
+
+
+
+== Example LiveBox
+
+
+@startuml
+hide footbox
+
+title LiveBox Scenario
+
+participant Nesta
+participant HospitalFrom
+actor Pilot
+participant Drone
+participant Controller
+participant HospitalTo
+participant NHS
+
+HospitalTo <- NHS: request delivery
+Nesta <- HospitalTo: request delivery(HospitalFrom, HospitalTo, Type, Size, Amount)
+Nesta -> Drone: select
+Nesta -> Pilot: select
+alt selected
+Nesta -> HospitalFrom: inform
+HospitalFrom -> Pilot: send payload
+Pilot -> Drone: load delivery
+Pilot -> Controller: send
+Drone <- Controller : take off
+loop
+ Pilot -> Drone: maneuver
+ Drone -> Controller: report
+ Pilot <- Controller: display
+ Nesta <- Controller: notify periodically
+end
+Pilot -> Controller: landing
+Drone <- Controller: landing
+Drone -> Controller: landed
+Pilot <- Controller: landed
+Nesta <- Controller: landed
+Nesta -> HospitalTo: inform
+Drone <- HospitalTo: unload
+Drone <- HospitalTo: turn off
+Nesta -> HospitalTo: package received
+Nesta -> HospitalFrom: inform successful
+Nesta -> Pilot: inform successful
+end
+
+@enduml
+
+
+
+== Example of Composition of two designed domains
+
+
+@startuml
+left to right direction
+title Composition of two designed domains
+left to right direction
+domain "Monitor" as M <> {
+ domain "Google Map" as D1 <>
+ domain "Onboard LiveBox" as D2 <>
+}
+domain "Map" as D3 <>
+domain "Path" as D4 <>
+domain "Drone" as D5 <>
+requirement "Requirements" as R {
+ requirement "Display flight paths on a map" as R1
+ requirement "Collect flight paths from a drone" as R2
+}
+R1 -[dashed]left-> D3: c
+D4 -[dashed]-> R1: d
+R2 -[dashed]left-> D4: d
+D5 -[dashed]-> R2: e
+D1 --> D3: c1
+D1 --> D4: d1
+D2 --> D4: d2
+D2 --> D5: e1
+@enduml
+
+
+
+== Example of Problem
+
+
+@startuml
+left to right direction
+domain "Monitor" as M <>
+domain "Display" as D1 <>
+domain "Collect" as D2 <>
+domain "Pilot" as P <>
+domain "Table" as TT <>
+domain "XYZ" as XYZ <<(C)>>
+requirement "R1" as R1
+M -- D1: a
+D1 -[dashed]- R1: a
+D2 <-[dashed]- R1: b
+TT -[dashed]- R1: c
+P -[dashed]- R1: d
+M -- TT: c
+M -- D2: b
+M -- P: d
+@enduml
+
+
+
+== Minimal example
+
+
+@startuml
+title Minimal example
+domain "Biddable" as B <>
+domain "Causal" as C <>
+domain "Designed" as D <>
+domain "Lexical" as L <>
+domain "Machine" as M <>
+domain "Problem" as s <
>
+requirement "Requirement" as R
+@enduml
+
+
+__[Ref. https://github.com/plantuml/plantuml/pull/120[GH-120]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/professional.adoc b/plantuml-docs/docs_from_alphadoc/professional.adoc
new file mode 100644
index 00000000..89ae5fbb
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/professional.adoc
@@ -0,0 +1,39 @@
+== Professional usage
+
+**PlantUML is free and open source and will always be.**
+
+However hosting the service and enhancing the product takes time and money.
+
+So PlantUML can occasionally display sponsored or advertising messages.
+Those messages are usually generated on welcome or error images and never on fonctional diagrams.
+
+Here is an example of such display:
+
+image::demo-ad.png[]
+
+If this is unacceptable for you and if you are using PlantUML in a professional environment,
+there is a way for you to disable these sponsored or advertising messages.
+
+You may indeed ask for a license key by running the following special diagram:
+----
+@startuml
+keygen
+@enduml
+----
+
+You then have to send us the result (which is a footprint of your server or machine).
+We will send you back a software key that you will install on your machine (by running another simple and special command).
+
+Once the software key is installed, we will be switched into the Professional Edition that do not print any
+sponsored or advertising messages.
+You will be able to double check this by running:
+
+----
+@startuml
+license
+@enduml
+----
+
+Thanks for your support!
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/pte.adoc b/plantuml-docs/docs_from_alphadoc/pte.adoc
new file mode 100644
index 00000000..354051ba
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/pte.adoc
@@ -0,0 +1,4 @@
+== PlantUML Text Encoding
+DELETE: duplicates link::text-encoding[text-encoding]
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/regex.adoc b/plantuml-docs/docs_from_alphadoc/regex.adoc
new file mode 100644
index 00000000..858113fa
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/regex.adoc
@@ -0,0 +1,29 @@
+== Display Regex Data
+
+'''
+๐ง - __Under construction__
+
+๐ functionality still in testing stage...
+These new features are still under construction ๐ง
+
+๐ง - __Under construction__
+'''
+
+You can use PlantUML to visualize your https://en.wikipedia.org/wiki/Regular_expression[Regular expression (Regex)].
+
+To activate this feature, the diagram must:
+* begin with `+@startregex+` keyword
+* end with `+@endregex+` keyword.
+
+
+@startregex
+repetitionZeroOrMore: a*
+@endregex
+
+
+Ref.:
+* https://github.com/plantuml/plantuml/tree/master/src/net/sourceforge/plantuml/regex[Regex on GH@plantuml/plantuml]
+* https://forum.plantuml.net/17112/regex-railroad-diagrams[QA-17112]
+* https://forum.plantuml.net/17357/documentation-of-hcl-and-regex[QA-17357]
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/salt.adoc b/plantuml-docs/docs_from_alphadoc/salt.adoc
new file mode 100644
index 00000000..5a76aa05
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/salt.adoc
@@ -0,0 +1,920 @@
+== Salt (Wireframe)
+
+**Salt** is a subproject included in PlantUML that may help you to design graphical interface or https://en.wikipedia.org/wiki/Website_wireframe[__Website Wireframe or Page Schematic or Screen Blueprint__].
+
+The goal of this tool is to discuss about simple and sample windows.
+
+You can use either `+@startsalt+` keyword, or `+@startuml+` followed by a line with `+salt+` keyword.
+
+
+== Basic widgets
+
+A window must start and end with brackets. You can then define:
+
+* Button using `+[+` and `+]+`.
+* Radio button using `+(+` and `+)+`.
+* Checkbox using `+[+` and `+]+`.
+* User text area using `+"+`.
+* Droplist using `+^+`.
+
+
+@startsalt
+{
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+
+
+
+== Text area
+
+Here is an attempt to create a https://html.spec.whatwg.org/multipage/form-elements.html#the-textarea-element[text area]:
+
+
+@startsalt
+{+
+ This is a long
+ text in a textarea
+ .
+ " "
+}
+@endsalt
+
+
+Note:
+* the dot (`+.+`) to fill up vertical space;
+* the last line of space (`+" ย "+`) to make the area wider.
+
+__[Ref. https://forum.plantuml.net/14765/[QA-14765]]__
+
+
+Then you can add link::salt#6b6xvjbaj4gpk362kjkx[scroll bar]:
+
+@startsalt
+{SI
+ This is a long
+ text in a textarea
+ .
+ " "
+}
+@endsalt
+
+
+@startsalt
+{S-
+ This is a long
+ text in a textarea
+ .
+ " "
+}
+@endsalt
+
+
+
+== Open, close droplist
+
+You can open a droplist, by adding values enclosed by `+^+`, as:
+
+
+@startsalt
+{
+ ^This is a closed droplist^ |
+ ^This is an open droplist^^ item 1^^ item 2^ |
+ ^This is another open droplist^ item 1^ item 2^
+}
+@endsalt
+
+
+__[Ref. https://forum.plantuml.net/4184[QA-4184]]__
+
+
+== Using grid [\| and #, !, -, +]
+
+A table is automatically created when you use an opening bracket `+{+`.
+And you have to use `+|+` to separate columns.
+
+For example:
+
+
+@startsalt
+{
+ Login | "MyName "
+ Password | "**** "
+ [Cancel] | [ OK ]
+}
+@endsalt
+
+
+Just after the opening bracket, you can use a character to define if you want to draw lines or columns of the grid :
+
+|===
+| Symbol | Result
+
+| `+#+`
+| To display all vertical and horizontal lines
+
+| `+!+`
+| To display all vertical lines
+
+| `+-+`
+| To display all horizontal lines
+
+| `+++`
+| To display external lines
+
+|===
+
+
+@startsalt
+{+
+ Login | "MyName "
+ Password | "**** "
+ [Cancel] | [ OK ]
+}
+@endsalt
+
+
+
+== Group box [^]
+
+
+@startsalt
+{^"My group box"
+ Login | "MyName "
+ Password | "**** "
+ [Cancel] | [ OK ]
+}
+@endsalt
+
+
+__[Ref. http://forum.plantuml.net/5840/please-allow-to-create-groupboxes-in-salt?show=5840#q5840[QA-5840]]__
+
+
+== Using separator [.., ==, ~~, --]
+
+You can use several horizontal lines as separator.
+
+
+@startsalt
+{
+ Text1
+ ..
+ "Some field"
+ ==
+ Note on usage
+ ~~
+ Another text
+ --
+ [Ok]
+}
+@endsalt
+
+
+
+== Tree widget [T]
+
+To have a Tree, you have to start with `+{T+` and to use `+++` to denote hierarchy.
+
+
+@startsalt
+{
+{T
+ + World
+ ++ America
+ +++ Canada
+ +++ USA
+ ++++ New York
+ ++++ Boston
+ +++ Mexico
+ ++ Europe
+ +++ Italy
+ +++ Germany
+ ++++ Berlin
+ ++ Africa
+}
+}
+@endsalt
+
+
+
+== Tree table [T]
+
+You can combine trees with tables.
+
+
+
+@startsalt
+{
+{T
++Region | Population | Age
++ World | 7.13 billion | 30
+++ America | 964 million | 30
++++ Canada | 35 million | 30
++++ USA | 319 million | 30
+++++ NYC | 8 million | 30
+++++ Boston | 617 thousand | 30
++++ Mexico | 117 million | 30
+++ Europe | 601 million | 30
++++ Italy | 61 million | 30
++++ Germany | 82 million | 30
+++++ Berlin | 3 million | 30
+++ Africa | 1 billion | 30
+}
+}
+@endsalt
+
+
+And add lines.
+
+
+@startsalt
+{
+..
+== with T!
+{T!
++Region | Population | Age
++ World | 7.13 billion | 30
+++ America | 964 million | 30
+}
+..
+== with T-
+{T-
++Region | Population | Age
++ World | 7.13 billion | 30
+++ America | 964 million | 30
+}
+..
+== with T+
+{T+
++Region | Population | Age
++ World | 7.13 billion | 30
+++ America | 964 million | 30
+}
+..
+== with T#
+{T#
++Region | Population | Age
++ World | 7.13 billion | 30
+++ America | 964 million | 30
+}
+..
+}
+@endsalt
+
+
+
+__[Ref. https://forum.plantuml.net/1265/feature-request-tree-tables[QA-1265]]__
+
+
+== Enclosing brackets [{, }]
+
+You can define subelements by opening a new opening bracket.
+
+
+@startsalt
+{
+Name | " "
+Modifiers: | { (X) public | () default | () private | () protected
+ [] abstract | [] final | [] static }
+Superclass: | { "java.lang.Object " | [Browse...] }
+}
+@endsalt
+
+
+
+== Adding tabs [/]
+
+You can add tabs using `+{/+` notation. Note that you can use HTML code to have bold text.
+
+
+@startsalt
+{+
+{/ General | Fullscreen | Behavior | Saving }
+{
+{ Open image in: | ^Smart Mode^ }
+[X] Smooth images when zoomed
+[X] Confirm image deletion
+[ ] Show hidden images
+}
+[Close]
+}
+@endsalt
+
+
+Tab could also be vertically oriented:
+
+
+@startsalt
+{+
+{/ General
+Fullscreen
+Behavior
+Saving } |
+{
+{ Open image in: | ^Smart Mode^ }
+[X] Smooth images when zoomed
+[X] Confirm image deletion
+[ ] Show hidden images
+[Close]
+}
+}
+@endsalt
+
+
+
+== Using menu [\*]
+
+You can add a menu by using `+{*+` notation.
+
+
+@startsalt
+{+
+{* File | Edit | Source | Refactor }
+{/ General | Fullscreen | Behavior | Saving }
+{
+{ Open image in: | ^Smart Mode^ }
+[X] Smooth images when zoomed
+[X] Confirm image deletion
+[ ] Show hidden images
+}
+[Close]
+}
+@endsalt
+
+
+It is also possible to open a menu:
+
+
+@startsalt
+{+
+{* File | Edit | Source | Refactor
+ Refactor | New | Open File | - | Close | Close All }
+{/ General | Fullscreen | Behavior | Saving }
+{
+{ Open image in: | ^Smart Mode^ }
+[X] Smooth images when zoomed
+[X] Confirm image deletion
+[ ] Show hidden images
+}
+[Close]
+}
+@endsalt
+
+
+Like it is possible to open a droplist:
+
+@startsalt
+{+
+{* File | Edit | Source | Refactor }
+{/ General | Fullscreen | Behavior | Saving }
+{
+{ Open image in: | ^Smart Mode^^Normal Mode^ }
+[X] Smooth images when zoomed
+[X] Confirm image deletion
+[ ] Show hidden images
+}
+[Close]
+}
+@endsalt
+
+__[Ref. https://forum.plantuml.net/4184[QA-4184]]__
+
+
+== Advanced table
+
+You can use two special notations for table :
+* `+*+` to indicate that a cell with span with left
+* `+.+` to denotate an empty cell
+
+
+@startsalt
+{#
+. | Column 2 | Column 3
+Row header 1 | value 1 | value 2
+Row header 2 | A long cell | *
+}
+@endsalt
+
+
+
+== Scroll Bars [S, SI, S-]
+
+You can use `+{S+` notation for https://en.wikipedia.org/wiki/Scrollbar[scroll bar] like in following examples:
+
+* `+{S+`: for horizontal and vertical scrollbars
+
+@startsalt
+{S
+Message
+.
+.
+.
+.
+}
+@endsalt
+
+
+* `+{SI+` : for vertical scrollbar only
+
+@startsalt
+{SI
+Message
+.
+.
+.
+.
+}
+@endsalt
+
+
+* `+{S-+` : for horizontal scrollbar only
+
+@startsalt
+{S-
+Message
+.
+.
+.
+.
+}
+@endsalt
+
+
+
+== Colors
+
+It is possible to change text link::color[color] of widget.
+
+
+@startsalt
+{
+ Just plain text
+ [This is my default button]
+ [This is my green button]
+ [This is my disabled button]
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+ ^This is a disabled droplist^
+ ^This is a red droplist^
+}
+@endsalt
+
+
+__[Ref. https://forum.plantuml.net/12177/change-color-of-salt-button-to-represent-disabled-status[QA-12177]]__
+
+
+== Creole on Salt
+
+You can use link::creole[Creole or HTML Creole] on salt:
+
+
+@startsalt
+{{^==Creole
+ This is **bold**
+ This is //italics//
+ This is ""monospaced""
+ This is --stricken-out--
+ This is __underlined__
+ This is ~~wave-underlined~~
+ --test Unicode and icons--
+ This is long
+ This is a <&code> icon
+ Use image :
+}|
+{^HTML Creole
+ This is bold
+ This is italics
+ This is monospaced
+ This is stroked
+ This is underlined
+ This is waved
+ This is stroked
+ This is underlined
+ This is waved
+ -- other examples --
+ This is Blue
+ This is Orange background
+ This is big
+}|
+{^Creole line
+You can have horizontal line
+----
+Or double line
+====
+Or strong line
+____
+Or dotted line
+..My title..
+Or dotted title
+//and title... //
+==Title==
+Or double-line title
+--Another title--
+Or single-line title
+Enjoy!
+}|
+{^Creole list item
+**test list 1**
+* Bullet list
+* Second item
+** Sub item
+*** Sub sub item
+* Third item
+----
+**test list 2**
+# Numbered list
+# Second item
+## Sub item
+## Another sub item
+# Third item
+}|
+{^Mix on salt
+ ==Just plain text
+ [This is my default button]
+ [This is my green button]
+ [ ---This is my disabled button-- ]
+ [] Unchecked box
+ [X] Checked box
+ "//Enter text here// "
+ ^This is a droplist^
+ ^This is a disabled droplist^
+ ^This is a red droplist^
+}}
+@endsalt
+
+
+
+== Pseudo sprite [<<, >>]
+
+Using `+<<+` and `+>>+` you can define a pseudo-sprite or sprite-like drawing and reusing it latter.
+
+
+@startsalt
+ {
+ [X] checkbox|[] checkbox
+ () radio | (X) radio
+ This is a text|[This is my button]|This is another text
+ "A field"|"Another long Field"|[A button]
+ <>|other folder|<>
+^Droplist^
+}
+@endsalt
+
+
+__[Ref. https://forum.plantuml.net/5849/support-for-sprites-salt?show=5851#a5851[QA-5849]]__
+
+
+== OpenIconic
+
+https://useiconic.com/open/[OpenIconic] is a very nice open source icon set. Those icons have been integrated into the link::creole[creole parser], so you can use them out-of-the-box.
+You can use the following syntax: `+<&ICON_NAME>+`.
+
+
+@startsalt
+{
+ Login<&person> | "MyName "
+ Password<&key> | "**** "
+ [Cancel <&circle-x>] | [OK <&account-login>]
+}
+@endsalt
+
+
+The complete list is available on OpenIconic Website, or you can use the following special diagram:
+
+
+
+@startuml
+listopeniconic
+@enduml
+
+
+
+== Add title, header, footer, caption or legend
+
+
+@startsalt
+title My title
+header some header
+footer some footer
+caption This is caption
+legend
+The legend
+end legend
+
+{+
+ Login | "MyName "
+ Password | "**** "
+ [Cancel] | [ OK ]
+}
+
+@endsalt
+
+
+__(See also: link::commons[Common commands])__
+
+
+== Zoom, DPI
+
+=== Whitout zoom (by default)
+
+@startsalt
+{
+ <&person> Login | "MyName "
+ <&key> Password | "**** "
+ [<&circle-x> Cancel ] | [ <&account-login> OK ]
+}
+@endsalt
+
+
+=== Scale
+
+You can use the `+scale+` command to zoom the generated image.
+
+You can use either a number or a fraction to define the scale factor. You can also specify either width or height (in pixel). And you can also give both width and height: the image is scaled to fit inside the specified dimension.
+
+@startsalt
+scale 2
+{
+ <&person> Login | "MyName "
+ <&key> Password | "**** "
+ [<&circle-x> Cancel ] | [ <&account-login> OK ]
+}
+@endsalt
+
+
+__(See also: link::commons#zw5yrgax40mpk362kjbn[Zoom on Common commands])__
+
+=== DPI
+You can also use the `+skinparam dpi+`command to zoom the generated image.
+
+@startsalt
+skinparam dpi 200
+{
+ <&person> Login | "MyName "
+ <&key> Password | "**** "
+ [<&circle-x> Cancel ] | [ <&account-login> OK ]
+}
+@endsalt
+
+
+
+== Include Salt "on activity diagram"
+
+You can http://forum.plantuml.net/2427/salt-with-minimum-flowchat-capabilities?show=2427#q2427[read the following explanation].
+
+
+
+@startuml
+(*) --> "
+{{
+salt
+{+
+an example
+choose one option
+()one
+()two
+[ok]
+}
+}}
+" as choose
+
+choose -right-> "
+{{
+salt
+{+
+please wait
+operation in progress
+<&clock>
+[cancel]
+}
+}}
+" as wait
+wait -right-> "
+{{
+salt
+{+
+success
+congratulations!
+[ok]
+}
+}}
+" as success
+
+wait -down-> "
+{{
+salt
+{+
+error
+failed, sorry
+[ok]
+}
+}}
+"
+@enduml
+
+
+It can also be combined with link::preprocessing#macro_definition[define macro].
+
+
+@startuml
+!unquoted procedure SALT($x)
+"{{
+salt
+%invoke_procedure("_"+$x)
+}}" as $x
+!endprocedure
+
+!procedure _choose()
+{+
+an example
+choose one option
+()one
+()two
+[ok]
+}
+!endprocedure
+
+!procedure _wait()
+{+
+please wait
+operation in progress
+<&clock>
+[cancel]
+}
+!endprocedure
+
+!procedure _success()
+{+
+success
+congratulations!
+[ok]
+}
+!endprocedure
+
+!procedure _error()
+{+
+error
+failed, sorry
+[ok]
+}
+!endprocedure
+
+(*) --> SALT(choose)
+-right-> SALT(wait)
+wait -right-> SALT(success)
+wait -down-> SALT(error)
+@enduml
+
+
+
+== Include salt "on while condition of activity diagram"
+
+You can include `+salt+` on while condition of activity diagram.
+
+
+@startuml
+start
+while (\n{{\nsalt\n{+\nPassword | "**** "\n[Cancel] | [ OK ]}\n}}\n) is (Incorrect)
+ :log attempt;
+ :attempt_count++;
+ if (attempt_count > 4) then (yes)
+ :increase delay timer;
+ :wait for timer to expire;
+ else (no)
+ endif
+endwhile (correct)
+:log request;
+:disable service;
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/8547/mixing-wireframes-and-activity-diagrames?show=12221#a12221[QA-8547]]__
+
+
+== Include salt "on repeat while condition of activity diagram"
+
+You can include `+salt+` on 'repeat while' condition of activity diagram.
+
+
+@startuml
+start
+repeat :read data;
+ :generate diagrams;
+repeat while (\n{{\nsalt\n{^"Next step"\n Do you want to continue? \n[Yes]|[No]\n}\n}}\n)
+stop
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/14287/salt-in-activity-beta-diagrams[QA-14287]]__
+
+
+== Skinparam
+
+You can use **[only]** some link::skinparam[skinparam] command to change the skin of the drawing.
+
+Some example:
+
+
+@startsalt
+skinparam Backgroundcolor palegreen
+{+
+ Login | "MyName "
+ Password | "**** "
+ [Cancel] | [ OK ]
+}
+@endsalt
+
+
+
+@startsalt
+skinparam handwritten true
+{+
+ Login | "MyName "
+ Password | "**** "
+ [Cancel] | [ OK ]
+}
+@endsalt
+
+
+[[#FFD700#FIXME]] ๐ฉ
+FYI, some other skinparam does not work with salt, as:
+
+
+@startsalt
+skinparam defaultFontName monospaced
+{+
+ Login | "MyName "
+ Password | "**** "
+ [Cancel] | [ OK ]
+}
+@endsalt
+
+
+
+== Style
+
+You can use **[only]** some link::style-evolution[style] command to change the skin of the drawing.
+
+Some example:
+
+
+@startsalt
+
+{+
+ Login | "MyName "
+ Password | "**** "
+ [Cancel] | [ OK ]
+}
+@endsalt
+
+
+
+[[#FFD700#FIXME]] ๐ฉ
+FYI, some other style does not work with salt, as:
+
+
+@startsalt
+
+{+
+ Login | "MyName "
+ Password | "**** "
+ [Cancel] | [ OK ]
+}
+@endsalt
+
+
+__[Ref. https://forum.plantuml.net/13460/there-skinparam-change-font-used-salt-like-other-diagram-types?show=13461#a13461[QA-13460]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/security.adoc b/plantuml-docs/docs_from_alphadoc/security.adoc
new file mode 100644
index 00000000..3128f681
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/security.adoc
@@ -0,0 +1,121 @@
+== Deploy PlantUML safely
+
+Our collaboration with https://sysdream.com/[Sysdream] leads us to introduce the notion of **security profile** within PlantUML.
+
+Starting with __version 1.2020.11__, you have to choose which **security profile** use when running PlantUML. The default one is `+LEGACY+`. It emulates the behavior of older PlantUML versions. This means you can safely upgrade to __1.2020.11__. However, you should then pick up an appropriate mode for your usage.
+
+This is needed because PlantUML can be used in many different configurations which require different security setting.
+
+If you are using a version older than __1.2020.11__ and if your system is accessible from Internet, **you should probably upgrade because older versions of PlantUML may expose a little more than you would expect**. Even the new `+LEGACY+` default mode is now more secure than older PlantUML behavior.
+
+
+== Choose your Security Profile
+
+The Security Profile can be set two different ways:
+
+* Setting the OS environnement variable `+PLANTUML_SECURITY_PROFILE+`
+* Setting the Java environnement variable `+PLANTUML_SECURITY_PROFILE+`
+
+In practice, you can do:
+
+----
+set PLANTUML_SECURITY_PROFILE=INTERNET
+----
+
+or
+
+----
+setenv PLANTUML_SECURITY_PROFILE INTERNET
+----
+
+Another way is an option in the command line (do not forget the `+-D+` flag):
+
+----
+java -DPLANTUML_SECURITY_PROFILE=INTERNET -jar /path/to/plantuml.jar ...
+----
+
+Or if you are using Java and PlantUML as a library:
+
+----
+System.setProperty("PLANTUML_SECURITY_PROFILE", "INTERNET");
+----
+
+
+== List of Security Profiles
+
+There are five different profiles you can choose from :
+
+==== UNSECURE
+
+When PlantUML runs in `+UNSECURE+` mode, it can access to all local files of the running instance and can access to any URL.
+
+Despite its name, this does not mean that you should not use it. If you are running locally PlantUML from some scripts for your generated documentation, this is completely safe and ok.
+
+It may become an issue if this is used from a Web Server which is accessible from Internet, because you cannot control what users are doing in their diagram text.
+
+
+==== LEGACY
+
+Right now, this mode is the default mode for PlantUML. It gives the same result as older PlantUML versions: full access to local files and full access to URL.
+This means that you can safely upgrade to version __1.2020.11__ without breaking your scripts.
+
+However, after upgrading, you should consider setting an appropriate Security Profile other than `+LEGACY+` because this mode will be removed in future releases and the default mode will be more restricted.
+
+==== INTERNET
+
+This mode has been designed for servers which are connected to Internet.
+
+When running in `+INTERNET+` mode, PlantUML cannot have access to any local files (except if you are using allowlists, see below). However, all URLs on port 80 or 443 are accessible. If you need some specific ports (like 8080 for some Intranet server), you can also use allowlists.
+
+
+==== ALLOWLIST
+
+In `+ALLOWLIST+` mode, PlantUML cannot have any access to local files or URL.
+You have to use allowlists to explicitely authorize access to local or remote ressources.
+
+==== SANDBOX
+
+In `+SANDBOX+` mode, PlantUML cannot have any access to local files or URL. Even allowlists lists are ignored.
+So this mode is completely close.
+
+The main interest of this one is __testing__: if someone succeed some access running this mode, it means we have a security hole and we will fix it.
+
+
+== Allowlists
+
+There are three different variables to define allowlists:
+
+* `+plantuml.allowlist.path+` for local files
+* `+plantuml.include.path+` for local files
+* `+plantuml.allowlist.url+` for remote ressources (URL)
+
+These variables can be set using the same way as `+PLANTUML_SECURITY_PROFILE+`.
+
+
+==== plantuml.allowlist.path
+
+This variable lists using `+;+` (Windows) or `+:+` (Linux) separator the folders users will be authorized to have access to.
+
+----
+java -DPLANTUML_SECURITY_PROFILE=INTERNET -Dplantuml.allowlist.path=/usr/common/:/usr/plantuml/ ...
+----
+
+
+==== plantuml.include.path
+
+This is very close to `+plantuml.allowlist.path+`. The only difference is that users will not have to specify full path of files for those folders: PlantUML will search files in thoses folder, even if users give only filenames without full path.
+
+----
+java -DPLANTUML_SECURITY_PROFILE=INTERNET -Dplantuml.include.path=c:/windows/plantuml/ ...
+----
+
+
+==== plantuml.allowlist.url
+
+This variable lists using `+;+` (for both Windows and Linux) separator the URLs users will be authorized to have access to.
+
+----
+java -DPLANTUML_SECURITY_PROFILE=ALLOWLIST -Dplantuml.allowlist.url=https://plantuml.com/;http://somelocalserver:8080/commons/ ...
+----
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/sequence-diagram.adoc b/plantuml-docs/docs_from_alphadoc/sequence-diagram.adoc
new file mode 100644
index 00000000..5d1af7e9
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/sequence-diagram.adoc
@@ -0,0 +1,1629 @@
+== Sequence Diagram
+
+
+== Basic examples
+The sequence `+->+` is used to draw a message between two
+participants.
+Participants do not have to be explicitly declared.
+
+To have a dotted arrow, you use `+-->+`
+
+It is also possible to use `+<-+` and `+<--+`.
+That does not change the drawing, but may improve readability.
+Note that this is only true for sequence diagrams, rules are different for the other diagrams.
+
+@startuml
+Alice -> Bob: Authentication Request
+Bob --> Alice: Authentication Response
+
+Alice -> Bob: Another authentication Request
+Alice <-- Bob: Another authentication Response
+@enduml
+
+
+
+== Declaring participant
+
+If the keyword `+participant+` is used to declare a participant, more control on that participant is possible.
+
+The order of declaration will be the (default) **order of display**.
+
+Using these other keywords to declare participants will **change the shape** of the participant representation:
+* `+actor+`
+* `+boundary+`
+* `+control+`
+* `+entity+`
+* `+database+`
+* `+collections+`
+* `+queue+`
+
+
+@startuml
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+
+Rename a participant using the `+as+` keyword.
+
+You can also change the background link::color[color] of
+actor or participant.
+
+
+@startuml
+actor Bob #red
+' The only difference between actor
+'and participant is the drawing
+participant Alice
+participant "I have a really\nlong name" as L #99FF99
+/' You can also declare:
+ participant L as "I have a really\nlong name" #99FF99
+ '/
+
+Alice->Bob: Authentication Request
+Bob->Alice: Authentication Response
+Bob->L: Log transaction
+@enduml
+
+
+You can use the `+order+` keyword to customize the display order of participants.
+
+
+@startuml
+participant Last order 30
+participant Middle order 20
+participant First order 10
+@enduml
+
+
+
+== Declaring participant on multiline
+
+You can declare participant on multi-line.
+
+
+@startuml
+participant Participant [
+ =Title
+ ----
+ ""SubTitle""
+]
+
+participant Bob
+
+Participant -> Bob
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/15232/[QA-15232]]__
+
+
+== Use non-letters in participants
+
+
+You can use quotes to define participants.
+And you can use the `+as+` keyword to give an alias to those participants.
+
+@startuml
+Alice -> "Bob()" : Hello
+"Bob()" -> "This is very\nlong" as Long
+' You can also declare:
+' "Bob()" -> Long as "This is very\nlong"
+Long --> "Bob()" : ok
+@enduml
+
+
+
+
+== Message to Self
+
+A participant can send a message to itself.
+
+It is also possible to have multi-line using `+\n+`.
+
+
+@startuml
+Alice -> Alice: This is a signal to self.\nIt also demonstrates\nmultiline \ntext
+@enduml
+
+
+
+@startuml
+Alice <- Alice: This is a signal to self.\nIt also demonstrates\nmultiline \ntext
+@enduml
+
+__[Ref. https://forum.plantuml.net/1361[QA-1361]]__
+
+
+== Text alignment
+
+Text alignment on arrows can be set to `+left+`, `+right+` or `+center+` using `+skinparam sequenceMessageAlign+`.
+
+You can also use `+direction+` or `+reverseDirection+` to align text depending on arrow direction. Further details and examples of this are available on the link::skinparam[skinparam] page.
+
+
+@startuml
+skinparam sequenceMessageAlign right
+Bob -> Alice : Request
+Alice -> Bob : Response
+@enduml
+
+
+=== Text of response message below the arrow
+
+You can put the text of the response message below the arrow, with the `+skinparam responseMessageBelowArrow true+` command.
+
+
+@startuml
+skinparam responseMessageBelowArrow true
+Bob -> Alice : hello
+Alice -> Bob : ok
+@enduml
+
+
+
+== Change arrow style
+
+You can change arrow style by several ways:
+* add a final `+x+` to denote a lost message
+* use `+\+` or `+/+` instead of `+<+` or `+>+` to have only the bottom or top part of the arrow
+* repeat the arrow head (for example, `+>>+` or `+//+`) head to have a thin drawing
+* use `+--+` instead of `+-+` to have a dotted arrow
+* add a final "o" at arrow head
+* use bidirectional arrow `+<->+`
+
+
+@startuml
+Bob ->x Alice
+Bob -> Alice
+Bob ->> Alice
+Bob -\ Alice
+Bob \\- Alice
+Bob //-- Alice
+
+Bob ->o Alice
+Bob o\\-- Alice
+
+Bob <-> Alice
+Bob <->o Alice
+@enduml
+
+
+
+
+== Change arrow color
+
+You can change the color of individual arrows using the following notation:
+
+@startuml
+Bob -[#red]> Alice : hello
+Alice -[#0000FF]->Bob : ok
+@enduml
+
+
+
+
+== Message sequence numbering
+
+
+The keyword `+autonumber+` is used to
+automatically add an incrementing number to messages.
+
+
+@startuml
+autonumber
+Bob -> Alice : Authentication Request
+Bob <- Alice : Authentication Response
+@enduml
+
+
+You can specify a startnumber with `+autonumber +` , and
+also an increment with `+autonumber +`.
+
+
+
+@startuml
+autonumber
+Bob -> Alice : Authentication Request
+Bob <- Alice : Authentication Response
+
+autonumber 15
+Bob -> Alice : Another authentication Request
+Bob <- Alice : Another authentication Response
+
+autonumber 40 10
+Bob -> Alice : Yet another authentication Request
+Bob <- Alice : Yet another authentication Response
+
+@enduml
+
+
+
+You can specify a format for your number by using between double-quote.
+
+The formatting is done with the Java class `+DecimalFormat+`
+(`+0+` means digit, `+#+` means digit and zero if absent).
+
+You can use some html tag in the format.
+
+@startuml
+autonumber "[000]"
+Bob -> Alice : Authentication Request
+Bob <- Alice : Authentication Response
+
+autonumber 15 "(##)"
+Bob -> Alice : Another authentication Request
+Bob <- Alice : Another authentication Response
+
+autonumber 40 10 "Message 0 "
+Bob -> Alice : Yet another authentication Request
+Bob <- Alice : Yet another authentication Response
+
+@enduml
+
+
+You can also use `+autonumber stop+` and
+`+autonumber resume +` to respectively pause and resume
+automatic numbering.
+
+
+@startuml
+autonumber 10 10 "[000]"
+Bob -> Alice : Authentication Request
+Bob <- Alice : Authentication Response
+
+autonumber stop
+Bob -> Alice : dummy
+
+autonumber resume "Message 0 "
+Bob -> Alice : Yet another authentication Request
+Bob <- Alice : Yet another authentication Response
+
+autonumber stop
+Bob -> Alice : dummy
+
+autonumber resume 1 "Message 0 "
+Bob -> Alice : Yet another authentication Request
+Bob <- Alice : Yet another authentication Response
+@enduml
+
+
+Your startnumber can also be a 2 or 3 digit sequence using a field delimiter such as `+.+`, `+;+`, `+,+`, `+:+` or a mix of these. For example: `+1.1.1+` or `+1.1:1+`.
+
+Automatically the last digit will increment.
+
+To increment the first digit, use: `+autonumber inc A+`. To increment the second digit, use: `+autonumber inc B+`.
+
+
+@startuml
+autonumber 1.1.1
+Alice -> Bob: Authentication request
+Bob --> Alice: Response
+
+autonumber inc A
+'Now we have 2.1.1
+Alice -> Bob: Another authentication request
+Bob --> Alice: Response
+
+autonumber inc B
+'Now we have 2.2.1
+Alice -> Bob: Another authentication request
+Bob --> Alice: Response
+
+autonumber inc A
+'Now we have 3.1.1
+Alice -> Bob: Another authentication request
+autonumber inc B
+'Now we have 3.2.1
+Bob --> Alice: Response
+@enduml
+
+
+
+You can also use the value of `+autonumber+` with the `+%autonumber%+` variable:
+
+@startuml
+autonumber 10
+Alice -> Bob
+note right
+ the autonumber works everywhere.
+ Here, its value is ** %autonumber% **
+end note
+Bob --> Alice: //This is the response %autonumber%//
+@enduml
+
+__[Ref. https://forum.plantuml.net/7119/create-links-after-creating-a-diagram?show=7137#a7137[QA-7119]]__
+
+
+== Page Title, Header and Footer
+
+The `+title+` keyword is used to add a title to the page.
+
+Pages can display headers and footers using `+header+` and `+footer+`.
+
+
+@startuml
+
+header Page Header
+footer Page %page% of %lastpage%
+
+title Example Title
+
+Alice -> Bob : message 1
+Alice -> Bob : message 2
+
+@enduml
+
+
+
+
+
+== Splitting diagrams
+
+
+The `+newpage+` keyword is used to split a diagram into several images.
+
+You can put a title for the new page just after the `+newpage+`
+keyword. This title overrides the previously specified title if any.
+
+This is very handy with __Word__ to print long diagram on
+several pages.
+
+(Note: this really does work. Only the first page is shown below, but it is a display artifact.)
+
+
+@startuml
+
+Alice -> Bob : message 1
+Alice -> Bob : message 2
+
+newpage
+
+Alice -> Bob : message 3
+Alice -> Bob : message 4
+
+newpage A title for the\nlast page
+
+Alice -> Bob : message 5
+Alice -> Bob : message 6
+@enduml
+
+
+
+
+== Grouping message
+
+
+It is possible to group messages together using the following
+keywords:
+* `+alt/else+`
+* `+opt+`
+* `+loop+`
+* `+par+`
+* `+break+`
+* `+critical+`
+* `+group+`, followed by a text to be displayed
+
+
+It is possible to add a text that will be displayed into the
+header (for `+group+`, see next paragraph __'Secondary group label'__).
+
+The `+end+` keyword is used to close the group.
+
+Note that it is possible to nest groups.
+
+
+@startuml
+Alice -> Bob: Authentication Request
+
+alt successful case
+
+ Bob -> Alice: Authentication Accepted
+
+else some kind of failure
+
+ Bob -> Alice: Authentication Failure
+ group My own label
+ Alice -> Log : Log attack start
+ loop 1000 times
+ Alice -> Bob: DNS Attack
+ end
+ Alice -> Log : Log attack end
+ end
+
+else Another type of failure
+
+ Bob -> Alice: Please repeat
+
+end
+@enduml
+
+
+
+== Secondary group label
+
+For `+group+`, it is possible to add, between`+[+` and `+]+`, a secondary text or label that will be displayed into the header.
+
+
+@startuml
+Alice -> Bob: Authentication Request
+Bob -> Alice: Authentication Failure
+group My own label [My own label 2]
+ Alice -> Log : Log attack start
+ loop 1000 times
+ Alice -> Bob: DNS Attack
+ end
+ Alice -> Log : Log attack end
+end
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/2503[QA-2503]]__
+
+
+== Notes on messages
+
+It is possible to put notes on message using the `+note left+`
+or `+note right+` keywords __just after the message__.
+
+You can have a multi-line note using the `+end note+`
+keywords.
+
+
+@startuml
+Alice->Bob : hello
+note left: this is a first note
+
+Bob->Alice : ok
+note right: this is another note
+
+Bob->Bob : I am thinking
+note left
+a note
+can also be defined
+on several lines
+end note
+@enduml
+
+
+
+
+== Some other notes
+
+
+It is also possible to place notes relative to participant with `+note left of+` , `+note right of+` or `+note over+` keywords.
+
+It is possible to highlight a note by changing its background link::color[color].
+
+You can also have a multi-line note using the `+end note+` keywords.
+
+
+@startuml
+participant Alice
+participant Bob
+note left of Alice #aqua
+This is displayed
+left of Alice.
+end note
+
+note right of Alice: This is displayed right of Alice.
+
+note over Alice: This is displayed over Alice.
+
+note over Alice, Bob #FFAAAA: This is displayed\n over Bob and Alice.
+
+note over Bob, Alice
+This is yet another
+example of
+a long note.
+end note
+@enduml
+
+
+
+== Changing notes shape [hnote, rnote]
+
+You can use `+hnote+` and `+rnote+` keywords
+to change note shapes :
+* `+hnote+` for hexagonal note;
+* `+rnote+` for rectangle note.
+
+@startuml
+caller -> server : conReq
+hnote over caller : idle
+caller <- server : conConf
+rnote over server
+ "r" as rectangle
+ "h" as hexagon
+endrnote
+rnote over server
+ this is
+ on several
+ lines
+endrnote
+hnote over caller
+ this is
+ on several
+ lines
+endhnote
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/1765/is-it-possible-to-have-different-shapes-for-notes?show=1806#c1806[QA-1765]]__
+
+
+== Note over all participants [across]
+
+You can directly make a note over all participants, with the syntax:
+* `+note across: note_description+`
+
+
+@startuml
+Alice->Bob:m1
+Bob->Charlie:m2
+note over Alice, Charlie: Old method for note over all part. with:\n ""note over //FirstPart, LastPart//"".
+note across: New method with:\n""note across""
+Bob->Alice
+hnote across:Note across all part.
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/9738[QA-9738]]__
+
+
+== Several notes aligned at the same level [/]
+
+You can make several notes aligned at the same level, with the syntax `+/+`:
+* without `+/+` __(by default, the notes are not aligned)__
+
+@startuml
+note over Alice : initial state of Alice
+note over Bob : initial state of Bob
+Bob -> Alice : hello
+@enduml
+
+
+* with `+/+` __(the notes are aligned)__
+
+@startuml
+note over Alice : initial state of Alice
+/ note over Bob : initial state of Bob
+Bob -> Alice : hello
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/354[QA-354]]__
+
+
+== Creole and HTML
+
+link::creole[It is also possible to use creole formatting:]
+
+
+@startuml
+participant Alice
+participant "The **Famous** Bob" as Bob
+
+Alice -> Bob : hello --there--
+... Some ~~long delay~~ ...
+Bob -> Alice : ok
+note left
+ This is **bold**
+ This is //italics//
+ This is ""monospaced""
+ This is --stroked--
+ This is __underlined__
+ This is ~~waved~~
+end note
+
+Alice -> Bob : A //well formatted// message
+note right of Alice
+ This is displayed
+ __left of__ Alice.
+end note
+note left of Bob
+ This is displayed
+ **left ofAlice Bob**.
+end note
+note over Alice, Bob
+ This is hosted by
+end note
+@enduml
+
+
+
+
+== Divider or separator
+
+
+If you want, you can split a diagram using `+==+` separator to
+divide your diagram into logical steps.
+
+@startuml
+
+== Initialization ==
+
+Alice -> Bob: Authentication Request
+Bob --> Alice: Authentication Response
+
+== Repetition ==
+
+Alice -> Bob: Another authentication Request
+Alice <-- Bob: another authentication Response
+
+@enduml
+
+
+
+== Reference
+
+You can use reference in a diagram, using the keyword `+ref over+`.
+
+@startuml
+participant Alice
+actor Bob
+
+ref over Alice, Bob : init
+
+Alice -> Bob : hello
+
+ref over Bob
+ This can be on
+ several lines
+end ref
+@enduml
+
+
+
+
+== Delay
+
+You can use `+...+` to indicate a delay in the diagram.
+And it is also possible to put a message with this delay.
+
+@startuml
+
+Alice -> Bob: Authentication Request
+...
+Bob --> Alice: Authentication Response
+...5 minutes later...
+Bob --> Alice: Good Bye !
+
+@enduml
+
+
+
+== Text wrapping
+
+To break long messages, you can manually add `+\n+` in your text.
+
+Another option is to use `+maxMessageSize+` setting:
+
+
+@startuml
+skinparam maxMessageSize 50
+participant a
+participant b
+a -> b :this\nis\nmanually\ndone
+a -> b :this is a very long message on several words
+@enduml
+
+
+
+== Space
+
+
+You can use `+|||+` to indicate some spacing in the diagram.
+
+It is also possible to specify a number of pixel to be used.
+
+@startuml
+
+Alice -> Bob: message 1
+Bob --> Alice: ok
+|||
+Alice -> Bob: message 2
+Bob --> Alice: ok
+||45||
+Alice -> Bob: message 3
+Bob --> Alice: ok
+
+@enduml
+
+
+
+
+== Lifeline Activation and Destruction
+
+The `+activate+` and `+deactivate+` are used to denote
+participant activation.
+
+Once a participant is activated, its lifeline appears.
+
+The `+activate+` and `+deactivate+` apply on
+the previous message.
+
+The `+destroy+` denote the end of the lifeline of a
+participant.
+
+
+@startuml
+participant User
+
+User -> A: DoWork
+activate A
+
+A -> B: << createRequest >>
+activate B
+
+B -> C: DoWork
+activate C
+C --> B: WorkDone
+destroy C
+
+B --> A: RequestCreated
+deactivate B
+
+A -> User: Done
+deactivate A
+
+@enduml
+
+
+
+Nested lifeline can be used, and it is possible to add a link::color[color] on the lifeline.
+
+
+@startuml
+participant User
+
+User -> A: DoWork
+activate A #FFBBBB
+
+A -> A: Internal call
+activate A #DarkSalmon
+
+A -> B: << createRequest >>
+activate B
+
+B --> A: RequestCreated
+deactivate B
+deactivate A
+A -> User: Done
+deactivate A
+
+@enduml
+
+
+Autoactivation is possible and works with the return keywords:
+
+
+@startuml
+autoactivate on
+alice -> bob : hello
+bob -> bob : self call
+bill -> bob #005500 : hello from thread 2
+bob -> george ** : create
+return done in thread 2
+return rc
+bob -> george !! : delete
+return success
+
+@enduml
+
+
+
+== Return
+
+Command `+return+` generates a return message with optional text label.
+
+The return point is that which caused the most recent life-line activation.
+
+The syntax is `+return label+` where `+label+` if provided is any string acceptable for conventional messages.
+
+
+
+@startuml
+Bob -> Alice : hello
+activate Alice
+Alice -> Alice : some action
+return bye
+@enduml
+
+
+
+
+== Participant creation
+
+
+You can use the `+create+` keyword just before the first
+reception of a message to emphasize the fact that this message is
+actually __creating__ this new object.
+
+@startuml
+Bob -> Alice : hello
+
+create Other
+Alice -> Other : new
+
+create control String
+Alice -> String
+note right : You can also put notes!
+
+Alice --> Bob : ok
+
+@enduml
+
+
+
+
+== Shortcut syntax for activation, deactivation, creation
+
+
+Immediately after specifying the target participant, the following syntax can be used:
+
+* `++++` Activate the target (optionally a link::color[color] may follow this)
+* `+--+` Deactivate the source
+* `+**+` Create an instance of the target
+* `+!!+` Destroy an instance of the target
+
+
+@startuml
+alice -> bob ++ : hello
+bob -> bob ++ : self call
+bob -> bib ++ #005500 : hello
+bob -> george ** : create
+return done
+return rc
+bob -> george !! : delete
+return success
+@enduml
+
+
+Then you can mix activation and deactivation, on same line:
+
+@startuml
+alice -> bob ++ : hello1
+bob -> charlie --++ : hello2
+charlie --> alice -- : ok
+@enduml
+
+
+
+@startuml
+@startuml
+alice -> bob --++ #gold: hello
+bob -> alice --++ #gold: you too
+alice -> bob --: step1
+alice -> bob : step2
+@enduml
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/4834/activation-shorthand-for-sequence-diagrams?show=13054#c13054[QA-4834], https://forum.plantuml.net/9573[QA-9573] and https://forum.plantuml.net/13234[QA-13234]]__
+
+
+== Incoming and outgoing messages
+
+You can use incoming or outgoing arrows if you want to focus on a part
+of the diagram.
+
+Use square brackets to denote the left "`+[+`" or the
+right "`+]+`" side of the diagram.
+
+@startuml
+[-> A: DoWork
+
+activate A
+
+A -> A: Internal call
+activate A
+
+A ->] : << createRequest >>
+
+A<--] : RequestCreated
+deactivate A
+[<- A: Done
+deactivate A
+@enduml
+
+
+
+You can also have the following syntax:
+
+@startuml
+participant Alice
+participant Bob #lightblue
+Alice -> Bob
+Bob -> Carol
+...
+[-> Bob
+[o-> Bob
+[o->o Bob
+[x-> Bob
+...
+[<- Bob
+[x<- Bob
+...
+Bob ->]
+Bob ->o]
+Bob o->o]
+Bob ->x]
+...
+Bob <-]
+Bob x<-]
+
+@enduml
+
+
+
+== Short arrows for incoming and outgoing messages
+
+You can have **short** arrows with using `+?+`.
+
+
+@startuml
+?-> Alice : ""?->""\n**short** to actor1
+[-> Alice : ""[->""\n**from start** to actor1
+[-> Bob : ""[->""\n**from start** to actor2
+?-> Bob : ""?->""\n**short** to actor2
+Alice ->] : ""->]""\nfrom actor1 **to end**
+Alice ->? : ""->?""\n**short** from actor1
+Alice -> Bob : ""->"" \nfrom actor1 to actor2
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/310[QA-310]]__
+
+
+== Anchors and Duration
+
+
+
+With `+teoz+` it is possible to add anchors to the diagram and use the anchors to specify duration time.
+
+@startuml
+!pragma teoz true
+
+{start} Alice -> Bob : start doing things during duration
+Bob -> Max : something
+Max -> Bob : something else
+{end} Bob -> Alice : finish
+
+{start} <-> {end} : some time
+
+@enduml
+
+
+You can use the `+-P+` link::command-line[command-line] option to specify the pragma:
+----
+java -jar plantuml.jar -Pteoz=true
+----
+__[Ref. https://github.com/plantuml/plantuml/issues/582[issue-582]]__
+
+
+== Stereotypes and Spots
+
+
+
+It is possible to add stereotypes to participants using `+<<+`
+and `+>>+`.
+
+In the stereotype, you can add a spotted character
+in a colored circle using the syntax `+(X,color)+`.
+
+@startuml
+
+participant "Famous Bob" as Bob << Generated >>
+participant Alice << (C,#ADD1B2) Testable >>
+
+Bob->Alice: First message
+
+@enduml
+
+
+By default, the __guillemet__ character is used to display the stereotype.
+You can change this behavious using the skinparam `+guillemet+`:
+
+
+@startuml
+
+skinparam guillemet false
+participant "Famous Bob" as Bob << Generated >>
+participant Alice << (C,#ADD1B2) Testable >>
+
+Bob->Alice: First message
+
+@enduml
+
+
+
+@startuml
+
+participant Bob << (C,#ADD1B2) >>
+participant Alice << (C,#ADD1B2) >>
+
+Bob->Alice: First message
+
+@enduml
+
+
+
+
+== More information on titles
+
+You can use link::creole[creole formatting] in the title.
+
+
+@startuml
+
+title __Simple__ **communication** example
+
+Alice -> Bob: Authentication Request
+Bob -> Alice: Authentication Response
+
+@enduml
+
+You can add newline using `+\n+` in the title description.
+
+@startuml
+
+title __Simple__ communication example\non several lines
+
+Alice -> Bob: Authentication Request
+Bob -> Alice: Authentication Response
+
+@enduml
+
+You can also define title on several lines using `+title+`
+and `+end title+` keywords.
+
+@startuml
+
+title
+ Simple communication example
+ on several lines and using html
+ This is hosted by
+end title
+
+Alice -> Bob: Authentication Request
+Bob -> Alice: Authentication Response
+
+@enduml
+
+
+
+
+== Participants encompass
+
+
+
+It is possible to draw a box around some participants, using `+box+`
+and `+end box+` commands.
+
+You can add an optional title or a
+optional background color, after the `+box+` keyword.
+
+
+@startuml
+
+box "Internal Service" #LightBlue
+participant Bob
+participant Alice
+end box
+participant Other
+
+Bob -> Alice : hello
+Alice -> Other : hello
+
+@enduml
+
+
+
+It is also possible to nest boxes - to draw a box within a box - when using the teoz rendering engine, for example:
+
+
+@startuml
+
+!pragma teoz true
+box "Internal Service" #LightBlue
+participant Bob
+box "Subteam"
+participant Alice
+participant John
+end box
+
+end box
+participant Other
+
+Bob -> Alice : hello
+Alice -> John : hello
+John -> Other: Hello
+
+@enduml
+
+
+
+== Removing Foot Boxes
+
+You can use the `+hide footbox+` keywords to remove the foot boxes
+of the diagram.
+
+
+@startuml
+
+hide footbox
+title Foot Box removed
+
+Alice -> Bob: Authentication Request
+Bob --> Alice: Authentication Response
+
+@enduml
+
+
+
+
+== Skinparam
+
+
+You can use the link::skinparam[skinparam]
+command to change colors and fonts for the drawing.
+
+
+You can use this command:
+* In the diagram definition, like any other commands,
+* In an link::preprocessing[included file],
+* In a configuration file, provided in the link::command-line[command line] or the link::ant-task[ANT task].
+
+You can also change other rendering parameter, as seen in the following examples:
+
+
+@startuml
+skinparam sequenceArrowThickness 2
+skinparam roundcorner 20
+skinparam maxmessagesize 60
+skinparam sequenceParticipant underline
+
+actor User
+participant "First Class" as A
+participant "Second Class" as B
+participant "Last Class" as C
+
+User -> A: DoWork
+activate A
+
+A -> B: Create Request
+activate B
+
+B -> C: DoWork
+activate C
+C --> B: WorkDone
+destroy C
+
+B --> A: Request Created
+deactivate B
+
+A --> User: Done
+deactivate A
+
+@enduml
+
+
+
+@startuml
+skinparam backgroundColor #EEEBDC
+skinparam handwritten true
+
+skinparam sequence {
+ArrowColor DeepSkyBlue
+ActorBorderColor DeepSkyBlue
+LifeLineBorderColor blue
+LifeLineBackgroundColor #A9DCDF
+
+ParticipantBorderColor DeepSkyBlue
+ParticipantBackgroundColor DodgerBlue
+ParticipantFontName Impact
+ParticipantFontSize 17
+ParticipantFontColor #A9DCDF
+
+ActorBackgroundColor aqua
+ActorFontColor DeepSkyBlue
+ActorFontSize 17
+ActorFontName Aapex
+}
+
+actor User
+participant "First Class" as A
+participant "Second Class" as B
+participant "Last Class" as C
+
+User -> A: DoWork
+activate A
+
+A -> B: Create Request
+activate B
+
+B -> C: DoWork
+activate C
+C --> B: WorkDone
+destroy C
+
+B --> A: Request Created
+deactivate B
+
+A --> User: Done
+deactivate A
+
+@enduml
+
+
+
+
+
+== Changing padding
+
+
+It is possible to tune some padding settings.
+
+
+@startuml
+skinparam ParticipantPadding 20
+skinparam BoxPadding 10
+
+box "Foo1"
+participant Alice1
+participant Alice2
+end box
+box "Foo2"
+participant Bob1
+participant Bob2
+end box
+Alice1 -> Bob1 : hello
+Alice1 -> Out : out
+@enduml
+
+
+
+
+
+== Appendix: Examples of all arrow type
+
+=== Normal arrow
+
+@startuml
+participant Alice as a
+participant Bob as b
+a -> b : ""-> ""
+a ->> b : ""->> ""
+a -\ b : ""-\ ""
+a -\\ b : ""-\\\\""
+a -/ b : ""-/ ""
+a -// b : ""-// ""
+a ->x b : ""->x ""
+a x-> b : ""x-> ""
+a o-> b : ""o-> ""
+a ->o b : ""->o ""
+a o->o b : ""o->o ""
+a <-> b : ""<-> ""
+a o<->o b : ""o<->o""
+a x<->x b : ""x<->x""
+a ->>o b : ""->>o ""
+a -\o b : ""-\o ""
+a -\\o b : ""-\\\\o""
+a -/o b : ""-/o ""
+a -//o b : ""-//o ""
+a x->o b : ""x->o ""
+@enduml
+
+
+=== Itself arrow
+
+@startuml
+participant Alice as a
+participant Bob as b
+a -> a : ""-> ""
+a ->> a : ""->> ""
+a -\ a : ""-\ ""
+a -\\ a : ""-\\\\""
+a -/ a : ""-/ ""
+a -// a : ""-// ""
+a ->x a : ""->x ""
+a x-> a : ""x-> ""
+a o-> a : ""o-> ""
+a ->o a : ""->o ""
+a o->o a : ""o->o ""
+a <-> a : ""<-> ""
+a o<->o a : ""o<->o""
+a x<->x a : ""x<->x""
+a ->>o a : ""->>o ""
+a -\o a : ""-\o ""
+a -\\o a : ""-\\\\o""
+a -/o a : ""-/o ""
+a -//o a : ""-//o ""
+a x->o a : ""x->o ""
+@enduml
+
+
+=== Incoming and outgoing messages (with '[', ']')
+==== Incoming messages (with '[')
+
+@startuml
+participant Alice as a
+participant Bob as b
+[-> b : ""[-> ""
+[->> b : ""[->> ""
+[-\ b : ""[-\ ""
+[-\\ b : ""[-\\\\""
+[-/ b : ""[-/ ""
+[-// b : ""[-// ""
+[->x b : ""[->x ""
+[x-> b : ""[x-> ""
+[o-> b : ""[o-> ""
+[->o b : ""[->o ""
+[o->o b : ""[o->o ""
+[<-> b : ""[<-> ""
+[o<->o b : ""[o<->o""
+[x<->x b : ""[x<->x""
+[->>o b : ""[->>o ""
+[-\o b : ""[-\o ""
+[-\\o b : ""[-\\\\o""
+[-/o b : ""[-/o ""
+[-//o b : ""[-//o ""
+[x->o b : ""[x->o ""
+@enduml
+
+
+==== Outgoing messages (with ']')
+
+@startuml
+participant Alice as a
+participant Bob as b
+a ->] : ""->] ""
+a ->>] : ""->>] ""
+a -\] : ""-\] ""
+a -\\] : ""-\\\\]""
+a -/] : ""-/] ""
+a -//] : ""-//] ""
+a ->x] : ""->x] ""
+a x->] : ""x->] ""
+a o->] : ""o->] ""
+a ->o] : ""->o] ""
+a o->o] : ""o->o] ""
+a <->] : ""<->] ""
+a o<->o] : ""o<->o]""
+a x<->x] : ""x<->x]""
+a ->>o] : ""->>o] ""
+a -\o] : ""-\o] ""
+a -\\o] : ""-\\\\o]""
+a -/o] : ""-/o] ""
+a -//o] : ""-//o] ""
+a x->o] : ""x->o] ""
+@enduml
+
+
+=== Short incoming and outgoing messages (with '?')
+==== Short incoming (with '?')
+
+@startuml
+participant Alice as a
+participant Bob as b
+a -> b : //Long long label//
+?-> b : ""?-> ""
+?->> b : ""?->> ""
+?-\ b : ""?-\ ""
+?-\\ b : ""?-\\\\""
+?-/ b : ""?-/ ""
+?-// b : ""?-// ""
+?->x b : ""?->x ""
+?x-> b : ""?x-> ""
+?o-> b : ""?o-> ""
+?->o b : ""?->o ""
+?o->o b : ""?o->o ""
+?<-> b : ""?<-> ""
+?o<->o b : ""?o<->o""
+?x<->x b : ""?x<->x""
+?->>o b : ""?->>o ""
+?-\o b : ""?-\o ""
+?-\\o b : ""?-\\\\o ""
+?-/o b : ""?-/o ""
+?-//o b : ""?-//o ""
+?x->o b : ""?x->o ""
+@enduml
+
+
+==== Short outgoing (with '?')
+
+@startuml
+participant Alice as a
+participant Bob as b
+a -> b : //Long long label//
+a ->? : ""->? ""
+a ->>? : ""->>? ""
+a -\? : ""-\? ""
+a -\\? : ""-\\\\?""
+a -/? : ""-/? ""
+a -//? : ""-//? ""
+a ->x? : ""->x? ""
+a x->? : ""x->? ""
+a o->? : ""o->? ""
+a ->o? : ""->o? ""
+a o->o? : ""o->o? ""
+a <->? : ""<->? ""
+a o<->o? : ""o<->o?""
+a x<->x? : ""x<->x?""
+a ->>o? : ""->>o? ""
+a -\o? : ""-\o? ""
+a -\\o? : ""-\\\\o?""
+a -/o? : ""-/o? ""
+a -//o? : ""-//o? ""
+a x->o? : ""x->o? ""
+@enduml
+
+
+
+== Specific SkinParameter
+
+=== By default
+
+@startuml
+Bob -> Alice : hello
+Alice -> Bob : ok
+@enduml
+
+
+=== LifelineStrategy
+
+* nosolid __(by default)__
+
+@startuml
+skinparam lifelineStrategy nosolid
+Bob -> Alice : hello
+Alice -> Bob : ok
+@enduml
+
+__[Ref. https://forum.plantuml.net/9016/[QA-9016]]__
+
+* solid
+In order to have solid life line in sequence diagrams, you can use: `+skinparam lifelineStrategy solid+`
+
+@startuml
+skinparam lifelineStrategy solid
+Bob -> Alice : hello
+Alice -> Bob : ok
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/2794[QA-2794]]__
+
+=== style strictuml
+To be conform to strict UML (__for arrow style: emits triangle rather than sharp arrowheads__), you can use:
+* `+skinparam style strictuml+`
+
+@startuml
+skinparam style strictuml
+Bob -> Alice : hello
+Alice -> Bob : ok
+@enduml
+
+__[Ref. https://forum.plantuml.net/1047[QA-1047]]__
+
+
+== Hide unlinked participant
+
+By default, all participants are displayed.
+
+@startuml
+participant Alice
+participant Bob
+participant Carol
+
+Alice -> Bob : hello
+@enduml
+
+
+But you can `+hide unlinked+` participant.
+
+@startuml
+hide unlinked
+participant Alice
+participant Bob
+participant Carol
+
+Alice -> Bob : hello
+@enduml
+
+
+
+__[Ref. https://forum.plantuml.net/4247[QA-4247]]__
+
+
+== Color a group message
+
+
+It is possible to link::color[color] a group messages:
+
+
+@startuml
+Alice -> Bob: Authentication Request
+alt#Gold #LightBlue Successful case
+ Bob -> Alice: Authentication Accepted
+else #Pink Failure
+ Bob -> Alice: Authentication Rejected
+end
+@enduml
+
+__[Ref. https://forum.plantuml.net/4750[QA-4750] and https://forum.plantuml.net/6410[QA-6410]]__
+
+
+== Mainframe
+
+
+@startuml
+mainframe This is a **mainframe**
+Alice->Bob : Hello
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/4019[QA-4019] and https://github.com/plantuml/plantuml/issues/148[Issue#148]]__
+
+
+== Slanted or odd arrows
+
+You can use the `+(nn)+` option (before or after arrow) to make the arrows slanted, where __nn__ is the number of shift pixels.
+
+__[Available only after v1.2022.6beta+]__
+
+
+@startuml
+A ->(10) B: text 10
+B ->(10) A: text 10
+
+A ->(10) B: text 10
+A (10)<- B: text 10
+@enduml
+
+
+
+@startuml
+A ->(40) B++: Rq
+B -->(20) A--: Rs
+@enduml
+
+__[Ref. https://forum.plantuml.net/14145/plantuml-draw-odd-line[QA-14145]]__
+
+
+@startuml
+!pragma teoz true
+A ->(50) C: Starts\nwhen 'B' sends
+& B ->(25) C: \nBut B's message\n arrives before A's
+@enduml
+
+__[Ref. https://forum.plantuml.net/6684/non-instantaneous-messages-in-sequence-diagram[QA-6684]]__
+
+
+@startuml
+!pragma teoz true
+
+S1 ->(30) S2: msg 1\n
+& S2 ->(30) S1: msg 2
+
+note left S1: msg\nS2 to S1
+& note right S2: msg\nS1 to S2
+@enduml
+
+__[Ref. https://forum.plantuml.net/1072/sequence-diagram-crossed-arrows[QA-1072]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/server.adoc b/plantuml-docs/docs_from_alphadoc/server.adoc
new file mode 100644
index 00000000..b0f20eb9
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/server.adoc
@@ -0,0 +1,131 @@
+== PlantUML Server
+
+You can use PlantUML using the online web service to generate images on-the-fly. A online demonstration is available at http://www.plantuml.com/plantuml[http://www.plantuml.com/plantuml], but you can also install it on your own JEE web application server.
+
+If you don't want to install a full JEE application server, you may also choose to run link::picoweb[PlantUML PicoWeb Server] locally.
+
+
+== Interactive interface
+
+The big input field is used to enter your diagram description. You can type in any diagram description, then press the submit button and the diagram will be displayed below.
+It's a good practice to start your diagram by the `+@startxxx+` keyword.
+
+When you validate the diagram, you are redirected to an encoded URL encoding your diagram. The link::text-encoding[encoded form] is a convenient way to share your diagrams with others because it's shorter than the many lines of a diagram and it can be easily displayed in a browser using the online PlantUML Server.
+
+For example, `+SyfFKj2rKt3CoKnELR1Io4ZDoSa70000+` is the encoded form of:
+
+----
+@startuml
+Bob -> Alice : hello
+@enduml
+----
+
+
+
+== Specify an initial diagram
+
+By default, the PlantUML Server shows the well-known `+Bob -> Alice+` sample but it's easy to invoke it with an other diagram using its encoded form.
+Just append `+/uml/ENCODED+` to the URL.
+
+For example, this link http://www.plantuml.com/plantuml/uml/Aov9B2hXil98pSd9LoZFByf9iUOgBial0000[http://www.plantuml.com/plantuml/uml/Aov9B2hXil98pSd9LoZFByf9iUOgBial0000] opens the PlantUML Server with a simple Hello World activity diagram.
+
+
+
+== Metadata
+
+PlantUML saves the diagram's source code in the generated PNG Metadata in the form of link::text-encoding[encoded text]. So it is possible to retrieve this source by using the query parameter `+metadata+`, giving it some image URL.
+
+For example, if you want to retrieve the diagram source of the image `+http://i.stack.imgur.com/HJvKF.png+` use the following server request: `+http://www.plantuml.com/plantuml/?metadata=http://i.stack.imgur.com/HJvKF.png+`.
+
+Sounds like magic! No, merely clever engineering :-)
+
+
+== Web service mode
+
+The web service interface of the PlantUML Server is dedicated to developers.
+
+
+
+== PNG service
+
+To get a PNG file of a diagram, use the following URL scheme:
+http://www.plantuml.com/plantuml/png/SyfFKj2rKt3CoKnELR1Io4ZDoSa70000[/plantuml/png/ENCODED]
+
+
+
+== SVG service
+
+To get a SVG XML file of a diagram, use the following URL scheme:
+http://www.plantuml.com/plantuml/svg/SyfFKj2rKt3CoKnELR1Io4ZDoSa70000[/plantuml/svg/ENCODED]
+
+> Note that not all diagrams can be produced in link::svg[SVG]. For example, link::ditaa[ditaa diagrams] are only available in PNG format.
+
+
+
+== ASCII Art service
+
+To get an ASCII Art representation of a diagram, encoded in UTF-8, use the following URL scheme:
+http://www.plantuml.com/plantuml/txt/SyfFKj2rKt3CoKnELR1Io4ZDoSa70000[/plantuml/txt/ENCODED]
+
+Note that only sequence diagrams can be produced in ASCII Art.
+
+
+
+== Image Map service
+
+To get the http://en.wikipedia.org/wiki/Image_map#Pure_HTML[client image map] related to a previously generated PNG image, use the following URL scheme:
+http://www.plantuml.com/plantuml/map/AqWiAibCpYn8p2jHSCfFKeYEpYWfAR3IroylBzSho04Ab-Rcw2NdvyR6Se7aTUqK77CoarCLh11AuSgAyqkBabFJyelIK_NoKajYOnKoKdDoyW40[/plantuml/map/ENCODED]
+
+The output is a list of `++` tags, each line matching a link present in the diagram description.
+
+For example, the following http://www.plantuml.com/plantuml/uml/SoWkIImgAStDuIe0qfd9cGM9UIKAJlb92j7H6IKb1LRw-WKvG26W2hta_DpOM2wGdAwTWcDEPdAgWXL2MLf-KMck7bnnNcf9RAn2HcfEJZwNGsfU2iWA0000[diagram]:
+----
+@startuml
+participant Bob [[http://plantuml.com]]
+Bob -> Alice : [[http://forum.plantuml.net]] hello
+@enduml
+----
+
+produces the http://www.plantuml.com/plantuml/map/AqWiAibCpYn8p2jHSCfFKeYEpYWfAR3Iro_80GgLvkRe9UVdniPoWUHqxHGSSpAJKnMi4ChIyejAS_NWYlDIIs9Z5J9IStBo0G00[following output]:
+----
+
+----
+
+Note that you need to include these `+Example+++:
+
+----
+skinparam backgroundColor transparent
+----
+
+
+
+== Usage
+You can use this command :
+* In the diagram definition, like any other commands,
+* In an link::preprocessing[included file],
+* In a configuration file, provided in the link::command-line[command line] or the link::ant-task[ANT task].
+
+
+
+== Nested
+
+
+To avoid repetition, it is possible to nest definition. So the following definition :
+
+----
+skinparam xxxxParam1 value1
+skinparam xxxxParam2 value2
+skinparam xxxxParam3 value3
+skinparam xxxxParam4 value4
+----
+
+is strictly equivalent to:
+
+----
+skinparam xxxx {
+ Param1 value1
+ Param2 value2
+ Param3 value3
+ Param4 value4
+}
+----
+
+
+
+== Black and White
+
+You can force the use of a black&white output using `+skinparam monochrome true+` command.
+
+
+@startuml
+
+skinparam monochrome true
+
+actor User
+participant "First Class" as A
+participant "Second Class" as B
+participant "Last Class" as C
+
+User -> A: DoWork
+activate A
+
+A -> B: Create Request
+activate B
+
+B -> C: DoWork
+activate C
+C --> B: WorkDone
+destroy C
+
+B --> A: Request Created
+deactivate B
+
+A --> User: Done
+deactivate A
+
+@enduml
+
+
+
+
+== Shadowing
+
+You can disable the shadowing using the `+skinparam shadowing false+` command.
+
+
+@startuml
+
+left to right direction
+
+skinparam shadowing<> false
+skinparam shadowing<> true
+
+actor User
+(Glowing use case) <> as guc
+(Flat use case) <> as fuc
+User -- guc
+User -- fuc
+
+@enduml
+
+
+
+
+== Reverse colors
+
+You can force the use of a black&white output using `+skinparam monochrome reverse+` command.
+This can be useful for black background environment.
+
+
+@startuml
+
+skinparam monochrome reverse
+
+actor User
+participant "First Class" as A
+participant "Second Class" as B
+participant "Last Class" as C
+
+User -> A: DoWork
+activate A
+
+A -> B: Create Request
+activate B
+
+B -> C: DoWork
+activate C
+C --> B: WorkDone
+destroy C
+
+B --> A: Request Created
+deactivate B
+
+A --> User: Done
+deactivate A
+
+@enduml
+
+
+
+
+
+== Colors
+
+You can use either link::color[standard color name] or RGB code.
+
+
+@startuml
+colors
+@enduml
+
+
+`+transparent+` can only be used for background of the image.
+
+
+
+
+== Font color, name and size
+
+
+You can change the font for the drawing using `+xxxFontColor+`,
+`+xxxFontSize+` and `+xxxFontName+` parameters.
+
++++Example:+++
+
+----
+skinparam classFontColor red
+skinparam classFontSize 10
+skinparam classFontName Aapex
+----
+
+You can also change the default font for all fonts using `+skinparam defaultFontName+`.
+
++++Example:+++
+----
+skinparam defaultFontName Aapex
+----
+
+Please note the fontname is highly system dependent, so do not
+over use it, if you look for portability. `+Helvetica+` and `+Courier+`
+should be available on all systems.
+
+A lot of parameters are available. You can list them using the following command:
+----
+java -jar plantuml.jar -language
+----
+
+
+== Text Alignment
+
+Text alignment can be set to `+left+`, `+right+` or `+center+` in `+skinparam sequenceMessageAlign+`.
+You can also use `+direction+` or `+reverseDirection+` values to align text depending on arrow direction.
+
+|===
+| Param name | Default value | Comment
+
+| sequenceMessageAlign
+| left
+| Used for messages in sequence diagrams
+
+| sequenceReferenceAlign
+| center
+| Used for `+ref over+` in sequence diagrams
+
+|===
+
+
+@startuml
+skinparam sequenceMessageAlign center
+Alice -> Bob : Hi
+Bob -> Alice : This is very long
+@enduml
+
+
+
+@startuml
+skinparam sequenceMessageAlign right
+Alice -> Bob : Hi
+Bob -> Alice : This is very long
+@enduml
+
+
+
+@startuml
+skinparam sequenceMessageAlign direction
+Alice -> Bob : Hi
+Bob -> Alice: Hi
+@enduml
+
+
+
+== Examples
+
+
+@startuml
+skinparam backgroundColor #EEEBDC
+skinparam handwritten true
+
+skinparam sequence {
+ArrowColor DeepSkyBlue
+ActorBorderColor DeepSkyBlue
+LifeLineBorderColor blue
+LifeLineBackgroundColor #A9DCDF
+
+ParticipantBorderColor DeepSkyBlue
+ParticipantBackgroundColor DodgerBlue
+ParticipantFontName Impact
+ParticipantFontSize 17
+ParticipantFontColor #A9DCDF
+
+ActorBackgroundColor aqua
+ActorFontColor DeepSkyBlue
+ActorFontSize 17
+ActorFontName Aapex
+}
+
+actor User
+participant "First Class" as A
+participant "Second Class" as B
+participant "Last Class" as C
+
+User -> A: DoWork
+activate A
+
+A -> B: Create Request
+activate B
+
+B -> C: DoWork
+activate C
+C --> B: WorkDone
+destroy C
+
+B --> A: Request Created
+deactivate B
+
+A --> User: Done
+deactivate A
+@enduml
+
+
+
+
+@startuml
+skinparam handwritten true
+
+skinparam actor {
+BorderColor black
+FontName Courier
+ BackgroundColor<< Human >> Gold
+}
+
+skinparam usecase {
+BackgroundColor DarkSeaGreen
+BorderColor DarkSlateGray
+
+BackgroundColor<< Main >> YellowGreen
+BorderColor<< Main >> YellowGreen
+
+ArrowColor Olive
+}
+
+User << Human >>
+:Main Database: as MySql << Application >>
+(Start) << One Shot >>
+(Use the application) as (Use) << Main >>
+
+User -> (Start)
+User --> (Use)
+
+MySql --> (Use)
+@enduml
+
+
+
+
+
+@startuml
+skinparam roundcorner 20
+skinparam class {
+BackgroundColor PaleGreen
+ArrowColor SeaGreen
+BorderColor SpringGreen
+}
+skinparam stereotypeCBackgroundColor YellowGreen
+
+Class01 "1" *-- "many" Class02 : contains
+
+Class03 o-- Class04 : aggregation
+@enduml
+
+
+
+
+@startuml
+skinparam interface {
+ backgroundColor RosyBrown
+ borderColor orange
+}
+
+skinparam component {
+ FontSize 13
+ BackgroundColor<> LightCoral
+ BorderColor<> #FF6655
+ FontName Courier
+ BorderColor black
+ BackgroundColor gold
+ ArrowFontName Impact
+ ArrowColor #FF6655
+ ArrowFontColor #777777
+}
+
+() "Data Access" as DA
+[Web Server] << Apache >>
+
+DA - [First Component]
+[First Component] ..> () HTTP : use
+HTTP - [Web Server]
+@enduml
+
+
+
+
+@startuml
+[AA] <>
+[BB] <>
+[CC] <>
+
+node node1
+node node2 <>
+database Production
+
+skinparam component {
+ backgroundColor<> DarkKhaki
+ backgroundColor<> Green
+}
+
+skinparam node {
+borderColor Green
+backgroundColor Yellow
+backgroundColor<> Magenta
+}
+skinparam databaseBackgroundColor Aqua
+@enduml
+
+
+
+== List of all skinparam parameters
+
+You can use `+-language+` on the command line or generate a "diagram" with a list of all the skinparam parameters using :
+* `+help skinparams+`
+* `+skinparameters+`
+
+
+=== Command Line: -language command
+
+Since the documentation is not always up to date, you can have the complete list of parameters using this command:
+
+----
+java -jar plantuml.jar -language
+----
+
+=== Command: help skinparams
+
+That will give you the following result, from this page __(code of this command)__: https://github.com/plantuml/plantuml/blob/master/src/net/sourceforge/plantuml/help/CommandHelpSkinparam.java[CommandHelpSkinparam.java]
+
+
+@startuml
+help skinparams
+@enduml
+
+
+
+=== Command: skinparameters
+
+@startuml
+skinparameters
+@enduml
+
+
+
+=== All Skin Parameters on the Ashley's PlantUML Doc
+
+You can also view each skinparam parameters with its results displayed at the page https://plantuml-documentation.readthedocs.io/en/latest/formatting/all-skin-params.html[`+All Skin Parameters+`] of https://plantuml-documentation.readthedocs.io/en/latest/index.html#[`+Ashley's PlantUML Doc+`]:
+* https://plantuml-documentation.readthedocs.io/en/latest/formatting/all-skin-params.html[https://plantuml-documentation.readthedocs.io/en/latest/formatting/all-skin-params.html].
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/smetana02.adoc b/plantuml-docs/docs_from_alphadoc/smetana02.adoc
new file mode 100644
index 00000000..62f59361
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/smetana02.adoc
@@ -0,0 +1,51 @@
+== Context of the Smetana project
+PlantUML uses link::graphviz-dot[Graphviz/DOT] to compute node positionning for some UML diagrams (only link::use-case-diagram[usecase diagrams], link::class-diagram[class diagrams], link::object-diagram[object diagrams], link::component-diagram[component diagrams], link::deployment-diagram[deployment diagram], link::state-diagram[state diagrams] and link::activity-diagram-legacy[Legacy activity diagrams]).
+The fact that DOT computes automatically the position of node is a key feature, and algorithms implemented in DOT usually give very good result.
+
+However, there are some drawbacks of using DOT :
+the computation is done by an external program (`+dot.exe+` on Windows, `+dot+` on linux), and that means that :
+
+* PlantUML has to create a new process for each diagram, (and communication with this new process could be source of bugs).
+* Users have to install link::graphviz-dot[DOT] on their system, in addition of Java.
+* PlantUML is not fully portable.
+
+Another way of using DOT would be to use it as a library, and to link it with PlantUML using JNI
+(Java Native Interface) but that would not be perfect thought.
+
+If a Java version of Graphviz/DOT would exist, this would allow to greatly simplify the installation and the use of PlantUML.
+So we have started a port from C to Java of GraphViz/DOT source code: see https://github.com/plantuml/smetana[Smetana project]
+
+
+== Using Smetana
+
+Smetana code has been integrated into PlantUML, so you can use the `+!pragma layout smetana+` directive
+to force PlantUML to use https://github.com/plantuml/smetana[Smetana] (the internal Java port of GraphViz/Dot embedded in PlantUML sources) instead of the regular dot process.
+
+
+
+@startuml
+!pragma layout smetana
+class Foo1
+
+Foo1 --> Foo2
+Foo1 --> Foo3
+Foo1 ---> Foo4 : test 4
+Foo1 ----> Foo5 : test 5
+
+@enduml
+
+
+**The key point is that this image has been generated without launching Graphviz/DOT!**
+
+You can use the `+-P+` link::command-line[command-line] option to specify the pragma, rather than putting it in the puml file:
+----
+java -jar plantuml.jar -Playout=smetana
+----
+__[Ref. https://github.com/plantuml/plantuml/issues/582[issue-582]]__
+
+
+== Alternative layout engines
+
+See link::elk[elk] and link::vizjs[vizjs] for other alternatives to link::graphviz-dot[graphviz-dot].
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/sources.adoc b/plantuml-docs/docs_from_alphadoc/sources.adoc
new file mode 100644
index 00000000..fc7d8e8f
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/sources.adoc
@@ -0,0 +1,123 @@
+== How and where diagrams can be written
+Each diagram description begins with the keyword `+@startuml+`
+then ends with the keyword `+@enduml+` or (`+@startXYZ+` and `+@endXYZ+`, depending of the kind of diagram).
+
+You can refer to http://sourceforge.net/projects/plantuml/files/PlantUML%20Language%20Reference%20Guide.pdf/download[the PlantUML Language Reference Guide].
+
+Those descriptions may be included into:
+* PlantUML file (**.pu** or **.puml**)
+* Text files (**.txt**),
+* HTML files (**.html** or **.htm**),
+* link::javadoc[Java sources files] (**.java**),
+* C/C++ source files (**.c**, **.h**, **.cpp**, **.hpp** or **.hh**)
+* LaTeX sources files (**.tex**),
+* http://maven.apache.org/doxia/references/apt-format.html[APT files (**.apt**)]
+* link::word[Word files (**.doc**)]
+* link::server[URL]
+
+
+Of course, if you use HTML, LaTeX, APT or Java/C/C++ files, you should put
+diagram descriptions into comments.
+
+
+== File naming
+
+By default, `+.png+` file have the same name as the source file used to generated them (only the extension changes).
+
+An automatic sequence is added if a source file contains several instances of `+@startXXX+`.
+
+It is possible to use a different file name for the generated file. For example:
+
+----
+@startuml image.png
+Alice->Bob: Authentication Request
+Bob-->Alice: Authentication Response
+@enduml
+----
+
+In this example, the `+.png+` file will be named `+image.png+`.
+
+(Please note that you should not use this feature with __Word__ integration.)
+
+
+
+== Include with identifier [include]
+
+You can declare some part of a file with an identifier (`+id=+`), as:
+
+Example with a file named `+file.pu+`:
+----
+@startuml(id=TAG1)
+Alice->Bob : TAG1
+@enduml
+
+@startuml(id=TAG2)
+Alice->Bob : TAG2
+@enduml
+----
+
+
+Then you can include, on one another file, one `+id+` part with `+!include !+` command:
+----
+@startuml
+!include file.pu!TAG2
+Alice->Bob : hello
+@enduml
+----
+
+The corresponding generated output will be:
+
+@startuml
+Alice->Bob : TAG2
+Alice->Bob : hello
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/4467[QA-4467]]__
+
+
+== Include with definition identifier (on the same file) [includedef]
+
+You can declare definition (`+def+`) some part on a file with an `+identifier+` between the tags `+@startdef(id=)+` and `+@enddef+`.
+
+Then you can include, on the same file, only one definition part with `+!includedef +` command.
+
+Example on a file named `+file.pu+`:
+
+@startdef(id=macro_def_id)
+Alice -> Bob : hello1
+@enddef
+
+@startuml
+!includedef macro_def_id
+Alice -> Bob : hello2
+@enduml
+
+
+Then the corresponding generated output will be `+file_001.png+`, as:
+
+@startuml
+Alice -> Bob : hello1
+Alice -> Bob : hello2
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/5769[QA-5769]]__
+
+
+== Adding options for other tools
+
+You can add options, for other tools, enclosed by `+{+` and `+}+`.
+
+Only the first (`++`) is relevant for PlantUML, the others are just skipped, and can be use by other tools.
+
+
+----
+@startuml{filename.png, This is my other caption text, width=16cm, option_for_other_tools=value}
+
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/1466[QA-1466]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/sprite.adoc b/plantuml-docs/docs_from_alphadoc/sprite.adoc
new file mode 100644
index 00000000..3dd69b3c
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/sprite.adoc
@@ -0,0 +1,218 @@
+== Defining and using sprites
+
+A __Sprite__ is a small graphic element that can be used in diagrams.
+
+In PlantUML, sprites are monochrome and can have either 4, 8 or 16 gray level.
+
+To define a sprite, you have to use a hexadecimal digit between 0 and F per pixel.
+
+Then you can use the sprite using `+<$XXX>+`
+where XXX is the name of the sprite.
+
+
+@startuml
+sprite $foo1 {
+ FFFFFFFFFFFFFFF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ FFFFFFFFFFFFFFF
+}
+Alice -> Bob : Testing <$foo1>
+@enduml
+
+
+You can scale the sprite.
+
+@startuml
+sprite $foo1 {
+ FFFFFFFFFFFFFFF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ FFFFFFFFFFFFFFF
+}
+Alice -> Bob : Testing <$foo1{scale=3}>
+@enduml
+
+
+
+
+
+
+== Inline SVG sprite
+
+You can also use inlined SVG for sprites.
+Only a tiny subset of SVG directives is possible, so you probably have to compress existing SVG files using https://vecta.io/nano[https://vecta.io/nano].
+
+
+@startuml
+sprite foo1
+
+Alice->Bob : <$foo1*3>
+@enduml
+
+
+Another example:
+
+
+@startuml
+sprite foo1
+
+Alice->Bob : <$foo1>
+
+@enduml
+
+
+
+== Changing colors
+
+Although sprites are monochrome, it's possible to change their color.
+
+
+@startuml
+sprite $foo1 {
+ FFFFFFFFFFFFFFF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ F0123456789ABCF
+ FFFFFFFFFFFFFFF
+}
+Alice -> Bob : Testing <$foo1,scale=3.4,color=orange>
+@enduml
+
+
+
+== Encoding Sprite
+
+To encode sprite, you can use the command line like:
+----
+java -jar plantuml.jar -encodesprite 16z foo.png
+----
+
+where `+foo.png+` is the image file you want to use
+(it will be converted to gray automatically).
+
+After `+-encodesprite+`, you have to specify a format:
+`+4, 8, 16, 4z, 8z+` or `+16z+`.
+
+The number indicates the gray level and the optional `+z+` is
+used to enable compression in sprite definition.
+
+
+
+== Importing Sprite
+
+You can also launch the GUI to generate a sprite from an existing image.
+
+Click in the menubar then on `+File/Open Sprite Window+`.
+
+
+After copying an image into you clipboard, several possible definitions of the corresponding sprite will be
+displayed : you will just have to pickup the one you want.
+
+
+
+
+== Examples
+
+
+
+@startuml
+sprite $printer [15x15/8z] NOtH3W0W208HxFz_kMAhj7lHWpa1XC716sz0Pq4MVPEWfBHIuxP3L6kbTcizR8tAhzaqFvXwvFfPEqm0
+start
+:click on <$printer> to print the page;
+@enduml
+
+
+
+
+
+@startuml
+ sprite $bug [15x15/16z] PKzR2i0m2BFMi15p__FEjQEqB1z27aeqCqixa8S4OT7C53cKpsHpaYPDJY_12MHM-BLRyywPhrrlw3qumqNThmXgd1TOterAZmOW8sgiJafogofWRwtV3nCF
+ sprite $printer [15x15/8z] NOtH3W0W208HxFz_kMAhj7lHWpa1XC716sz0Pq4MVPEWfBHIuxP3L6kbTcizR8tAhzaqFvXwvFfPEqm0
+ sprite $disk {
+ 444445566677881
+ 436000000009991
+ 43600000000ACA1
+ 53700000001A7A1
+ 53700000012B8A1
+ 53800000123B8A1
+ 63800001233C9A1
+ 634999AABBC99B1
+ 744566778899AB1
+ 7456AAAAA99AAB1
+ 8566AFC228AABB1
+ 8567AC8118BBBB1
+ 867BD4433BBBBB1
+ 39AAAAABBBBBBC1
+}
+
+ title Use of sprites (<$printer>, <$bug>...)
+
+ class Example {
+ Can have some bug : <$bug>
+ Click on <$disk> to save
+ }
+
+ note left : The printer <$printer> is available
+
+@enduml
+
+
+
+== StdLib
+
+The https://github.com/plantuml/plantuml-stdlib[PlantUML StdLib] includes a number of ready icons in various IT areas such as architecture, cloud services, logos etc. It including AWS, Azure, Kubernetes, C4, product Logos and many others. To explore these libraries:
+
+* Browse the Github folders of https://github.com/plantuml/plantuml-stdlib[PlantUML StdLib]
+* Browse the source repos of StdLib collections that interest you. Eg if you are interested in https://github.com/plantuml/plantuml-stdlib/tree/master/logos[logos] you can find that it came from https://github.com/rabelenda/gilbarbara-plantuml-sprites[gilbarbara-plantuml-sprites], and quickly find its
+https://github.com/rabelenda/gilbarbara-plantuml-sprites/blob/master/sprites-list.md[sprites-list]. (The next section shows how to list selected sprites but unfortunately that's in grayscale whereas this custom listing is in color.)
+* Study the in-depth https://crashedmind.github.io/PlantUMLHitchhikersGuide/index.html[Hitchhikerโs Guide to PlantUML], eg sections https://crashedmind.github.io/PlantUMLHitchhikersGuide/PlantUMLSpriteLibraries/plantuml_sprites.html#standard-library-sprites[Standard Library Sprites] and https://crashedmind.github.io/PlantUMLHitchhikersGuide/Stdlib/StdLibOverview.html[PlantUML Stdlib Overview]
+
+
+== Listing Sprites
+
+You can use the `+listsprites+` command to show available sprites:
+* Used on its own, it just shows https://plantuml.com/archimate-diagram#9a3dbeaa372bf477[ArchiMate sprites]
+* If you include some sprite libraries in your diagram, the command shows all these sprites, as explained in https://crashedmind.github.io/PlantUMLHitchhikersGuide/NetworkUsersMachines/NetworkUsersMachines.html#view-all-the-icons-with-listsprites[View all the icons with listsprites].
+
+(Example from https://crashedmind.github.io/PlantUMLHitchhikersGuide/NetworkUsersMachines/NetworkUsersMachines.html#source[Hitchhikers Guide to PlantUML])
+
+
+@startuml
+
+!define osaPuml https://raw.githubusercontent.com/Crashedmind/PlantUML-opensecurityarchitecture2-icons/master
+!include osaPuml/Common.puml
+!include osaPuml/User/all.puml
+
+listsprites
+@enduml
+
+
+Most collections have files called `+all+` that allow you to see a whole sub-collection at once.
+Else you need to find the sprites that interest you and include them one by one.
+Unfortunately, the version of a collection included in StdLib often does not have such `+all+` files,
+so as you see above we include the collection from github, not from StdLib.
+
+All sprites are in grayscale, but most collections define specific macros that include appropriate (vendor-specific) colors.
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/start.adoc b/plantuml-docs/docs_from_alphadoc/start.adoc
new file mode 100644
index 00000000..1e6df45f
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/start.adoc
@@ -0,0 +1,76 @@
+== Start
+
+We are thinking about a slightly new way of creating PlantUML documentation.
+
+Right now, this website is still under test. At some point, the existing wiki will be imported here.
+
+We have decided to support several syntaxes of wikis. Right now you can use:
+* link::syntax-dokuwiki[Dokuwiki syntax]
+* link::syntax-markdown[Markdown syntax]
+* link::syntax-asciidoc[Asciidoc syntax]
+
+And you can link::poll-about-wiki-syntax[Vote for your syntax!]
+
+Each user can really use whatever he prefers: the wiki convert user's contributions on the fly.
+
+
+== Your Help Needed!
+It's really easy for people to contribute doc additions and fixes using their favorite syntax.
+Most of the important Wanted Features
+(__initially discussed at the https://github.com/plantuml/plantuml/issues/67[plantuml Documentation project]__) are now implemented, and the PlantUML team will be adding more.
+
+So now it's time for the community to step up and to help documenting this wonderful program better!
+Here is how you can help:
+
+* Document your favorite features
+* Go through the list of https://github.com/plantuml/plantuml/issues/261[Undocumented plantuml features] or on **this wiki**, with list for follow link::undocumented[Undocumented PlantUML features in order to document] and work out some of them. It's a categorized list of 100-200 tasks that need your help
+* Post questions, issues and findings in the https://forum.plantuml.net/[forum]
+
+
+== Recommendation and Best practice
+
+* Avoid adding font styles to titles (no raw, italic or bold...)
+
+
+== Wanted Features
+
+* Fully anonymous access: you won't have to create an account to __edit__ contents [[#98FB98#DONE]]
+* Advanced SPAM protection: we use branches when people edit content, so spam contributions will not have to be cancelled, they will just be never merged and we won't even have to delete them. [[#98FB98#DONE]]
+* Automatic page creation: just go to http://alphadoc.plantuml.com/doc/en/any-page-you-want[http://alphadoc.plantuml.com/doc/en/any-page-you-want] [[#98FB98#DONE]]
+* Possibility that each contributor uses its favorite wiki syntax. [[#98FB98#DONE]]: asciidoc, dokuwiki, markdown
+* Duplication of plantuml code [[#98FB98#DONE]]: shows as source and as diagram
+* Automatic generation of PlantUML diagrams [[#98FB98#DONE]]: see next section
+* Possibility to create named user/login for serious contributors [[#FFD700#TODO]]
+* PDF generation through LaTeX [[#FFD700#TODO]]
+* Automatic consistence between translated versions [[#FFD700#TODO]]
+* Automatic synchronization with some GitHub repository [[#FFD700#TODO]]
+* Automatic TOC/site map on the alphadoc site [[#FFD700#TODO]]
+* Automatic TOC/site map on the final site (not only on this alphadoc site) [[#FFD700#TODO]]
+* Sync to/from web site [[#FFD700#TODO]]
+* Link checking [[#FFD700#TODO]] https://github.com/plantuml/plantuml/issues/361[#361]
+* Ability to Update title/desc\* [[#FFD700#TODO]] (currently gives exception https://github.com/plantuml/plantuml/issues/363[#363])
+* Use named anchors (perhaps even automatically anchor
,
,
, ... tag) so you can have stable `+#+` links within the documentation and linking from the outside [[#FFD700#TODO]]
+** For now you can use the https://chrome.google.com/webstore/detail/display-anchors/poahndpaaanbpbeafbkploiobpiiieko[Display #Anchors chrome plugin] and hand-craft links eg like "alphadoc http://alphadoc.plantuml.com/doc/markdown/en/sprite#hdvb3xdf1doekdtyqgs2[sprite#stdlib] and http://alphadoc.plantuml.com/doc/markdown/en/sprite#jq1w8ezst4vzkdtyqu8b[sprite#listing-sprites]" but it's difficult, and those machine-generated anchors aren't guaranteed to be stable
+
+
+== Demo diagrams
+
+You can use a new special tag `++` for diagrams.
+
+----
+
+@startuml
+...
+@enduml
+
+----
+
+The result is that the PlantUML source is shown, followed by the diagram:
+
+
+@startuml
+User -> Wiki : document, document, document...
+@enduml
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/starting.adoc b/plantuml-docs/docs_from_alphadoc/starting.adoc
new file mode 100644
index 00000000..414427d3
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/starting.adoc
@@ -0,0 +1,38 @@
+== PlantUML for the impatient
+
+The easiest way to test PlantUML is in an online solution that has PlantUML embedded, such as our https://www.plantuml.com/plantuml[online server].
+
+
+== Local installation
+
+After testing, you may want to link::faq-install[install PlantUML locally].
+
+You need these things to run PlantUML:
+
+* https://www.java.com/en/download/[Java]
+* link::graphviz-dot[Graphviz] (optional - you don't need this if you only need link::sequence-diagram[sequence diagrams] and link::activity-diagram-beta[activity (beta) diagrams])
+
+Installed the above? Then simply download http://sourceforge.net/projects/plantuml/files/plantuml.jar/download[plantuml.jar] and run it to open PlantUML's link::gui[graphical user interface]. There is no need to unpack or install anything.
+
+
+== Run PlantUML from the command line
+
+Use PlantUML's link::command-line[command line] syntax to link::running[include it in your own scripts or documentation tools].
+
+. Create a text file with PlantUML commands, like this example called `+sequenceDiagram.txt+`:
+
+----
+@startuml
+Alice -> Bob: test
+@enduml
+----
+
+2. Run (or have your software call) PlantUML, using `+sequenceDiagram.txt+` as input. The output is an image, which either appears in the other software, or is written to an image file on disk.+++ +++For example:
+
+----
+java -jar plantuml.jar sequenceDiagram.txt
+----
+
+This outputs your sequence diagram to a file called `+sequenceDiagram.png+`.
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/state-diagram-issues.adoc b/plantuml-docs/docs_from_alphadoc/state-diagram-issues.adoc
new file mode 100644
index 00000000..ed33fe04
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/state-diagram-issues.adoc
@@ -0,0 +1,78 @@
+== State Diagram issues (state-diagram-issues)
+
+This page lists issues on link::state-diagram[State Diagram].
+
+
+== Change state color and style (inline style) [fixed on v1.2022.6b5+]
+
+* `+#color ##[style]color+`
+
+With background color first (`+#color+`), then line style and line color (`+##[style]color+` ).
+
+
+@startuml
+state FooGradient #red-green ##00FFFF
+state FooDashed #red|green ##[dashed]blue {
+}
+state FooDotted ##[dotted]blue {
+}
+state FooBold ##[bold] {
+}
+state Foo1 ##[dotted]green {
+state inner1 ##[dotted]yellow
+}
+
+state out ##[dotted]gold
+
+state Foo2 ##[bold]green {
+state inner2 ##[dotted]yellow
+}
+inner1 -> inner2
+out -> inner2
+@enduml
+
+__[Ref. https://forum.plantuml.net/1487[QA-1487]]__
+
+
+* `+#color;line:color;line.[bold|dashed|dotted];text:color+`
+
+[[#FFD700#FIXME]] ๐ฉ
+`+text:color+` seems not to be taken into account
+[[#FFD700#FIXME]]
+
+
+@startuml
+@startuml
+state FooGradient #red-green;line:00FFFF
+state FooDashed #red|green;line.dashed;line:blue {
+}
+state FooDotted #line.dotted;line:blue {
+}
+state FooBold #line.bold {
+}
+state Foo1 #line.dotted;line:green {
+state inner1 #line.dotted;line:yellow
+}
+
+state out #line.dotted;line:gold
+
+state Foo2 #line.bold;line:green {
+state inner2 #line.dotted;line:yellow
+}
+inner1 -> inner2
+out -> inner2
+@enduml
+@enduml
+
+
+@startuml
+state s1 : s1 description
+state s2 #pink;line:red;line.bold;text:red : s2 description
+state s3 #palegreen;line:green;line.dashed;text:green : s3 description
+state s4 #aliceblue;line:blue;line.dotted;text:blue : s4 description
+@enduml
+
+
+__[Adapted from https://forum.plantuml.net/3770[QA-3770]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/state-diagram.adoc b/plantuml-docs/docs_from_alphadoc/state-diagram.adoc
new file mode 100644
index 00000000..c06def3d
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/state-diagram.adoc
@@ -0,0 +1,766 @@
+== State Diagram
+
+https://en.wikipedia.org/wiki/State_diagram[State diagrams] are used to give an abstract description of the behavior of a system. This behavior is represented as a series of events that can occur in one or more possible states.
+
+
+
+== Simple State
+You can use `+[*]+` for the starting point and ending point of
+the state diagram.
+
+Use `+-->+` for arrows.
+
+
+@startuml
+
+[*] --> State1
+State1 --> [*]
+State1 : this is a string
+State1 : this is another string
+
+State1 -> State2
+State2 --> [*]
+
+@enduml
+
+
+
+
+== Change state rendering
+
+You can use `+hide empty description+` to render state as simple box.
+
+
+@startuml
+hide empty description
+[*] --> State1
+State1 --> [*]
+State1 : this is a string
+State1 : this is another string
+
+State1 -> State2
+State2 --> [*]
+@enduml
+
+
+
+
+== Composite state
+
+
+A state can also be composite. You have to define it using the `+state+`
+keywords and brackets.
+
+=== Internal sub-state
+
+
+@startuml
+scale 350 width
+[*] --> NotShooting
+
+state NotShooting {
+ [*] --> Idle
+ Idle --> Configuring : EvConfig
+ Configuring --> Idle : EvConfig
+}
+
+state Configuring {
+ [*] --> NewValueSelection
+ NewValueSelection --> NewValuePreview : EvNewValue
+ NewValuePreview --> NewValueSelection : EvNewValueRejected
+ NewValuePreview --> NewValueSelection : EvNewValueSaved
+
+ state NewValuePreview {
+ State1 -> State2
+ }
+
+}
+@enduml
+
+
+
+=== Sub-state to sub-state
+
+
+@startuml
+state A {
+ state X {
+ }
+ state Y {
+ }
+}
+
+state B {
+ state Z {
+ }
+}
+
+X --> Z
+Z --> Y
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/3300/add-a-new-state-diagram-example[QA-3300]]__
+
+
+== Long name
+
+
+You can also use the `+state+` keyword to use long description
+for states.
+
+
+@startuml
+scale 600 width
+
+[*] -> State1
+State1 --> State2 : Succeeded
+State1 --> [*] : Aborted
+State2 --> State3 : Succeeded
+State2 --> [*] : Aborted
+state State3 {
+ state "Accumulate Enough Data\nLong State Name" as long1
+ long1 : Just a test
+ [*] --> long1
+ long1 --> long1 : New Data
+ long1 --> ProcessData : Enough Data
+}
+State3 --> State3 : Failed
+State3 --> [*] : Succeeded / Save Result
+State3 --> [*] : Aborted
+
+@enduml
+
+
+
+== History [[H], [H\*]]
+
+You can use `+[H]+` for the history and `+[H*]+` for the deep history of a substate.
+
+
+@startuml
+[*] -> State1
+State1 --> State2 : Succeeded
+State1 --> [*] : Aborted
+State2 --> State3 : Succeeded
+State2 --> [*] : Aborted
+state State3 {
+ state "Accumulate Enough Data" as long1
+ long1 : Just a test
+ [*] --> long1
+ long1 --> long1 : New Data
+ long1 --> ProcessData : Enough Data
+ State2 --> [H]: Resume
+}
+State3 --> State2 : Pause
+State2 --> State3[H*]: DeepResume
+State3 --> State3 : Failed
+State3 --> [*] : Succeeded / Save Result
+State3 --> [*] : Aborted
+@enduml
+
+
+
+== Fork [fork, join]
+
+
+You can also fork and join using the `+<>+` and `+<>+` stereotypes.
+
+
+
+@startuml
+
+state fork_state <>
+[*] --> fork_state
+fork_state --> State2
+fork_state --> State3
+
+state join_state <>
+State2 --> join_state
+State3 --> join_state
+join_state --> State4
+State4 --> [*]
+
+@enduml
+
+
+
+== Concurrent state [--, \|\|]
+
+
+You can define concurrent state into a composite state using either `+--+`
+or `+||+` symbol as separator.
+
+=== Horizontal separator `+--+`
+
+@startuml
+[*] --> Active
+
+state Active {
+ [*] -> NumLockOff
+ NumLockOff --> NumLockOn : EvNumLockPressed
+ NumLockOn --> NumLockOff : EvNumLockPressed
+ --
+ [*] -> CapsLockOff
+ CapsLockOff --> CapsLockOn : EvCapsLockPressed
+ CapsLockOn --> CapsLockOff : EvCapsLockPressed
+ --
+ [*] -> ScrollLockOff
+ ScrollLockOff --> ScrollLockOn : EvCapsLockPressed
+ ScrollLockOn --> ScrollLockOff : EvCapsLockPressed
+}
+
+@enduml
+
+
+=== Vertical separator `+||+`
+
+@startuml
+[*] --> Active
+
+state Active {
+ [*] -> NumLockOff
+ NumLockOff --> NumLockOn : EvNumLockPressed
+ NumLockOn --> NumLockOff : EvNumLockPressed
+ ||
+ [*] -> CapsLockOff
+ CapsLockOff --> CapsLockOn : EvCapsLockPressed
+ CapsLockOn --> CapsLockOff : EvCapsLockPressed
+ ||
+ [*] -> ScrollLockOff
+ ScrollLockOff --> ScrollLockOn : EvCapsLockPressed
+ ScrollLockOn --> ScrollLockOff : EvCapsLockPressed
+}
+
+@enduml
+
+
+
+== Conditional [choice]
+
+The stereotype `+<>+` can be used to use conditional state.
+
+
+@startuml
+state "Req(Id)" as ReqId <>
+state "Minor(Id)" as MinorId
+state "Major(Id)" as MajorId
+
+state c <>
+
+Idle --> ReqId
+ReqId --> c
+c --> MinorId : [Id <= 10]
+c --> MajorId : [Id > 10]
+@enduml
+
+
+
+== Stereotypes full example [start, choice, fork, join, end]
+
+
+@startuml
+state start1 <>
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+start1 --> choice1 : from start stereo\nto choice
+
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end stereo
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+
+
+__[Ref. https://forum.plantuml.net/404/choice-pseudostate?show=436#c436[QA-404], https://forum.plantuml.net/1159/choice-pseudostate-and-guard-condition-in-state-diagrams?show=1161#a1161[QA-1159] and https://github.com/plantuml/plantuml/pull/887[GH-887]]__
+
+
+== Point [entryPoint, exitPoint]
+
+You can added **point** with `+<>+` and `+<>+` stereotypes:
+
+
+@startuml
+state Somp {
+ state entry1 <>
+ state entry2 <>
+ state sin
+ entry1 --> sin
+ entry2 -> sin
+ sin -> sin2
+ sin2 --> exitA <>
+}
+
+[*] --> entry1
+exitA --> Foo
+Foo1 -> entry2
+@enduml
+
+
+
+== Pin [inputPin, outputPin]
+
+You can added **pin** with `+<>+` and `+<>+` stereotypes:
+
+
+@startuml
+state Somp {
+ state entry1 <>
+ state entry2 <>
+ state sin
+ entry1 --> sin
+ entry2 -> sin
+ sin -> sin2
+ sin2 --> exitA <>
+}
+
+[*] --> entry1
+exitA --> Foo
+Foo1 -> entry2
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/4309/entrypoints-exitpoints-expansioninput-expansionoutput[QA-4309]]__
+
+
+== Expansion [expansionInput, expansionOutput]
+
+You can added **expansion** with `+<>+` and `+<>+` stereotypes:
+
+
+@startuml
+state Somp {
+ state entry1 <>
+ state entry2 <>
+ state sin
+ entry1 --> sin
+ entry2 -> sin
+ sin -> sin2
+ sin2 --> exitA <>
+}
+
+[*] --> entry1
+exitA --> Foo
+Foo1 -> entry2
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/4309/entrypoints-exitpoints-expansioninput-expansionoutput[QA-4309]]__
+
+
+== Arrow direction
+
+You can use `+->+` for horizontal arrows. It is possible to
+force arrow's direction using the following syntax:
+* `+-down->+` or `+-->+`
+* `+-right->+` or `+->+` __(default arrow)__
+* `+-left->+`
+* `+-up->+`
+
+
+@startuml
+
+[*] -up-> First
+First -right-> Second
+Second --> Third
+Third -left-> Last
+
+@enduml
+
+You can shorten the arrow definition by using only the first character of the direction (for example, `+-d-+` instead of
+`+-down-+`)
+or the two first characters (`+-do-+`).
+
+Please note that you should not abuse this functionality : __Graphviz__ gives usually good results without tweaking.
+
+
+== Change line color and style
+
+You can change line link::color[color] and/or line style.
+
+
+@startuml
+State S1
+State S2
+S1 -[#DD00AA]-> S2
+S1 -left[#yellow]-> S3
+S1 -up[#red,dashed]-> S4
+S1 -right[dotted,#blue]-> S5
+
+X1 -[dashed]-> X2
+Z1 -[dotted]-> Z2
+Y1 -[#blue,bold]-> Y2
+@enduml
+
+
+__[Ref. http://wiki.plantuml.net/site/incubation#change_line_color_in_state_diagrams[Incubation: Change line color in state diagrams]]__
+
+
+== Note
+
+You can also define notes using
+`+note left of+`, `+note right of+`, `+note top of+`, `+note bottom of+`
+keywords.
+
+You can also define notes on several lines.
+
+@startuml
+
+[*] --> Active
+Active --> Inactive
+
+note left of Active : this is a short\nnote
+
+note right of Inactive
+ A note can also
+ be defined on
+ several lines
+end note
+
+@enduml
+
+
+
+You can also have floating notes.
+
+@startuml
+
+state foo
+note "This is a floating note" as N1
+
+@enduml
+
+
+
+
+== Note on link
+
+You can put notes on state-transition or link, with `+note on link+` keyword.
+
+
+@startuml
+[*] -> State1
+State1 --> State2
+note on link
+ this is a state-transition note
+end note
+@enduml
+
+
+
+== More in notes
+
+
+You can put notes on composite states.
+
+@startuml
+
+[*] --> NotShooting
+
+state "Not Shooting State" as NotShooting {
+ state "Idle mode" as Idle
+ state "Configuring mode" as Configuring
+ [*] --> Idle
+ Idle --> Configuring : EvConfig
+ Configuring --> Idle : EvConfig
+}
+
+note right of NotShooting : This is a note on a composite state
+
+@enduml
+
+
+
+
+== Inline color
+
+
+@startuml
+state CurrentSite #pink {
+ state HardwareSetup #lightblue {
+ state Site #brown
+ Site -[hidden]-> Controller
+ Controller -[hidden]-> Devices
+ }
+ state PresentationSetup{
+ Groups -[hidden]-> PlansAndGraphics
+ }
+ state Trends #FFFF77
+ state Schedule #magenta
+ state AlarmSupression
+}
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/1812[QA-1812]]__
+
+
+== Skinparam
+
+
+You can use the link::skinparam[skinparam] command to change colors and fonts for the drawing.
+
+You can use this command :
+* In the diagram definition, like any other commands,
+* In an link::preprocessing[included file],
+* In a configuration file, provided in the link::command-line[command line] or the link::ant-task[Ant task].
+You can define specific color and fonts for stereotyped states.
+
+
+@startuml
+skinparam backgroundColor LightYellow
+skinparam state {
+ StartColor MediumBlue
+ EndColor Red
+ BackgroundColor Peru
+ BackgroundColor<> Olive
+ BorderColor Gray
+ FontName Impact
+}
+
+[*] --> NotShooting
+
+state "Not Shooting State" as NotShooting {
+ state "Idle mode" as Idle <>
+ state "Configuring mode" as Configuring
+ [*] --> Idle
+ Idle --> Configuring : EvConfig
+ Configuring --> Idle : EvConfig
+}
+
+NotShooting --> [*]
+@enduml
+
+
+=== Test of all specific skinparam to State Diagrams
+
+@startuml
+skinparam State {
+ AttributeFontColor blue
+ AttributeFontName serif
+ AttributeFontSize 9
+ AttributeFontStyle italic
+ BackgroundColor palegreen
+ BorderColor violet
+ EndColor gold
+ FontColor red
+ FontName Sanserif
+ FontSize 15
+ FontStyle bold
+ StartColor silver
+}
+
+state A : a a a\na
+state B : b b b\nb
+
+[*] -> A : start
+A -> B : a2b
+B -> [*] : end
+@enduml
+
+
+
+== Changing style
+
+You can change link::style-evolution[style].
+
+
+@startuml
+
+
+
+
+[*] --> NotShooting
+
+state "Not Shooting State" as NotShooting {
+ state "Idle mode" as Idle <>
+ state "Configuring mode" as Configuring
+ [*] --> Idle
+ Idle --> Configuring : EvConfig
+ Configuring --> Idle : EvConfig
+}
+
+NotShooting --> [*]
+@enduml
+
+
+
+@startuml
+
+state state1
+state state2
+state choice1 <>
+state end3 <>
+
+state1 --> choice1 : 1
+choice1 --> state2 : 2
+choice1 --> end3 : 3
+@enduml
+
+__[Ref. https://github.com/plantuml/plantuml/issues/880#issuecomment-1022278138[GH-880]]__
+
+
+== Change state color and style (inline style)
+
+You can change the link::color[color] or style of individual state using the following notation:
+
+* `+#color ##[style]color+`
+
+With background color first (`+#color+`), then line style and line color (`+##[style]color+` ).
+
+
+@startuml
+state FooGradient #red-green ##00FFFF
+state FooDashed #red|green ##[dashed]blue {
+}
+state FooDotted ##[dotted]blue {
+}
+state FooBold ##[bold] {
+}
+state Foo1 ##[dotted]green {
+state inner1 ##[dotted]yellow
+}
+
+state out ##[dotted]gold
+
+state Foo2 ##[bold]green {
+state inner2 ##[dotted]yellow
+}
+inner1 -> inner2
+out -> inner2
+@enduml
+
+__[Ref. https://forum.plantuml.net/1487[QA-1487]]__
+
+
+* `+#color;line:color;line.[bold|dashed|dotted];text:color+`
+
+[[#FFD700#FIXME]] ๐ฉ
+`+text:color+` seems not to be taken into account
+[[#FFD700#FIXME]]
+
+
+@startuml
+@startuml
+state FooGradient #red-green;line:00FFFF
+state FooDashed #red|green;line.dashed;line:blue {
+}
+state FooDotted #line.dotted;line:blue {
+}
+state FooBold #line.bold {
+}
+state Foo1 #line.dotted;line:green {
+state inner1 #line.dotted;line:yellow
+}
+
+state out #line.dotted;line:gold
+
+state Foo2 #line.bold;line:green {
+state inner2 #line.dotted;line:yellow
+}
+inner1 -> inner2
+out -> inner2
+@enduml
+@enduml
+
+
+@startuml
+state s1 : s1 description
+state s2 #pink;line:red;line.bold;text:red : s2 description
+state s3 #palegreen;line:green;line.dashed;text:green : s3 description
+state s4 #aliceblue;line:blue;line.dotted;text:blue : s4 description
+@enduml
+
+
+__[Adapted from https://forum.plantuml.net/3770[QA-3770]]__
+
+
+== Alias
+
+With State you can use `+alias+`, like:
+
+
+@startuml
+state alias1
+state "alias2"
+state "long name" as alias3
+state alias4 as "long name"
+
+alias1 : ""state alias1""
+alias2 : ""state "alias2"""
+alias3 : ""state "long name" as alias3""
+alias4 : ""state alias4 as "long name"""
+
+alias1 -> alias2
+alias2 -> alias3
+alias3 -> alias4
+@enduml
+
+
+or:
+
+@startuml
+state alias1 : ""state alias1""
+state "alias2" : ""state "alias2"""
+state "long name" as alias3 : ""state "long name" as alias3""
+state alias4 as "long name" : ""state alias4 as "long name"""
+
+alias1 -> alias2
+alias2 -> alias3
+alias3 -> alias4
+@enduml
+
+
+
+== Display JSON Data on State diagram
+
+=== Simple example
+
+@startuml
+state "A" as stateA
+state "C" as stateC {
+ state B
+}
+
+json jsonJ {
+ "fruit":"Apple",
+ "size":"Large",
+ "color": ["Red", "Green"]
+}
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/17275/composite-state-functionality-with-allow_mixing?show=17287#a17287[QA-17275]]__
+
+For another example, see on link::json#wqimfur1rox7ld5sjljq[JSON page].
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/statistics-report.adoc b/plantuml-docs/docs_from_alphadoc/statistics-report.adoc
new file mode 100644
index 00000000..12c916d3
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/statistics-report.adoc
@@ -0,0 +1,76 @@
+== Enable statistics
+By default, statistics generation is __disabled__ in PlantUML. If you want to enable statistic generation, you can either:
+* Use `+-enablestats+` flag in the link::command-line[command line]
+* Use `+enablestats="true"+` setting with the link::ant-task[ANT task]
+* Globally set the environment variable `+PLANTUML_STATS+` to `+true+`
+* Call `+OptionFlags.getInstance().setEnableStats(true)+` from your Java code
+Thoses statistics are very general. The goal is to measure PlantUML usage and performance and not to spy on users.
+When statistics generation is on, a message is printed within the license to inform users about this.
+(`+@startuml/license/@enduml+`).
+
+
+
+== Statistics Report
+You can generate statistics about your PlantUML usage either at XML or HTML format.
+
+To do so, you can add `+-xmlstats+` or `+-htmlstats+` flag in the link::command-line[command line].
+A file __plantuml-stats.xml__ or __plantuml-stats.html__ will be written at the end of the process:
+
+image::stats2.png[]
+
+If you want to generate statistics on the fly (rather than at the end of the process), you can use the flag `+-realtimestats+`.
+
+There is also a `+-loopstats+` flag in the command line that continuously prints to the console statistics about diagram generations.
+This could be useful if you have some background daemon running PlantUML.
+
+Some of those options are also available with the link::ant-task[ANT task].
+
+
+== Java Integration API
+If you use PlantUML as a library, you can use the `+StatsUtils.getStats()+` methods that return a `+Stats+` object with all datas.
+
+You can retrieve it to use it as you wish.
+
+Here is a short class diagram about this API:
+
+
+@startuml
+class StatsUtil {
+{static} +Stats getStats()
+}
+interface Stats {
++StatsTable getLastSessions()
++StatsTable getCurrentSessionByDiagramType()
++StatsTable getCurrentSessionByFormat()
++StatsTable getAllByDiagramType()
++StatsTable getAllByFormat()
+}
+StatsUtil -> Stats: build
+Stats o--> "5" StatsTable: contains
+enum StatsColumn {
+SESSION_ID
+VERSION
+PARSED_COUNT
+...
+}
+interface StatsTable {
++ Collection getColumnHeaders()
++ List getLines()
+}
+StatsTable o-> StatsColumn: headers
+StatsTable *--> StatsLine: contains
+interface StatsLine {
+}
+interface StatsLine {
++Collection getColumnHeaders()
++Object getValue(StatsColumn column)
+}
+StatsLine o--> StatsColumn: headers
+@enduml
+
+
+__Implementation note:__ The storage of historical data are provided through the
+http://docs.oracle.com/javase/7/docs/technotes/guides/preferences/overview.html[Preference API].
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/stdlib.adoc b/plantuml-docs/docs_from_alphadoc/stdlib.adoc
new file mode 100644
index 00000000..a7e6e2da
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/stdlib.adoc
@@ -0,0 +1,918 @@
+== Standard Library
+
+This page explains the official Standard Library (`+stdlib+`) for PlantUML.
+This https://github.com/plantuml/plantuml-stdlib[Standard Library] is now included in official releases of PlantUML.
+Including files follows the C convention for https://en.wikipedia.org/wiki/C_standard_library["C standard library"].
+
+Contents of the https://github.com/plantuml/plantuml-stdlib[library] come from third party contributors. We thank them for their useful contribution!
+
+
+== List of Standard Library
+
+You can list standard library folders using the special diagram:
+
+
+@startuml
+stdlib
+@enduml
+
+
+It is also possible to use the command line `+java -jar plantuml.jar -stdlib+` to display the same list.
+
+Finally, you can extract the full standard library sources using `+java -jar plantuml.jar -extractstdlib+`. All files will be extracted in the folder `+stdlib+`.
+
+Sources used to build official PlantUML releases are hosted here https://github.com/plantuml/plantuml-stdlib[https://github.com/plantuml/plantuml-stdlib]. You can create Pull Request to update or add some library if you find it relevant.
+
+
+== ArchiMate [archimate]
+
+|===
+| Type | Link
+
+| `+stdlib+`
+| https://github.com/plantuml/plantuml-stdlib/tree/master/archimate[https://github.com/plantuml/plantuml-stdlib/tree/master/archimate]
+
+| `+src+`
+| https://github.com/ebbypeter/Archimate-PlantUML[https://github.com/ebbypeter/Archimate-PlantUML]
+
+| `+orig+`
+| https://en.wikipedia.org/wiki/ArchiMate[https://en.wikipedia.org/wiki/ArchiMate]
+
+|===
+
+This repository contains ArchiMate PlantUML macros and other includes for creating link::archimate-diagram[Archimate Diagrams] easily and consistantly.
+
+
+
+@startuml
+!include
+
+title Archimate Sample - Internet Browser
+
+' Elements
+Business_Object(businessObject, "A Business Object")
+Business_Process(someBusinessProcess,"Some Business Process")
+Business_Service(itSupportService, "IT Support for Business (Application Service)")
+
+Application_DataObject(dataObject, "Web Page Data \n 'on the fly'")
+Application_Function(webpageBehaviour, "Web page behaviour")
+Application_Component(ActivePartWebPage, "Active Part of the web page \n 'on the fly'")
+
+Technology_Artifact(inMemoryItem,"in memory / 'on the fly' html/javascript")
+Technology_Service(internetBrowser, "Internet Browser Generic & Plugin")
+Technology_Service(internetBrowserPlugin, "Some Internet Browser Plugin")
+Technology_Service(webServer, "Some web server")
+
+'Relationships
+Rel_Flow_Left(someBusinessProcess, businessObject, "")
+Rel_Serving_Up(itSupportService, someBusinessProcess, "")
+Rel_Specialization_Up(webpageBehaviour, itSupportService, "")
+Rel_Flow_Right(dataObject, webpageBehaviour, "")
+Rel_Specialization_Up(dataObject, businessObject, "")
+Rel_Assignment_Left(ActivePartWebPage, webpageBehaviour, "")
+Rel_Specialization_Up(inMemoryItem, dataObject, "")
+Rel_Realization_Up(inMemoryItem, ActivePartWebPage, "")
+Rel_Specialization_Right(inMemoryItem,internetBrowser, "")
+Rel_Serving_Up(internetBrowser, webpageBehaviour, "")
+Rel_Serving_Up(internetBrowserPlugin, webpageBehaviour, "")
+Rel_Aggregation_Right(internetBrowser, internetBrowserPlugin, "")
+Rel_Access_Up(webServer, inMemoryItem, "")
+Rel_Serving_Up(webServer, internetBrowser, "")
+@enduml
+
+
+=== List possible sprites
+
+You can list all possible link::sprite[sprites] for Archimate using the following diagram:
+
+
+@startuml
+listsprite
+@enduml
+
+
+
+== Amazon Labs AWS Library [awslib]
+
+|===
+| Type | Link
+
+| `+stdlib+`
+| https://github.com/plantuml/plantuml-stdlib/tree/master/awslib[https://github.com/plantuml/plantuml-stdlib/tree/master/awslib]
+
+| `+src+`
+| https://github.com/awslabs/aws-icons-for-plantuml[https://github.com/awslabs/aws-icons-for-plantuml]
+
+| `+orig+`
+| https://aws.amazon.com/en/architecture/icons/[https://aws.amazon.com/en/architecture/icons/]
+
+|===
+
+The Amazon Labs AWS library provides PlantUML sprites, macros, and other includes for Amazon Web Services (AWS) services and resources.
+
+Used to create PlantUML diagrams with AWS components. All elements are generated from the official https://aws.amazon.com/fr/architecture/icons/[AWS Architecture Icons] and when combined with PlantUML and the https://c4model.com/[C4 model], are a great way to communicate your design, deployment, and topology as code.
+
+
+
+----
+@startuml
+!include
+!include
+!include
+!include
+
+left to right direction
+
+agent "Published Event" as event #fff
+
+IoTRule(iotRule, "Action Error Rule", "error if Kinesis fails")
+KinesisDataStreams(eventStream, "IoT Events", "2 shards")
+SimpleQueueService(errorQueue, "Rule Error Queue", "failed Rule actions")
+
+event --> iotRule : JSON message
+iotRule --> eventStream : messages
+iotRule --> errorQueue : Failed action message
+@enduml
+----
+
+[plantuml]
+----
+@startuml
+!include
+!include
+!include
+!include
+
+left to right direction
+
+agent "Published Event" as event #fff
+
+IoTRule(iotRule, "Action Error Rule", "error if Kinesis fails")
+KinesisDataStreams(eventStream, "IoT Events", "2 shards")
+SimpleQueueService(errorQueue, "Rule Error Queue", "failed Rule actions")
+
+event --> iotRule : JSON message
+iotRule --> eventStream : messages
+iotRule --> errorQueue : Failed action message
+@enduml
+----
+
+
+== Azure library [azure]
+
+|===
+| Type | Link
+
+| `+stdlib+`
+| https://github.com/plantuml/plantuml-stdlib/tree/master/azure[https://github.com/plantuml/plantuml-stdlib/tree/master/azure]
+
+| `+src+`
+| https://github.com/RicardoNiepel/Azure-PlantUML/[https://github.com/RicardoNiepel/Azure-PlantUML/]
+
+| `+orig+`
+| https://docs.microsoft.com/en-us/azure/architecture/icons/[Microsoft Azure]
+
+|===
+
+The Azure library consists of https://docs.microsoft.com/en-us/azure/architecture/icons/[Microsoft Azure] icons.
+
+Use it by including the file that contains the sprite, eg: `+!include +`.
+When imported, you can use the sprite as normally you would, using `+<$sprite_name>+`.
+
+You may also include the `+AzureCommon.puml+` file, eg: `+!include +`, which contains helper macros defined.
+With the `+AzureCommon.puml+` imported, you can use the `+NAME_OF_SPRITE(parameters...)+` macro.
+
+Example of usage:
+
+
+@startuml
+!include
+!include
+!include
+!include
+
+left to right direction
+
+agent "Device Simulator" as devices #fff
+
+AzureEventHub(fareDataEventHub, "Fare Data", "PK: Medallion HackLicense VendorId; 3 TUs")
+AzureEventHub(tripDataEventHub, "Trip Data", "PK: Medallion HackLicense VendorId; 3 TUs")
+AzureStreamAnalytics(streamAnalytics, "Stream Processing", "6 SUs")
+AzureCosmosDb(outputCosmosDb, "Output Database", "1,000 RUs")
+
+devices --> fareDataEventHub
+devices --> tripDataEventHub
+fareDataEventHub --> streamAnalytics
+tripDataEventHub --> streamAnalytics
+streamAnalytics --> outputCosmosDb
+@enduml
+
+
+
+== C4 Library [C4]
+
+|===
+| Type | Link
+
+| `+stdlib+`
+| https://github.com/plantuml/plantuml-stdlib/tree/master/C4[https://github.com/plantuml/plantuml-stdlib/tree/master/C4]
+
+| `+src+`
+| https://github.com/plantuml-stdlib/C4-PlantUML[https://github.com/plantuml-stdlib/C4-PlantUML]
+
+| `+orig+`
+| https://en.wikipedia.org/wiki/C4_model[https://en.wikipedia.org/wiki/C4\_model]+++ +++ https://c4model.com[https://c4model.com]
+
+|===
+
+
+
+@startuml
+!include
+
+Person(personAlias, "Label", "Optional Description")
+Container(containerAlias, "Label", "Technology", "Optional Description")
+System(systemAlias, "Label", "Optional Description")
+
+System_Ext(extSystemAlias, "Label", "Optional Description")
+
+Rel(personAlias, containerAlias, "Label", "Optional Technology")
+
+Rel_U(systemAlias, extSystemAlias, "Label", "Optional Technology")
+@enduml
+
+
+
+== Cloud Insight [cloudinsight]
+
+|===
+| Type | Link
+
+| `+stdlib+`
+| https://github.com/plantuml/plantuml-stdlib/tree/master/cloudinsight[https://github.com/plantuml/plantuml-stdlib/tree/master/cloudinsight]
+
+| `+src+`
+| https://github.com/rabelenda/cicon-plantuml-sprites[https://github.com/rabelenda/cicon-plantuml-sprites]
+
+| `+orig+`
+| https://github.com/cloudinsight/cicon[Cloudinsight icons]
+
+|===
+
+This repository contains PlantUML sprites generated from https://github.com/cloudinsight/cicon[Cloudinsight icons], which can easily be used in PlantUML diagrams for nice visual representation of popular technologies.
+
+
+@startuml
+!include
+!include
+!include
+!include
+
+title Cloudinsight sprites example
+
+skinparam monochrome true
+
+rectangle "<$tomcat>\nwebapp" as webapp
+queue "<$kafka>" as kafka
+rectangle "<$java>\ndaemon" as daemon
+database "<$cassandra>" as cassandra
+
+webapp -> kafka
+kafka -> daemon
+daemon --> cassandra
+@enduml
+
+
+
+== Cloudogu [cloudogu]
+
+|===
+| Type | Link
+
+| `+stdlib+`
+| https://github.com/plantuml/plantuml-stdlib/tree/master/cloudogu[https://github.com/plantuml/plantuml-stdlib/tree/master/cloudogu]
+
+| `+src+`
+| https://github.com/cloudogu/plantuml-cloudogu-sprites[https://github.com/cloudogu/plantuml-cloudogu-sprites]
+
+| `+orig+`
+| https://cloudogu.com[https://cloudogu.com]
+
+|===
+
+The Cloudogu library provides PlantUML sprites, macros, and other includes for Cloudogu services and resources.
+
+
+@startuml
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+
+node "Cloudogu Ecosystem" <<$cloudogu>> {
+ DOGU_JENKINS(jenkins, Jenkins) #ffffff
+ DOGU_SCM(scm, SCM-Manager) #ffffff
+ DOGU_SMEAGOL(smeagol, Smeagol) #ffffff
+ DOGU_NEXUS(nexus,Nexus) #ffffff
+}
+
+TOOL_K8S(k8s, Kubernetes) #ffffff
+
+actor developer
+
+developer --> smeagol : "Edit Slides"
+smeagol -> scm : Push
+scm -> jenkins : Trigger
+jenkins -> nexus : Deploy
+jenkins --> k8s : Deploy
+@enduml
+
+
+**All cloudogu sprites**
+
+See all possible cloudogu sprites on https://github.com/cloudogu/plantuml-cloudogu-sprites[plantuml-cloudogu-sprites].
+
+
+== Elastic library [elastic]
+
+|===
+| Type | Link
+
+| `+stdlib+`
+| https://github.com/plantuml/plantuml-stdlib/tree/master/elastic[https://github.com/plantuml/plantuml-stdlib/tree/master/elastic]
+
+| `+src+`
+| https://github.com/Crashedmind/PlantUML-Elastic-icons[https://github.com/Crashedmind/PlantUML-Elastic-icons]
+
+| `+orig+`
+| https://www.elastic.co[Elastic]
+
+|===
+
+The Elastic library consists of https://www.elastic.co[Elastic] icons.
+It is similar in use to the AWS and Azure libraries (it used the same tool to create them).
+
+Use it by including the file that contains the sprite, eg: `+!include elastic/elastic_search/elastic_search>+`.
+When imported, you can use the sprite as normally you would, using `+<$sprite_name>+`.
+
+You may also include the `+common.puml+` file, eg: `+!include +`, which contains helper macros defined.
+With the `+common.puml+` imported, you can use the `+NAME//OF//SPRITE(parameters...)+` macro.
+
+Example of usage:
+
+@startuml
+!include
+!include
+!include
+!include
+
+ELASTICSEARCH(ElasticSearch, "Search and Analyze",database)
+LOGSTASH(Logstash, "Parse and Transform",node)
+KIBANA(Kibana, "Visualize",agent)
+
+Logstash -right-> ElasticSearch: Transformed Data
+ElasticSearch -right-> Kibana: Data to View
+@enduml
+
+
+**All Elastic Sprite Set**
+
+
+@startuml
+'Adapted from https://github.com/Crashedmind/PlantUML-Elastic-icons/blob/master/All.puml
+
+'Elastic stuff here
+'================================
+
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+' Beware of the difference between Crashedmind and plantuml-stdlib version: with '_' usage!
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+
+skinparam agentBackgroundColor White
+
+APM(apm)
+APP_SEARCH(app_search)
+BEATS(beats)
+CLOUD(cloud)
+CLOUD_IN_KUBERNETES(cloud_in_kubernetes)
+CODE_SEARCH(code_search)
+ECE(ece)
+ECK(eck)
+ELASTICSEARCH(elastic_search)
+ENDPOINT(endpoint)
+ENTERPRISE_SEARCH(enterprise_search)
+KIBANA(kibana)
+LOGGING(logging)
+LOGSTASH(logstash)
+MAPS(maps)
+METRICS(metrics)
+SIEM(siem)
+SITE_SEARCH(site_search)
+STACK(stack)
+UPTIME(uptime)
+@enduml
+
+
+
+== Google Material Icons [material]
+
+|===
+| Type | Link
+
+| `+stdlib+`
+| https://github.com/plantuml/plantuml-stdlib/tree/master/material[https://github.com/plantuml/plantuml-stdlib/tree/master/material]
+
+| `+src+`
+| https://github.com/Templarian/MaterialDesign[https://github.com/Templarian/MaterialDesign]
+
+| `+orig+`
+| https://materialdesignicons.com[Material Design Icons]
+
+|===
+
+This library consists of a free Material style icons from Google and other artists.
+
+Use it by including the file that contains the sprite, eg: `+!include +`.
+When imported, you can use the sprite as normally you would, using `+<$ma_sprite_name>+`.
+Notice that this library requires an `+ma_+` prefix on sprites names, this is to avoid clash of names if multiple sprites have the same name on different libraries.
+
+You may also include the `+common.puml+` file, eg: `+!include +`, which contains helper macros defined.
+With the `+common.puml+` imported, you can use the `+MA_NAME_OF_SPRITE(parameters...)+` macro, note again the use of the prefix `+MA_+`.
+
+Example of usage:
+
+
+@startuml
+!include
+' To import the sprite file you DON'T need to place a prefix!
+!include
+
+MA_FOLDER_MOVE(Red, 1, dir, rectangle, "A label")
+@enduml
+
+
+**Notes:**
+
+When mixing sprites macros with other elements you may get a syntax error if, for example, trying to add a rectangle along with classes.
+In those cases, add `+{+` and `+}+` after the macro to create the empty rectangle.
+
+Example of usage:
+
+
+@startuml
+!include
+' To import the sprite file you DON'T need to place a prefix!
+!include
+
+MA_FOLDER_MOVE(Red, 1, dir, rectangle, "A label") {
+}
+
+class foo {
+ bar
+}
+@enduml
+
+
+
+== Kubernetes [kubernetes]
+
+|===
+| Type | Link
+
+| `+stdlib+`
+| https://github.com/plantuml/plantuml-stdlib/tree/master/kubernetes[https://github.com/plantuml/plantuml-stdlib/tree/master/kubernetes]
+
+| `+src+`
+| https://github.com/michiel/plantuml-kubernetes-sprites[https://github.com/michiel/plantuml-kubernetes-sprites]
+
+| `+orig+`
+| https://en.wikipedia.org/wiki/Kubernetes[Kubernetes]
+
+|===
+
+
+@startuml
+!include
+package "Infrastructure" {
+ component "<$master>\nmaster" as master
+ component "<$etcd>\netcd" as etcd
+ component "<$node>\nnode" as node
+}
+@enduml
+
+
+
+== Logos [logos]
+
+|===
+| Type | Link
+
+| `+stdlib+`
+| https://github.com/plantuml/plantuml-stdlib/tree/master/logos[https://github.com/plantuml/plantuml-stdlib/tree/master/logos]
+
+| `+src+`
+| https://github.com/plantuml-stdlib/gilbarbara-plantuml-sprites[https://github.com/plantuml-stdlib/gilbarbara-plantuml-sprites]
+
+| `+orig+`
+| https://github.com/gilbarbara/logos[Gil Barbara's logos]
+
+|===
+
+
+This repository contains PlantUML sprites generated from https://github.com/gilbarbara/logos[Gil Barbara's logos], which can easily be used in PlantUML diagrams for nice visual aid.
+
+
+@startuml
+!include
+!include
+!include
+!include
+
+title Gil Barbara's logos example
+
+skinparam monochrome true
+
+rectangle "<$flask>\nwebapp" as webapp
+queue "<$kafka>" as kafka
+rectangle "<$kotlin>\ndaemon" as daemon
+database "<$cassandra>" as cassandra
+
+webapp -> kafka
+kafka -> daemon
+daemon --> cassandra
+@enduml
+
+
+
+@startuml
+scale 0.7
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+' ...
+
+title Gil Barbara's logos example - **Payment Scheme**
+
+actor customer
+rectangle "<$apple-pay>" as ap
+rectangle "<$dinersclub>" as dc
+rectangle "<$discover>" as d
+rectangle "<$google-pay>" as gp
+rectangle "<$jcb>" as j
+rectangle "<$maestro>" as ma
+rectangle "<$mastercard>" as m
+rectangle "<$paypal>" as p
+rectangle "<$unionpay>" as up
+rectangle "<$visa>" as v
+rectangle "<$visaelectron>" as ve
+rectangle "..." as etc
+
+customer --> ap
+customer ---> dc
+customer --> d
+customer ---> gp
+customer --> j
+customer ---> ma
+customer --> m
+customer ---> p
+customer --> up
+customer ---> v
+customer --> ve
+customer ---> etc
+@enduml
+
+
+
+== Office [office]
+
+|===
+| Type | Link
+
+| `+stdlib+`
+| https://github.com/plantuml/plantuml-stdlib/tree/master/office[https://github.com/plantuml/plantuml-stdlib/tree/master/office]
+
+| `+src+`
+| https://github.com/Roemer/plantuml-office[https://github.com/Roemer/plantuml-office]
+
+| `+orig+`
+|
+
+|===
+
+There are sprites (\*.puml) and colored png icons available. Be aware that the sprites are all only monochrome even if they have a color in their name (due to automatically generating the files). You can either color the sprites with the macro (see examples below) or directly use the fully colored pngs. See the following examples on how to use the sprites, the pngs and the macros.
+
+Example of usage:
+
+
+@startuml
+!include
+
+!include
+!include
+!include
+!include
+
+title Office Icons Example
+
+package "Sprites" {
+ OFF_DATABASE_SERVER(db,DB)
+ OFF_APPLICATION_SERVER(app,App-Server)
+ OFF_FIREWALL_ORANGE(fw,Firewall)
+ OFF_CLOUD_DISASTER_RED(cloud,Cloud)
+ db <-> app
+ app <--> fw
+ fw <.left.> cloud
+}
+@enduml
+
+
+
+
+@startuml
+!include
+
+!include
+!include
+!include
+!include
+
+' Used to center the label under the images
+skinparam defaultTextAlignment center
+
+title Extended Office Icons Example
+
+package "Use sprite directly" {
+ [Some <$cloud_disaster_red> object]
+}
+
+package "Different macro usages" {
+ OFF_CLOUD_DISASTER_RED(cloud1)
+ OFF_CLOUD_DISASTER_RED(cloud2,Default with text)
+ OFF_CLOUD_DISASTER_RED(cloud3,Other shape,Folder)
+ OFF_CLOUD_DISASTER_RED(cloud4,Even another shape,Database)
+ OFF_CLOUD_DISASTER_RED(cloud5,Colored,Rectangle, red)
+ OFF_CLOUD_DISASTER_RED(cloud6,Colored background) #red
+}
+@enduml
+
+
+
+== Open Security Architecture (OSA) [osa]
+
+|===
+| Type | Link
+
+| `+stdlib+`
+| https://github.com/plantuml/plantuml-stdlib/tree/master/osa[https://github.com/plantuml/plantuml-stdlib/tree/master/osa]
+
+| `+src+`
+| https://github.com/Crashedmind/PlantUML-opensecurityarchitecture-icons[https://github.com/Crashedmind/PlantUML-opensecurityarchitecture-icons]+++ +++ https://github.com/Crashedmind/PlantUML-opensecurityarchitecture2-icons[https://github.com/Crashedmind/PlantUML-opensecurityarchitecture2-icons]
+
+| `+orig+`
+| https://www.opensecurityarchitecture.org[https://www.opensecurityarchitecture.org]
+
+|===
+
+
+
+@startuml
+'Adapted from https://github.com/Crashedmind/PlantUML-opensecurityarchitecture-icons/blob/master/all
+scale .5
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+
+rectangle "OSA" {
+rectangle "Left:\n <$left>"
+rectangle "Right:\n <$right>"
+rectangle "Awareness:\n <$awareness>"
+rectangle "Contract:\n <$contract>"
+rectangle "Database:\n <$database>"
+rectangle "Desktop:\n <$desktop>"
+rectangle "Imac:\n <$imac>"
+rectangle "Device_music:\n <$device_music>"
+rectangle "Device_scanner:\n <$device_scanner>"
+rectangle "Device_usb:\n <$device_usb>"
+rectangle "Device_wireless_router:\n <$device_wireless_router>"
+rectangle "Disposal:\n <$disposal>"
+rectangle "Drive_optical:\n <$drive_optical>"
+rectangle "Firewall:\n <$firewall>"
+rectangle "Hub:\n <$hub>"
+rectangle "Drive:\n <$drive>"
+rectangle "Plc:\n <$plc>"
+rectangle "Thermometer:\n <$thermometer>"
+rectangle "Card:\n <$card>"
+rectangle "Laptop:\n <$laptop>"
+rectangle "Lifecycle:\n <$lifecycle>"
+rectangle "Lightning:\n <$lightning>"
+rectangle "Media_flash:\n <$media_flash>"
+rectangle "Media_optical:\n <$media_optical>"
+rectangle "Media_tape:\n <$media_tape>"
+rectangle "Pda:\n <$pda>"
+rectangle "Padlock:\n <$padlock>"
+rectangle "Printer:\n <$printer>"
+rectangle "Site_branch:\n <$site_branch>"
+rectangle "Site_factory:\n <$site_factory>"
+rectangle "Vpn:\n <$vpn>"
+rectangle "Network:\n <$network>"
+}
+@enduml
+
+
+
+@startuml
+scale .5
+!include
+'beware of 'hat-sprite'
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+!include
+
+listsprites
+@enduml
+
+
+
+== Tupadr3 library [tupadr3]
+
+|===
+| Type | Link
+
+| `+stdlib+`
+| https://github.com/plantuml/plantuml-stdlib/tree/master/tupadr3[https://github.com/plantuml/plantuml-stdlib/tree/master/tupadr3]
+
+| `+src+`
+| https://github.com/tupadr3/plantuml-icon-font-sprites[https://github.com/tupadr3/plantuml-icon-font-sprites]
+
+| `+orig+`
+| https://github.com/tupadr3/plantuml-icon-font-sprites#icon-sets[https://github.com/tupadr3/plantuml-icon-font-sprites#icon-sets]
+
+|===
+
+This library contains several libraries of icons (including Devicons and Font Awesome).
+
+Use it by including the file that contains the sprite, eg: `+!include +`.
+When imported, you can use the sprite as normally you would, using `+<$sprite_name>+`.
+
+You may also include the `+common.puml+` file, eg: `+!include +`, which contains helper macros defined.
+With the `+common.puml+` imported, you can use the `+NAME_OF_SPRITE(parameters...)+` macro.
+
+Example of usage:
+
+
+@startuml
+!include
+!include
+!include
+
+title Styling example
+
+FA_SERVER(web1,web1) #Green
+FA_SERVER(web2,web2) #Yellow
+FA_SERVER(web3,web3) #Blue
+FA_SERVER(web4,web4) #YellowGreen
+
+FA_DATABASE(db1,LIVE,database,white) #RoyalBlue
+FA_DATABASE(db2,SPARE,database) #Red
+
+db1 <--> db2
+
+web1 <--> db1
+web2 <--> db1
+web3 <--> db1
+web4 <--> db1
+@enduml
+
+
+
+
+@startuml
+!include
+!include
+
+DEV_MYSQL(db1)
+DEV_MYSQL(db2,label of db2)
+DEV_MYSQL(db3,label of db3,database)
+DEV_MYSQL(db4,label of db4,database,red) #DeepSkyBlue
+@enduml
+
+
+
+== AWS library [aws]
+
+|===
+| Type | Link
+
+| `+stdlib+`
+| https://github.com/plantuml/plantuml-stdlib/tree/master/aws[https://github.com/plantuml/plantuml-stdlib/tree/master/aws]
+
+| `+src+`
+| https://github.com/milo-minderbinder/AWS-PlantUML[https://github.com/milo-minderbinder/AWS-PlantUML]
+
+| `+orig+`
+| https://aws.amazon.com/en/architecture/icons/[https://aws.amazon.com/en/architecture/icons/]
+
+|===
+
+**Warning: We are thinking about deprecating this library. **
+
+So you should probably use `++` instead (see above).
+
+'''
+
+
+The AWS library consists of Amazon AWS icons, it provides icons of two different sizes (normal and large).
+
+Use it by including the file that contains the sprite, eg: `+!include +`.
+When imported, you can use the sprite as normally you would, using `+<$sprite_name>+`.
+
+You may also include the `+common.puml+` file, eg: `+!include +`, which contains helper macros defined.
+With the `+common.puml+` imported, you can use the `+NAME_OF_SPRITE(parameters...)+` macro.
+
+Example of usage:
+
+
+@startuml
+!include
+!include
+
+AMAZONS3(s3_internal)
+AMAZONS3(s3_partner,"Vendor's S3")
+s3_internal <- s3_partner
+@enduml
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/steve.adoc b/plantuml-docs/docs_from_alphadoc/steve.adoc
new file mode 100644
index 00000000..ad2da27a
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/steve.adoc
@@ -0,0 +1,12 @@
+== Steve Jobs, 1955 - 2011
+
+A special command dedicated to http://en.wikipedia.org/wiki/Steve_Jobs[Steve Jobs] and
+http://en.wikipedia.org/wiki/Steve_Wozniak[Steve Wozniak].
+
+@startuml
+apple II
+@enduml
+
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/style-evolution-history.adoc b/plantuml-docs/docs_from_alphadoc/style-evolution-history.adoc
new file mode 100644
index 00000000..a8b5ee56
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/style-evolution-history.adoc
@@ -0,0 +1,1248 @@
+== Elements that can be styled
+
+
+Here is a simplified list of __some__ of the element types, especially those that have built-in "default" styles.
+
+> This will need to be expanded to show the proper hierarchy, and which elements are supported for styling.
+
+
+|===
+| Element | in which diagram type ? | Hardcoded styles used
+
+| Actor
+| SequenceDiagram
+| `+root, element, sequenceDiagram, actor+`
+
+| Stereotype of Actor
+| SequenceDiagram
+| `+root, element, sequenceDiagram, actor, stereotype+`
+
+| Boundary
+| SequenceDiagram
+| `+root, element, sequenceDiagram, boundary+`
+
+| Stereotype of Boundary
+| SequenceDiagram
+| `+root, element, sequenceDiagram, boundary, stereotype+`
+
+| messages
+| SequenceDiagram
+| `+root, element, sequenceDiagram, message+`
+
+| Actor
+| ComponentDiagram
+| `+root, element, componentDiagram, actor+`
+
+| Stereotype of Actor
+| ComponentDiagram
+| `+root, element, componentDiagram, actor, stereotype+`
+
+| Boundary
+| ComponentDiagram
+| `+root, element, componentDiagram, boundary+`
+
+| Stereotype of Boundary
+| ComponentDiagram
+| `+root, element, componentDiagram, boundary, stereotype+`
+
+| Title
+| SequenceDiagram
+| `+root, sequenceDiagram, title+`
+
+| Title
+| ComponentDiagram
+| `+root, componentDiagram, title+`
+
+| Title
+| ClassDiagram
+| `+root, classDiagram, title+`
+
+| Footer
+| SequenceDiagram
+| `+root, sequenceDiagram, footer+`
+
+| Footer
+| ComponentDiagram
+| `+root, componentDiagram, footer+`
+
+| Footer
+| ClassDiagram
+| `+root, classDiagram, footer+`
+
+|===
+
+(We use `+classDiagram+` because later we will need `+class+` which will only apply to actual UML `+class+` entities.)
+
+> Note that Title, Footer, and Caption are not __real__ UML elements, and will be dealt with differently.
+
+
+
+
+== Older model and discussion (history)
+
+
+
+== Targeting Specific Diagram Element
+
+We have to define how we apply style so a specific element of a UML diagram (for example, only for participant Bob or for a specific message between Alice and Bob).
+
+To me, some style can be defined, but the style definition should not mention the specific element (otherwise it means that the style definition is specific to one diagram).
+
+I know that this is different from what CSS allows.
+
+
+
+== Option 3
+
+In **Option 3** proposal, styles cannot inherit from each other. However, each element can have several styles (like in CSS) and there are a mecanism based on priority to solve multiple inheritance issues in property value.
+
+Let's first focus on some elements (actor, boundary which can be used in several diagram type).
+
+
+If you want use blue color for text everywhere:
+
+
+@startuml
+skinparam useBetaStyle true
+title Styling example
+
+Alice -> Bob : hello
+@enduml
+
+
+@startuml
+skinparam useBetaStyle true
+title Styling example
+
+Alice -> Bob : hello
+@enduml
+
+Internally, there is a "plantuml.skin" file stored in the plantuml.jar library that store all settings (so no more hardcoded value in the code). The previous example only overrides the fontcolor of the root style.
+
+So now, imagine that you want all UML elements (so not for title, footer...) in green:
+
+
+@startuml
+skinparam useBetaStyle true
+title Styling example
+
+Alice -> Bob : hello
+@enduml
+
+
+@startuml
+skinparam useBetaStyle true
+title Styling example
+
+Alice -> Bob : hello
+@enduml
+
+The order of declaration is important: since "element" is defined after "root", the priority of green setting is higher than the priority of blue setting.
+
+Now, you want also all actor printed in red:
+
+
+@startuml
+skinparam useBetaStyle true
+title Styling example
+
+actor Alice
+Alice -> Bob : hello
+@enduml
+
+
+
+@startuml
+skinparam useBetaStyle true
+title Styling example
+
+actor Alice
+Alice -> Bob : hello
+@enduml
+
+Now, you want also sequence diagrams printed in purple:
+
+
+@startuml
+skinparam useBetaStyle true
+title Styling example
+
+' In that case, actor from sequence diagrams will be in purple, because purple is defined after red.
+actor Alice
+Alice -> Bob : hello
+@enduml
+
+
+
+@startuml
+skinparam useBetaStyle true
+title Styling example
+
+' In that case, actor from sequence diagrams will be in purple, because purple is defined after red.
+actor Alice
+Alice -> Bob : hello
+@enduml
+
+
+
+@startuml
+skinparam useBetaStyle true
+title Styling example
+
+actor Alice
+Alice -> Bob : hello
+@enduml
+
+
+Changing the order definition will only change the color of actor in sequence diagram:
+
+@startuml
+skinparam useBetaStyle true
+title Styling example
+
+' In that case, actor from sequence diagrams will be in red, because red is defined after purple.
+actor Alice
+Alice -> Bob : hello
+@enduml
+
+
+
+@startuml
+skinparam useBetaStyle true
+title Styling example
+
+' In that case, actor from sequence diagrams will be in red, because red is defined after purple.
+actor Alice
+Alice -> Bob : hello
+@enduml
+
+
+Finally, there is also a way to change a setting for a element which have two or more precise styles:
+
+
+@startuml
+skinparam useBetaStyle true
+title Styling example
+
+' In that case, only actor from sequence diagram are printed in blue.
+' Actors in other diagram and other sequence element are unchanged.
+actor Alice
+Alice -> Bob : hello
+@enduml
+
+
+
+@startuml
+skinparam useBetaStyle true
+title Styling example
+
+' In that case, only actor from sequence diagram are printed in blue.
+' Actors in other diagram and other sequence element are unchanged.
+actor Alice
+Alice -> Bob : hello
+@enduml
+
+
+You can also defined your own style. In that case, they could be used when needed with the stererotype notation :
+----
+@startuml
+
+
+participant Bob
+actor Alice <>
+'In that case Alice with use the style "root, element, sequence, actor, MorePadding"
+participant Sally
+
+Bob->Alice: Hello
+Alice->Sally: Also Hello! <>
+' This is new: you can use stereotype on message
+@enduml
+----
+
+Here is another example:
+
+
+@startuml
+
+
+participant Bob
+actor Alice
+participant Sally
+
+Bob->Alice: Hello <>
+Alice->Sally: Also Hello!
+@enduml
+
+
+@startuml
+
+participant Bob
+actor Alice
+participant Sally
+
+Bob->Alice: Hello <>
+Alice->Sally: Also Hello!
+@enduml
+
+Unfortunately here, you have to manually set `+<>+`.
+
+
+== Varying style
+
+There is another limitation of current skinparam features: the parameter are defined once along the diagram and you cannot change values across the diagram.
+
+The idea here is to allow a style to be different in some context (for example a package) or to change over the execution of the diagram.
+
+For example:
+
+
+@startuml
+skinparam useBetaStyle true
+style message {
+ FontColor blue
+}
+Alice -> Bob : this is printed in blue
+style message {
+ FontColor red
+}
+Alice -> Bob : this is printed in red
+@enduml
+
+
+Or in some usecase diagram:
+
+----
+@startuml
+style actor {
+ FontColor blue
+}
+'foo1 is printed in blue
+actor foo1
+
+package myPackage {
+' Style modification in this package are local
+ style actor {
+ FontColor red
+ }
+ 'foo2 is printed in red
+ actor foo2
+}
+
+' We left the package, so we're back to previous style definition
+'foo3 is also printed in blue
+actor foo3
+@enduml
+----
+
+
+
+
+== Mixing style and stereotype
+
+Styles and stereotypes are going to be very close notions.
+
+Stereotypes could be defined as style to change colors, font...
+The only difference is that a stereotype is printed on diagrams using standard UML notation while a style is never printed on diagrams. So styles and stereotypes affect rendering in the same way.
+
+For example, you can have:
+
+
+@startuml
+skinparam useBetaStyle true
+stereotype foo1 {
+ FontColor green
+}
+style dummy1 {
+ FontColor red
+}
+
+participant Alice <>
+participant Bob <>
+@enduml
+
+
+Alice is going to be printed in green and Bob in red. However, `+<>+` is going to be printed on the diagram while you won't see any `+dummy1+` string.
+
+Now, since stereotype are printed, you can change stereotype colors using a style named `+stereotype+`
+
+
+@startuml
+skinparam useBetaStyle true
+stereotype foo1 {
+ FontColor red
+}
+style stereotype {
+ FontColor green
+}
+participant Bob <>
+@enduml
+
+
+So `+Bob+` is going to be printed in red and `+<>+` is going to be printed in green.
+
+Now you can also do complex stuff:
+
+
+@startuml
+skinparam useBetaStyle true
+style dummy1 {
+ FontColor purple
+ FontStyle bold
+ BackgroundColor white
+}
+
+stereotype foo3 {
+ FontColor blue
+ FontStyle bold
+}
+
+style stereotype {
+ FontColor green
+ FontSize 8
+}
+
+style stereotype+foo3 {
+ FontSize 24
+ FontColor red
+}
+
+participant Bob <>
+actor Alice <>
+actor Charlie <>
+actor David <>
+@enduml
+
+
+
+
+== Potential Use Extensions
+
+[KJW]Have style Parameters equivalent to Skin Parameters applied conditionally
+----
+!function formatConnection($sequenceArrowThickness, $from, $to, $protocol)
+
+ $from<<->>$to : $protocol
+
+!endfunction
+----
+box "AWS " #LightBlue
+----
+participant "aPlatform" as ap
+----
+
+end box
+
+box "External" #Lightgreen
+----
+participant "EXternal API" as extapi
+participant ""EXternal Service" as exts
+----
+end box
+
+
+
+formatConnection("2", "ap", "extapi","<< MA-TLS >>")
+
+OR
+
+ap<<->>extapi : << MA-TLS >>
+
+Result is only this sequence line is 2 the rest are the default 1
+
+
+
+== plantuml.skin file
+
+This is the default file used by PlantUML.
+Users will be able to modify this file or to create their own foo.skin file.
+
+----
+style root {
+ FontName SansSerif
+ HyperLinkColor red
+ FontColor black
+ FontSize 14
+ FontStyle plain
+ HorizontalAlignment left
+ RoundCorner 0
+ DiagonalCorner 0
+ LineThickness 1.0
+ LineColor #A80036
+ BackGroundColor #FEFECE
+ Shadowing 0.0
+}
+
+style stereotype {
+ FontStyle italic
+}
+
+style title {
+ HorizontalAlignment center
+ FontSize 14
+ FontStyle bold
+ Padding 0
+ Margin 4
+ LineColor none
+ BackGroundColor none
+}
+
+style header {
+ HorizontalAlignment center
+ FontSize 10
+ FontColor #888888
+}
+
+style footer {
+ HorizontalAlignment left
+ FontSize 10
+ FontColor #888888
+}
+
+style legend {
+ LineColor black
+ BackGroundColor #DDDDDD
+ FontSize 14
+ RoundCorner 15
+ Padding 6
+ Margin 8
+}
+
+style caption {
+ HorizontalAlignment center
+ FontSize 14
+ Padding 0
+ Margin 1
+ LineColor none
+ BackGroundColor none
+}
+
+
+style element {
+ Shadowing 4.0
+}
+
+style sequenceDiagram {
+}
+
+style classDiagram {
+}
+
+style activityDiagram {
+}
+
+style group {
+ BackGroundColor none
+ LineColor black
+ LineThickness 2.0
+ FontSize 11
+
+ FontStyle bold
+}
+
+style groupHeader {
+ BackGroundColor #EEEEEE
+ LineColor black
+
+ FontSize 13
+ FontStyle bold
+}
+
+style lifeLine {
+ BackGroundColor none
+}
+
+style destroy {
+}
+
+style reference {
+ LineColor red
+ FontSize 10
+ FontStyle bold
+ FontColor blue
+ BackGroundColor gold
+ HorizontalAlignment right
+}
+
+style box {
+ BackGroundColor #DDDDDD
+
+ FontSize 13
+ FontStyle bold
+}
+
+style separator {
+ LineColor black
+ LineThickness 2.0
+ BackGroundColor #EEEEEE
+
+ FontSize 13
+ FontStyle bold
+}
+
+style delay {
+ FontSize 22
+ FontStyle italic
+}
+
+style participant {
+ LineThickness 1.5
+}
+
+style actor {
+ LineThickness 2.0
+}
+
+style boundary {
+}
+
+style control {
+}
+
+style entity {
+}
+
+style queue {
+}
+
+style database {
+}
+
+style collections {
+}
+
+style swimlane {
+}
+
+style diamond {
+}
+
+style arrow {
+ FontSize 13
+}
+
+style note {
+ FontSize 13
+ BackGroundColor #FBFB77
+}
+
+style partition {
+}
+
+style circle {
+}
+
+----
+
+
+
+== debug.skin file
+
+This file is used as an alternative possible skin file for debugging purpose.
+It is integrated into beta version.
+
+----
+style root {
+ FontName SansSerif
+ HyperLinkColor red
+ FontColor green
+ FontSize 19
+ FontStyle plain
+ HorizontalAlignment left
+ RoundCorner 15
+ DiagonalCorner 0
+ LineColor #3600A8
+ LineThickness 1.0
+ BackGroundColor #AAA
+ Shadowing 0.0
+}
+
+style stereotype {
+ FontColor blue
+ FontSize 8
+ FontStyle bold
+}
+
+style title {
+ HorizontalAlignment right
+ FontSize 24
+ FontColor blue
+}
+
+style header {
+ HorizontalAlignment center
+ FontSize 26
+ FontColor purple
+}
+
+style footer {
+ HorizontalAlignment left
+ FontSize 28
+ FontColor red
+}
+
+style legend {
+ FontSize 30
+ BackGroundColor yellow
+ Margin 30
+ Padding 50
+}
+
+style caption {
+ FontSize 32
+}
+
+
+style element {
+ BackGroundColor #CEFEFE
+}
+
+style sequenceDiagram {
+}
+
+style classDiagram {
+}
+
+style activityDiagram {
+}
+
+
+style group {
+ LineThickness 3.5
+ BackGroundColor MistyRose
+ LineColor DarkOrange
+
+ FontSize 12
+ FontStyle italic
+ FontColor red
+}
+
+style groupHeader {
+ BackGroundColor tan
+ LineThickness 0.5
+ LineColor yellow
+
+ FontSize 18
+ FontStyle bold
+ FontColor blue
+}
+
+style lifeLine {
+ BackGroundColor gold
+}
+
+style destroy {
+ LineColor red
+}
+
+style reference {
+ LineColor red
+ FontSize 10
+ FontStyle bold
+ FontColor blue
+ BackGroundColor gold
+ HorizontalAlignment right
+}
+
+style box {
+ LineThickness 0.1
+ LineColor FireBrick
+ BackGroundColor PowderBlue
+
+ FontSize 12
+ FontStyle italic
+ FontColor Maroon
+}
+
+style separator {
+ LineColor red
+ BackGroundColor green
+
+ FontSize 16
+ FontStyle bold
+ FontColor white
+}
+
+style delay {
+ FontSize 22
+ FontStyle italic
+}
+
+style participant {
+ LineThickness 2.5
+}
+
+style actor {
+ LineThickness 0.5
+}
+
+style boundary {
+ LineThickness 1.5
+}
+
+style control {
+ LineThickness 1.5
+}
+
+style entity {
+ LineThickness 1.5
+}
+
+style queue {
+ LineThickness 1.5
+}
+
+style database {
+ LineThickness 1.5
+}
+
+style collections {
+ LineThickness 1.5
+}
+
+style arrow {
+ FontSize 13
+ LineColor Lime
+}
+
+style note {
+ BackGroundColor GoldenRod
+}
+
+style diamond {
+}
+
+style swimlane {
+}
+
+style activity {
+ BackgroundColor #33668E
+ BorderColor #33668E
+ FontColor #888
+ FontName arial
+}
+
+style activityDiagram && diamond {
+ BackgroundColor #dae4f1
+ BorderColor #33668E
+ FontColor red
+ FontName arial
+ FontSize 5
+}
+
+style activityDiagram && arrow {
+ FontColor gold
+ FontName arial
+ FontSize 15
+}
+
+style activityDiagram && partition {
+ LineColor red
+ FontColor green
+ RoundCorner 30
+}
+
+style activityDiagram && note {
+ FontColor Blue
+ LineColor yellow
+}
+
+style circle {
+ BackgroundColor yellow
+}
+
+----
+
+
+
+== Legacy discussions
+
+We keep here some previous discussions.
+We do not delete them because they contain some interesting ideas.
+Maybe we are going to reuse them.
+
+
+
+== First style proposal
+
+A first idea is to use the same notion as CSS (cascading style sheet).
+The cascading feature may be useful to avoid duplication in skinparam/style feature.
+All elements will have one default (predefined) style, which may inherit for another default style.
+Users will be able either:
+
+* to create a new style and to apply it to some element
+* to modify any predefined style.
+
+Let's start by an simple example:
+----
+@startuml
+actor Alice
+boundary Bob
+Alice -> Bob : hello
+@enduml
+----
+
+By default, all elements uses the `+root+` style, so you can change the font name of all text of this diagram with:
+
+
+Let's say we have the following style hierarchy:
+
+
+@startuml
+title Style hierarchy cascade
+skinparam ranksep 30
+hide circle
+hide empty members
+class root
+class element extends root
+class actor extends element
+class boundary extends element
+class message extends root
+@enduml
+
+
+----
+@startuml
+style root {
+ fontName Arial
+}
+style element {
+ fontName Courier
+ fontColor Red
+}
+syle actor {
+ fontSize 14
+}
+style boundary {
+ fontColor Blue
+}
+actor Alice
+boundary Bob
+Alice -> Bob : hello
+@enduml
+----
+
+[RG] --
+If the format of CSS is followed, the above example could be extended in a similar fashion for targeting specific elements perhaps:
+----
+@startuml
+style root {
+ fontName Arial
+}
+style element {
+ fontName Courier
+ fontColor Red
+}
+style actor.Bob, boundary.Alice {
+ fontSize 14
+}
+style message {
+ fontSize 24
+}
+style message.Bob:Alice
+{
+ BackgroundColor Black
+}
+
+actor Alice
+boundary Bob
+Alice -> Bob : hello
+@enduml
+----
+The syntax for selecting the entity could take many forms. I've used `+:+` for simplicity. Implementing a full descendant selection matching like CSS is more powerful, but also likely more complex, i.e. `+ancestor > descendant+`. It seems most scenarios involve two entities at most, so a simple matching pair may be sufficient, with some minor additional flexibility for directional allowances. To continue the example above, it might look like:
+----
+@startuml
+style message {
+ fontSize 24
+}
+style message.Bob:Alice
+{
+ BackgroundColor Black
+}
+
+style message.Bob>Alice
+{
+ BackgroundColor Blue
+}
+
+actor Alice
+boundary Bob
+Alice -> Bob : hello
+'fontSize 24 && BackgroundColor Black
+Bob o-> Alice : hi
+'fontSize 24 && BackgroundColor Black && BackgroundColor Blue
+'BackgroundColor would resolve as standard cascade to last defined value, "Blue"
+'or precedence possibly, i.e. a specific relationship ">" is higher order than
+'"any" relationship ":"
+@enduml
+
+----
+It would nice to be mindful of some other outstanding requests that would like to see some form of metadata follow through into SVG output, for postprocessing with other tools. For example, I have opened the SVG in Sketch and used a tool to locate elements of a given name or type to make changes, which currently is quite hard. To incorporate that in a basic fashion:
+
+[AR] Agreed on the need for SVG ouput. I propose to use `+exportedName+` property for this purpose
+
+----
+@startuml
+style message {
+ styleName "DefaultMessage"
+ 'default value, not required but processed by system if no styleName found? See example below for
+ 'counter argument
+ fontSize 24
+}
+style message.Bob:Alice {
+ styleName "BobAndAliceMessage"
+ ' provided by user. If not provided by user, perhaps system generate in output with basic
+ ' convention like CamelCase to hyphens: Bob-Alice-Message
+ ' But I think it's acceptable to simply state "if user wants a value here, they should supply it"
+ fontSize 10
+}
+
+participant Bob
+actor Alice
+participant Sally
+
+Bob->Alice: Hello
+Alice->Sally: Also Hello!
+@enduml
+----
+I think the main drawback of doing the selectors in the `+style+` section is the dynamic nature of PlantUML, where new entities may be defined on the fly. But in many ways this is no different than HTML/CSS. To take a slightly different tact, focusing on style application happening in the UML itself:
+
+[AR] Here, I don't like the idea of `+style+` targeting individual element of a specific diagram. According to me, it prevent the reuse of some existing `+style+` file several diagrams.
+
+
+----
+@startuml
+style actor {
+ Padding 10
+}
+style actor {
+ styleName "MorePadding"
+ Image <&check>
+ ImagePosition BeforeText
+ ' or AfterText
+ ' convention also supported
+ fontSize 24
+ Size 32
+ Padding 20
+}
+style message {
+ styleName "DefaultMessage"
+ fontSize 24
+}
+style message {
+ styleName "SmallFont"
+ fontSize 10
+}
+
+participant Bob
+actor Alice
+' or actor Alice
+' or !style "MorePadding"
+participant Sally
+
+Bob->Alice: Hello
+Alice->Sally: Also Hello!
+@enduml
+----
+It may be a personal choice, but I feel the cleaner the UML markup itself, the better. For example, to prevent having something like a Swimlane title, that must be repeated such as `+<&check> \nSome\nName+`. With Macros or Variables this can be easier, but still is another layer of mental abstraction. None of this prevents doing that of course, to keep compatibility as is mentioned.
+
+[AR] agreed on the cleaner the UML markup itseft, the better.
+
+
+
+== Targeting Specific Diagram types
+
+It is important meet the goal of reusing a "style set", i.e. putting many definitions in one file for many diagram types. The common example of this is a "Design System", so that a common style may be followed across different diagrams.
+
+Following the initial example, a convention could be followed such as:
+
+would result in hierarchy:
+
+
+@startuml
+title Style hierarchy cascade per type Option1
+skinparam ranksep 30
+hide circle
+hide empty members
+class root
+class message extends root
+class element extends root
+class actor extends element
+class "SequenceDiagram.message" extends message
+class "SequenceDiagram.actor" extends actor
+
+@enduml
+
+
+or alternately:
+
+
+@startuml
+title Style hierarchy cascade per type Option2
+skinparam ranksep 30
+hide circle
+hide empty members
+class root
+class message extends root
+class actor extends root
+class SequenceDiagram extends root
+class SequenceDiagram.message extends SequenceDiagram
+class SequenceDiagram.actor extends SequenceDiagram
+
+@enduml
+
+
+It would seem **Option1** makes more sense in an inheritance/parsing sense. **Option2** would likely result in challenges in traversing/cascading the styles. I also note that this conflicts with my syntax above for style assignment (reusing the `+.+` operator), so perhaps one or the other may need to change if it was difficult to manage. Perhaps: `+style message.Bob:Alice in SequenceDiagram+` or `+style SequenceDiagram.message(Bob:Alice)+` or even `+style SequenceDiagram.message.Bob:Alice+`.
+
+[AR] I fully agree on the need (except for targeting indivual element), and I will propose an **Option3**.
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/style-evolution.adoc b/plantuml-docs/docs_from_alphadoc/style-evolution.adoc
new file mode 100644
index 00000000..1acbcc11
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/style-evolution.adoc
@@ -0,0 +1,322 @@
+== Style (or CSS like style)
+
+The style feature is still in testing stage.
+Starting with version `+1.2019.9+`, style is enabled by default for link::mindmap-diagram[mindmap] and link::wbs-diagram[wbs diagrams].
+
+For old diagrams and old PlantUML version, you have to use `+skinparam useBetaStyle true+` to test this feature.
+
+For new diagrams and new PlantUML version, style is now enabled by default.
+
+There are some working examples on this page.
+
+
+== Current situation
+
+Currently, link::skinparam[skinparam] are used to change the rendering (fonts, colors...) of diagrams.
+Although the current system is working, it has some important limitations:
+
+* skinparam allow global changes for a whole diagram
+* every kind of diagram (sequence, class, activity) has its own skinparam
+* it is possible to use `<>` to define specific settings for groups of elements with the same stereotype
+* you can use creole syntax to individually change some setting
+* http://www.plantuml.com/plantuml/uml/AyxEp2j8B4hCJIr9BIe60000[there is an explosion of possible skinparams] (see https://github.com/VladimirAlexiev/plantuml-skinparam[plantuml-skinparam] for an attempt to grok them)
+* some element cannot be stereotyped (for example, messages in sequence diagrams)
+
+What we wish:
+* The possibility to use individual change everywhere (so probably with creole engine which will be kept).
+* The possibility to change a setting (for example default font size, color, name...) for all diagrams without to have to set a setting for Sequence, then one for Class, then one for Activity.
+* **At the same time**, the possibility to change a setting for a specific diagrams type (only Sequence for example).
+* Having a syntax close to CSS
+* No more hardcoded values (size, color...) in the core PlantUML library. Those values should be store in one single `+plantuml.skin+` file that people could read and modify.
+* Keep it simple : since nobody is reading the documentation (which is often out-of-date anyway), people should understand the style system just in reading example.
+* Avoid combinatorial explosion in style naming.
+
+
+Note that **even if the existing skinparam syntax may be deprecated, all existing legacy diagrams should still work with future versions of PlantUML**.
+
+
+== Properties that can be styled
+
+The following properties can be set in style:
+
+* FontName
+* FontColor
+* FontSize
+* FontStyle
+* BackGroundColor
+* HyperLinkColor
+* ~~BorderColor~~ LineColor : seems more generic
+* LineThickness
+* ~~BorderStyle~~ LineStyle : on real number or two real numbers separated with `+;+`
+* Padding
+* Margin
+* RoundCorner
+* https://forum.plantuml.net/7485/diagonal-corner[DiagonalCorner]
+* ExportedName** : used for some format (SVG), not implemented**
+* Image** : not implemented**
+* ImagePosition** : not implemented**
+* MinimumWidth** : not implemented**
+* WordWrap (to be renamed as MaximumWidth) (add carriage return if needed)
+* HorizontalAlignment : left, right or center
+* ...
+
+
+
+
+== Current Working Model
+
+The current model has moved to work similarly to CSS, using a model of scoping and cascading styles to either element types or user-assigned styles (via `<>` notation).
+
+Style can be inlined using `++` separators.
+
+It is also possible to store style definition in some external file and to reference it using `+
+
+' printed in blue
+actor Bob
+' also printed in blue
+actor Sally
+@enduml
+
+
+
+
+
+=== Basic example of a Work Breakdown Structure style
+
+Let's at a different example, that of a Work Breakdown Structure:
+
+
+@startwbs
+
+
+* World
+** America
+*** Canada
+** Europe
+*** England
+*** Germany
+*** Spain
+@endwbs
+
+
+
+
+== Adding user defined style targets
+
+We can extend these examples to start targeting not just element __types__, but __specific__ elements.
+
+=== Using user defined styles in a Sequence Diagram
+
+
+@startuml
+skinparam useBetaStyle true
+' style enclosure declaration
+
+
+' printed in blue
+actor Bob
+' this will now be printed in Red
+actor Sally <>
+@enduml
+
+
+> NOTE: If the `+<>+` is showing, it is likely a bug, resolved in newer betas.
+
+
+
+== Using Dynamic Selectors
+
+> NOTE: This section is still very experimental and may change!
+
+As we are following the CSS model now, then it should be possible to use selectors to simplify targeting groups of elements, like those "children" (or "downstream") of a given element in diagrams like Work Breakdown or MindMaps.
+
+=== Using the depth selector in a WBS
+
+
+@startwbs
+
+* World
+** America
+*** Canada
+*** Mexico
+**** Chihuahua
+*** USA
+**** Texas
+***< New York
+** Europe
+*** England
+*** Germany
+*** Spain
+@endwbs
+
+
+=== Using the "descendant" pseudo selector
+
+Of course, sometimes you want to target all "child" (or "downstream") elements of a given element. The `+*+` selector works as in CSS, to say: "this element, and all elements of __any__ type that is it's child".
+
+An example:
+
+
+@startwbs
+
+* World
+** America
+*** Canada
+*** Mexico <>
+**** Chihuahua
+*** USA
+**** Texas
+***< New York
+** Europe
+*** England
+*** Germany
+*** Spain
+@endwbs
+
+
+
+
+== Using an external style file
+
+> NOTE: This is still a work in progress, and may not work as expected.
+
+If a file named `+plantuml.skin+` is found in the same folder as the diagram, it will attempt to be loaded and used during diagram creation. This lays the groundwork--along with scoping styles to specific diagrams, and user defined styles--for creating truly complex and persistent styles, without including them in each of your diagrams.
+
+
+
+== Getting debug output
+
+> NOTE: This is still a work in progress, and may not show every element in every diagram.
+
+You can use the `+-v+` (or `+-verbose+`) command line argument to get some debug output to help you determine what elements are in use, so you can target them.
+
+`+java -jar plantuml.jar -v -tpng diagram.pu+`
+
+results in:
+
+----
+(0.378 - 256 Mo) 238 Mo - Using style node.depth(0).root.wbsdiagram.rootnode.element
+(0.546 - 256 Mo) 237 Mo - Using style depth(2).node.root.wbsdiagram.leafnode.element
+(0.547 - 256 Mo) 237 Mo - Using style depth(2).node.root.*.wbsdiagram.element
+(0.560 - 256 Mo) 236 Mo - Using style node.root.depth(3).wbsdiagram.leafnode.element
+(0.561 - 256 Mo) 236 Mo - Using style node.root.depth(3).*.wbsdiagram.mexicostyle.element
+(0.562 - 256 Mo) 236 Mo - Using style node.root.depth(3).*.wbsdiagram.element
+(0.565 - 256 Mo) 236 Mo - Using style depth(2).node.root.wbsdiagram.mexicostyle.element
+(0.569 - 256 Mo) 235 Mo - Using style depth(2).node.root.wbsdiagram.element
+(0.571 - 256 Mo) 235 Mo - Using style node.depth(1).root.wbsdiagram.element
+(0.572 - 256 Mo) 235 Mo - Using style node.depth(1).root.*.wbsdiagram.element
+(1.963 - 256 Mo) 250 Mo - Using style depth(0).arrow.root.wbsdiagram.element
+(1.964 - 256 Mo) 250 Mo - Using style depth(1).arrow.root.wbsdiagram.element
+(1.965 - 256 Mo) 250 Mo - Using style depth(2).arrow.root.wbsdiagram.element
+----
+
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/sub-diagram.adoc b/plantuml-docs/docs_from_alphadoc/sub-diagram.adoc
new file mode 100644
index 00000000..615757ba
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/sub-diagram.adoc
@@ -0,0 +1,122 @@
+== Sub-diagram
+
+On PlantUML, you can mix all diagram type and make sub-diagram.
+
+To activate this feature, the sub-diagram must:
+* begin with `+{{+`
+* end with `+}}+`.
+
+
+== Basic example
+
+Here is a basic example of sub-diagram, with adding an **Activty diagram** on a note on a **Class diagram**:
+
+@startuml
+abstract ATest {
+ {static} +String id
+ {abstract} -void doit()
+}
+
+class Test {
+ -int count
+ -int max
+ -int increment
+ -void doit()
+}
+
+ATest <|-- Test
+
+note right of Test::doit()
+{{
+ skinparam backgroundcolor transparent
+ start
+
+ while (count < max?)
+ :count = count + increment;
+ endwhile
+
+ stop
+}}
+end note
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/6947/embed-sub-diagrams-in-diagram-like-a-note?show=7070#a7070[QA-6947]]__
+
+
+By default the background color of a sub-diagram is white.
+This can be solved by adding `+skinparam Backgroundcolor transparent+` to the sub-diagram.
+
+
+
+@startuml
+rectangle A [
+{{
+ rectangle A
+}}
+]
+
+rectangle B [
+{{
+ skinparam Backgroundcolor transparent
+ rectangle B
+}}
+]
+@enduml
+
+
+Besides being used in other elements or notes, they can also be used in messages.
+For this, the sub-diagram must be all on one line:
+
+
+@startuml
+(A) --> (B): \tSub-diagram in a message\n{{\n(C)->(D)\n}}
+@enduml
+
+
+
+== Inheritage of handwritten skinparam
+
+Sub-diagram can only herite of the `+handwritten+` skinparam from the hosted diagram, as:
+
+
+@startuml
+skinparam handwritten true
+ component a {
+ }
+ note left of a
+ handwritten is OK
+ end note
+
+ note right of a
+ {{
+ a->b:test
+ note right
+ handwritten is inherited
+ end note
+ }}
+ end note
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/9043/skinparam-handwritten-inherited-within-embedded-diagram[QA-9043]]__
+
+
+== Collection of all ref. of sub-diagram:
+
+
+* https://forum.plantuml.net/2427/salt-with-minimum-flowchat-capabilities[QA-2427]
+* https://forum.plantuml.net/6947/embed-sub-diagrams-in-diagram-like-a-note[QA-6947]
+* https://forum.plantuml.net/9341/embedding-in-interface-note-fails[QA-9341]
+* https://forum.plantuml.net/10967/order-mismatch-between-note-and-rectangle-with-embedded-salt[QA-10967]
+* https://forum.plantuml.net/11476/how-to-combine-activity-beta-and-state-diagrams[QA-11476]
+* https://forum.plantuml.net/11895/embed-sub-diagrams-all-type-especially-mindmap-type-diagram[QA-11895]
+* https://forum.plantuml.net/12609/json-diagrams-accept-json-diagram-diagram-embedded-diagram[QA-12609]
+* https://forum.plantuml.net/12722/can-combine-two-graphs-together-like-sequence-state-diagram[QA-12722]
+* https://forum.plantuml.net/12820/yaml-diagrams-accept-yaml-diagram-diagram-embedded-diagram[QA-12820]
+* https://forum.plantuml.net/12821/differences-between-outputs-background-diagram-embedded[QA-12821]
+* https://forum.plantuml.net/15433/not-embed-sub-diagrams-in-a-note[QA-15433]
+* [QA-]()
+* ...
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/sudoku.adoc b/plantuml-docs/docs_from_alphadoc/sudoku.adoc
new file mode 100644
index 00000000..ed439017
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/sudoku.adoc
@@ -0,0 +1,22 @@
+== Have a break: resolve a Sudoku...
+
+Sometimes, when modeling, it's good to have a break....
+
+You can use **PlantUML** to create http://en.wikipedia.org/wiki/Sudoku[Sudoku], like in the following example:
+
+
+@startuml
+sudoku
+@enduml
+
+The sudoku is randomly generated.
+
+It is also possible to generate a specific http://en.wikipedia.org/wiki/Sudoku[Sudoku] by providing its seed:
+
+
+@startuml
+sudoku 45azkdf4sqq
+@enduml
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/svek.adoc b/plantuml-docs/docs_from_alphadoc/svek.adoc
new file mode 100644
index 00000000..d6605933
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/svek.adoc
@@ -0,0 +1,29 @@
+== Current architecture: Svek
+
+This current architecture (which codename is **Svek**) uses **Graphviz/Dot** to compute __nodes position__. The drawing itself is fully done in Java.
+
+The main advantage is that, since PlantUML does the drawing, the software is now less dependent of Graphviz/Dot.
+
+The code is also simpler, because the two steps (node computation __then__ graphical rendering) are clearly separated.
+
+With this architecture, Graphviz/Dot generates a simplified SVG output
+(whatever is the actual output format need by the user), and those simplified SVG data are parsed by PlantUML.
+The drawing is then done by PlantUML.
+
+
+== Svek on debug mode [option debugsvek]
+
+You can keep the intermediate __dot file__ and the __simplified SVG output__, with the `+debugsvek+` option.
+
+With this option:
+----
+java -jar plantuml.jar -debugsvek filename.puml
+----
+
+We can keep the 2 intermediate files:
+* `+filename_svek.dot+`
+* `+filename_svek.svg+`
+
+__[Ref. https://forum.plantuml.net/4420/[QA-4420]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/svg.adoc b/plantuml-docs/docs_from_alphadoc/svg.adoc
new file mode 100644
index 00000000..049b7705
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/svg.adoc
@@ -0,0 +1,107 @@
+== Scalable Vector Graphics
+http://en.wikipedia.org/wiki/Scalable_Vector_Graphics[SVG] is a graphical format which is scalable. It means that when you zoom an image, you don't lose quality. So this format gives good printing result.
+
+You can enable SVG generation by using `+-tsvg+` flag with the link::command-line[command line].
+
+You can also use `+format="svg"+` in the link::ant-task[Ant task definition].
+
+----
+
+
+
+----
+
+You can also generate SVG link::api[directly from Java].
+
+
+== Specific SkinParameter for SVG
+
+=== svgLinkTarget
+
+You can change the `+target+` value in the generated SVG with the `+svgLinkTarget+` setting.
+
+According to https://www.w3.org/TR/html52/browsers.html#valid-browsing-context-names-or-keywords[the HTML specification], you can choose:
+* `+_blank+`
+* `+_parent+`
+* `+_self+`
+* `+_top+` __(by default, if `+svgLinkTarget+` is empty)__
+
+
+----
+@startuml
+skinparam svgLinkTarget _parent
+start
+:[[http://plantuml.com]];
+stop
+@enduml
+----
+
+=== pathHoverColor
+
+There is also a setting `+skinparam pathHoverColor+` to specify a color change when the mouse pointer goes hover some links.
+
+----
+@startuml
+skinparam pathHoverColor green
+class Foo2 [[http://www.yahoo.com/Foo2]] {
+ +double[] x
+ +double y
+}
+Foo2 --> Foo3
+@enduml
+----
+__[Ref. https://forum.plantuml.net/5453[QA-5453]]__
+
+=== svgDimensionStyle
+
+If you does not want to have the attribut `+style+`, `+width+` and `+height+` on the header of the SVG output, you can set `+skinparam svgDimensionStyle false+`.
+
+
+----
+@startuml
+skinparam svgDimensionStyle false
+
+component a {
+}
+component b {
+}
+a -(0- b
+@enduml
+----
+__[Ref. https://forum.plantuml.net/7334[QA-7334]]__
+
+
+== Specific Pragma for SVG
+
+=== svgSize
+
+This directive `+!pragma svgSize XX+` tells to PlantUML: "assume that the size of is the same as 'XX' "
+
+You can play with this directive:
+
+* `+!pragma svgSize XX+`
+* `+!pragma svgSize I+`
+
+to find the best setting.
+
+
+
+@startuml
+!pragma svgSize XX
+
+test: text
+test_size45: text
+@enduml
+
+
+You can use the `+-P+` link::command-line[command-line] option to specify the pragma.
+* Put it in quotes because the value includes spaces.
+* You can use it multiple times. Example:
+
+----
+java -jar plantuml.jar "-PsvgSize= XX" "-PsvgSize= I"
+----
+
+__[Refs. https://forum.plantuml.net/12550[QA-12550], https://github.com/plantuml/plantuml/issues/582[issue-582]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/syntax-asciidoc.adoc b/plantuml-docs/docs_from_alphadoc/syntax-asciidoc.adoc
new file mode 100644
index 00000000..8d1024f3
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/syntax-asciidoc.adoc
@@ -0,0 +1,144 @@
+== Basic Formatting
+
+You can use usual formatting.
+
+|===
+| Style syntax| Result
+
+| `+__Italic__+`
+| __Italic__
+
+| `+**Bold**+`
+| **Bold**
+
+| `+**__Italic and bold__**+`
+| **__Italic and bold__**
+
+| `++++underlined++++`
+| +++underlined+++
+
+| `+~~striked~~+`
+| ~~striked~~
+
+| `+raw+`
+| `+raw+`
+
+|===
+
+
+== Lists
+
+You can use ordered and unordered lists. Right now, you can only have one level of sub-list. If you need more, just tell us!
+
+=== Unordered list
+
+----
+* First ordered list item
+* Second ordered list item
+* Third ordered list item
+----
+
+* First ordered list item
+* Second ordered list item
+* Third ordered list item
+
+=== Ordered list
+
+----
+. First ordered list item
+.. A sublist
+. Second ordered list item
+. Third ordered list item
+----
+
+. First ordered list item
+.. A sublist
+. Second ordered list item
+. Third ordered list item
+
+
+== Tables
+
+Right now, only basic table is supported.
+
+Just ask if you need more!
+
+----
+|===
+| Parameter | Default | Description
+
+| nbthread
+| 1
+| Number of thread for processing
+
+| graphvizDot
+|
+| Path of the dot executable
+
+|===
+----
+
+
+|===
+| Parameter | Default | Description
+
+| nbthread
+| 1
+| Number of thread for processing
+
+| graphvizDot
+|
+| Path of the dot executable
+
+|===
+
+
+== UML diagrams
+
+=== Image with source code
+
+You have to use `++` and `++`.
+
+----
+
+@startuml
+Alice -> Bob : Hello
+@enduml
+
+----
+
+
+@startuml
+Alice -> Bob : Hello
+@enduml
+
+
+=== Display only image
+
+Use standard `+[plantuml]+` block:
+
+----
+[plantuml]
+-โ---
+@startuml
+Alice -> Bob : Hello
+note right
+Caution: there is an unicode invisible space
+in the ---- line.
+end note
+@enduml
+-โ---
+----
+
+[plantuml]
+----
+@startuml
+Alice -> Bob : Hello
+note right
+Caution: there is an unicode invisible space
+in the ---- line.
+end note
+@enduml
+----
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/syntax-dokuwiki.adoc b/plantuml-docs/docs_from_alphadoc/syntax-dokuwiki.adoc
new file mode 100644
index 00000000..6b7e2381
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/syntax-dokuwiki.adoc
@@ -0,0 +1,133 @@
+== Syntax Dokuwiki
+
+Here are some elements of Dokuwiki syntax supported by this current wiki.
+You can see also directly to the Dokuwiki wiki web site:
+* https://www.dokuwiki.org/wiki:syntax[https://www.dokuwiki.org/wiki:syntax]
+
+
+== Basic Formatting
+
+You can use usual formatting.
+
+|===
+| Style syntax | Result
+
+| `+//Italic//+`
+| __Italic__
+
+| `+**Bold**+`
+| **Bold**
+
+| `+**//Italic and bold//**+`
+| **__Italic and bold__**
+
+| `+__underlined__+`
+| +++underlined+++
+
+| `+~~striked~~+`
+| ~~striked~~
+
+| `+raw+`
+| `+raw+`
+
+|===
+
+
+== Lists
+
+You can use ordered and unordered lists. Right now, you can only have one level of check sub-list. If you need more, just tell us!
+
+=== Unordered list
+
+----
+ * First ordered list item
+ * Second ordered list item
+ * Third ordered list item
+----
+
+* First ordered list item
+* Second ordered list item
+* Third ordered list item
+
+=== Ordered list
+
+----
+ - First ordered list item
+ - A sublist
+ - Second ordered list item
+ - Third ordered list item
+----
+
+. First ordered list item
+.. A sublist
+. Second ordered list item
+. Third ordered list item
+
+
+== Tables
+
+Right now, only basic table is supported.
+
+Just ask if you need more!
+
+----
+^ Parameter ^ Default ^ Description ^
+| nbthread | 1 | Number of thread for processing |
+| graphvizDot | | Path of the dot executable |
+----
+
+
+|===
+| Parameter | Default | Description
+
+| nbthread
+| 1
+| Number of thread for processing
+
+| graphvizDot
+|
+| Path of the dot executable
+
+|===
+
+
+== UML diagrams
+
+=== Image with source code
+
+You have to use `++` and `++`.
+
+----
+
+@startuml
+Alice -> Bob : Hello
+@enduml
+
+----
+
+
+@startuml
+Alice -> Bob : Hello
+@enduml
+
+
+=== Display only image
+
+Use standard `++` and `++` block.
+
+----
+
+@startuml
+Alice -> Bob : Hello
+@enduml
+
+----
+
+[plantuml]
+----
+@startuml
+Alice -> Bob : Hello
+@enduml
+----
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/syntax-markdown.adoc b/plantuml-docs/docs_from_alphadoc/syntax-markdown.adoc
new file mode 100644
index 00000000..a50995e7
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/syntax-markdown.adoc
@@ -0,0 +1,129 @@
+== Basic Formatting
+
+You can use usual formatting.
+Text underlining is not part of standard markdown but has been added.
+
+|===
+| Style syntax | Result
+
+| `+*Italic*+`
+| __Italic__
+
+| `+**Bold**+`
+| **Bold**
+
+| `+***Italic and bold***+`
+| **__Italic and bold__**
+
+| `+__underlined__+`
+| +++underlined+++
+
+| `+~~striked~~+`
+| ~~striked~~
+
+| `+`raw`+`
+| `+raw+`
+
+|===
+
+
+== Lists
+
+You can use ordered and unordered lists. Right now, you can only have one level of sub-list. If you need more, just tell us!
+
+=== Unordered list
+
+----
+* First unordered list item
+ * A sublist
+* Second unordered list item
+* Third unordered list item
+----
+
+* First unordered list item
+** A sublist
+* Second unordered list item
+* Third unordered list item
+
+
+=== Ordered list
+
+----
+1. First ordered list item
+1. Second ordered list item
+1. Third ordered list item
+----
+
+. First ordered list item
+. Second ordered list item
+. Third ordered list item
+
+
+== Tables
+
+Right now, only basic table is supported.
+
+Just ask if you need more!
+
+----
+| Parameter | Default | Description |
+| ----------- | ------- | ------------------------------- |
+| nbthread | 1 | Number of thread for processing |
+| graphvizDot | | Path of the dot executable |
+----
+
+
+|===
+| Parameter | Default | Description
+
+| nbthread
+| 1
+| Number of thread for processing
+
+| graphvizDot
+|
+| Path of the dot executable
+
+|===
+
+
+== UML diagrams
+
+=== Image with source code
+
+You have to use `++` and `++`.
+
+----
+
+@startuml
+Alice -> Bob : Hello
+@enduml
+
+----
+
+
+@startuml
+Alice -> Bob : Hello
+@enduml
+
+
+=== Display only image
+
+Use standard `+```plantuml+` block.
+
+----
+```plantuml
+@startuml
+Alice -> Bob : Hello
+@enduml
+```
+----
+
+[plantuml]
+----
+@startuml
+Alice -> Bob : Hello
+@enduml
+----
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/teoz.adoc b/plantuml-docs/docs_from_alphadoc/teoz.adoc
new file mode 100644
index 00000000..d9501c2e
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/teoz.adoc
@@ -0,0 +1,114 @@
+== Current "Puma" architecture
+When we've started PlantUML in 2009, the very first UML diagram type that we have addressed at that time
+was link::sequence-diagram[Sequence Diagrams].
+
+At the beginning, capabilities were very limited. The layout engine used for Sequence Diagrams was pretty simple, but this was enough to do
+basic diagrams.
+
+Then more and more people begin to use PlantUML and ask for new features. We add those features (group, activation, note, encompass...)
+by adding some code in the existing layout engine, but we did not change its roots.
+
+So you know the story : the code is getting more and more complex. It begins to be difficult to maintain.
+The initial simplicity is gone, because some initial architecture decisions
+were not good regarding the new capabilities.
+
+Moreover, some features (especially for parallel message, see http://forum.plantuml.net/tag/teoz[pending wanted features])
+are almost impossible to implements with the current "Puma" architecture.
+
+This is the bad news.
+
+**The good news is that we are willing to overcome those issues.**
+
+So we've read many things about design patterns to define a better software archicture.
+https://www.scrumalliance.org/community/articles/2013/2013-april/experiences-in-agile-coaching-courage-as-a-value[And we need some courage too!]
+
+
+
+
+== Toward "Teoz" architecture
+So a new layout engine has been added to PlantUML. The codename of this architecture is "Teoz", and it has been integrated
+as alpha version in PlantUML version 8019.
+
+By default, the old "Puma" layout engine is still used, but you can turn on Teoz engine using some `+!pragma+` directive :
+
+
+@startuml
+!pragma teoz true
+Alice -> Bob : hello
+& Bob -> Charlie : hi
+@enduml
+
+
+Many things are not working with this first version. We are not even sure that the proposed syntax (use of `+&+`) is a good idea.
+
+So we need feedback from the community: http://forum.plantuml.net/tag/teoz[please use the Q&A forum, putting a Teoz tag in your questions].
+
+We would like to have a complete overview of what users wants to do, to be sure to design some Teoz engine able to handle all new features.
+
+Thanks for your feedback!
+
+
+== Anchors and Duration
+
+With `+teoz+` it is possible to add anchors to the diagram and use the anchors to specify duration time.
+
+@startuml
+!pragma teoz true
+
+{start} Alice -> Bob : start doing things during duration
+Bob -> Max : something
+Max -> Bob : something else
+{end} Bob -> Alice : finish
+
+{start} <-> {end} : some time
+
+@enduml
+
+
+
+== Pragma "teoz"
+
+You can use the `+-P+` link::command-line[command-line] option to specify the pragma:
+----
+java -jar plantuml.jar -Pteoz=true
+----
+__[Ref. https://github.com/plantuml/plantuml/issues/582[GH-582]]__
+
+
+== Nested boxes for sequence diagrams
+
+With `+teoz+` it is possible to have nested boxes for sequence:
+
+@startuml
+!pragma teoz true
+box "component"
+ box "sub1"
+ participant a
+ endbox
+ box "sub2"
+ participant b
+ endbox
+end box
+@enduml
+
+
+
+@startuml
+!pragma teoz true
+box "component"
+ box "sub1\n\n"
+ participant a
+ box "subsub1"
+ participant suba
+ end box
+ endbox
+ box "sub2"
+ participant b
+ endbox
+end box
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/4957/why-not-to-support-nested-boxes-in-sequence-diagrams[QA-4957], https://github.com/plantuml/plantuml/issues/172[GH-172]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/text-encoding.adoc b/plantuml-docs/docs_from_alphadoc/text-encoding.adoc
new file mode 100644
index 00000000..75377195
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/text-encoding.adoc
@@ -0,0 +1,149 @@
+== PlantUML Text Encoding
+
+
+
+== Introduction
+
+PlantUML defines a standardized way to encode diagram text description to a simple string of characters that contains only digits, letters, underscore and minus character.
+The goal of such an encoding is to facilitate communication of diagrams through URL (see link::server[server]).
+This encoding includes compression to keep encoded strings as short as possible.
+
+The encoded metadata is stored in the generated PNG, so the diagram source can be extracted from the diagram itself! (see link::server#metadata[server#metadata]).
+
+
+== Compression
+
+
+http://en.wikipedia.org/wiki/DEFLATE[Deflate algorithm] is used by default.
+
+You can also use simple HEX encoding, see below. An initial `+~h+` is added to indicate this encoding.
+
+**Principle**
+
+For example, the following uml text description:
+
+----
+@startuml
+Alice -> Bob: Authentication Request
+Bob --> Alice: Authentication Response
+@enduml
+----
+
+is http://www.plantuml.com/plantuml/uml/Syp9J4vLqBLJSCfFib9mB2t9ICqhoKnEBCdCprC8IYqiJIqkuGBAAUW2rO0LOr5LN92VLvpA1G00[encoded as]:
+
+----
+Syp9J4vLqBLJSCfFib9mB2t9ICqhoKnEBCdCprC8IYqiJIqkuGBAAUW2rO0LOr5LN92VLvpA1G00
+----
+
+
+To achieve such encoding, the text diagram is:
+
+. Encoded in UTF-8
+. Compressed using http://en.wikipedia.org/wiki/DEFLATE[Deflate] algorithm
+. Reencoded in ASCII using a transformation __close__ to http://en.wikipedia.org/wiki/Base64[base64]
+
+
+**Why not use Base64?**
+
+The main reason is historic: this format was not created to be public at first. Now, it's too late to change it. However, the only difference is in character order.
+
+Where in base64 the mapping array for values 0-63 is:
+----
+ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/
+----
+
+For PlantUML, the mapping array for values 0-63 is:
+----
+0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz-_
+----
+
+
+**Compression comparison **
+
+The following diagram:
+
+
+@startuml
+skinparam backgroundColor #EEEBDC
+skinparam handwritten true
+
+skinparam sequenceArrowColor DeepSkyBlue
+skinparam sequenceActorBorderColor DeepSkyBlue
+skinparam sequenceLifeLineBorderColor blue
+skinparam sequenceLifeLineBackgroundColor #A9DCDF
+skinparam sequenceParticipantBorderColor DeepSkyBlue
+skinparam sequenceParticipantBackgroundColor DodgerBlue
+skinparam sequenceParticipantFontName Impact
+skinparam sequenceParticipantFontSize 17
+skinparam sequenceParticipantFontColor #A9DCDF
+skinparam sequenceActorBackgroundColor aqua
+skinparam sequenceActorFontColor DeepSkyBlue
+skinparam sequenceActorFontSize 17
+skinparam sequenceActorFontName Aapex
+
+actor User
+participant "First Class" as ParticipantA
+participant "Second Class" as ParticipantB
+participant "Last Class" as ParticipantC
+
+User -> ParticipantA: DoWork
+activate ParticipantA
+
+ParticipantA -> ParticipantB: Create Request
+activate ParticipantB
+
+ParticipantB -> ParticipantC: DoWork
+activate ParticipantC
+ParticipantC --> ParticipantB: WorkDone
+destroy ParticipantC
+
+ParticipantB --> ParticipantA: Request Created
+deactivate ParticipantB
+
+ParticipantA --> User: Done
+deactivate ParticipantA
+@enduml
+
+
+is compressed to a
+
+* http://www.plantuml.com/plantuml/uml/ZP4zRy8m48Pt_ueJdHawLMMe53iWLK9LLLHrFk8hM04xd9rI-kiR0u8a1CAG8SdpVja-DxP0nZNCCSiNx4ghbLivXeVnU2nJ9Vo9MABLMpOXa8N09OdQFq-Racn62RFR7WnIecAMx-Ig8Zl0B3YMZZNnFVZKV5UFfRfYteEs1oNFgKed7Oftv60oKw0DzpUgYrf9gTCBudxTnDdmXck2rtM1MUY7P-QFuF6f7-nRV3ZzLctSb7YDFPlUSQstgvwG_VG42_eL0kD7-FJ4eZXFWS74i0-WLkZz0D13RMVI96UKEQkxKTb4ftZDKmaHEy3mfP4qggxqot4UQveV3DJi8UflBQqSWMAAae-utuTE3zdma2qFTJDVrQKAXXVvKPawIq9NyUnshS7Du8lbnzh75ReowH-Gx7tYISRc--JEa_i7[428-char string length using Deflate]
+* http://www.plantuml.com/plantuml/uml/06tq404I5ENsC6cXKT6xxgxaBDG3o_tzkTRbkDJuRa4mYLIoIEFVZsapwhAr5NDHB0jrZfWK5MOp8y53KKy_J2adzUr-HCAJ8bVfEA7x6qMwXhNtcUJYCT4gMZV_c2gzJk9gimqo81bOfXLN-tkYpiaWi3aabF_wrItuxPLX5NINL6FKhAboWjmXbI8jiBfIRnXs0h40re09D-HpekC83iDO8GEXFHTCMoPlXmKCx05mLK_fTdsZCJY1geDzQhs6aar6qIIfU1V5QYHQ5wvIFj8v6xZE0zWeZksK6S5mgnjDR9L1ao9uZg7-gFLepB1EeGVeUILgETgbkEtuAelaPmmGV7kEDjEioz1d6D_0WvvYzGbScBwP8CnA9ZosEQ2vGlBk_7W00[393-char string length using Brotli]
+
+
+== Running
+
+You can use `+-encodeurl+` or `+-decodeurl+` in the link::command-line[command line] flags to encode or decode the text.
+
+You will find here some implementation of this encoder:
+
+* link::code-php[Code in PHP]
+* link::code-javascript-synchronous[Code in Javascript]
+* https://github.com/dougn/python-plantuml[Code in Python]
+* https://blog.eidinger.info/plantuml-text-encoding-in-swift[Code in Swift]
+
+
+== Simple HEX format
+
+If you find Deflate and Brotli too complex, you can try the HEX format.
+In that case, you just have to encode each character in hexadecimal format.
+
+For example :
+----
+@startuml
+Alice->Bob : I am using hex
+@enduml
+----
+
+will be turned into:
+----
+407374617274756d6c0a416c6963652d3e426f62203a204920616d207573696e67206865780a40656e64756d6c
+----
+
+To indicate the use of HEX format, you must add `+~h+` at the start of the data sent to PlantUML server.
+
+http://www.plantuml.com/plantuml/uml/~h407374617274756d6c0a416c6963652d3e426f62203a204920616d207573696e67206865780a40656e64756d6c[http://www.plantuml.com/plantuml/uml/~h4073...]
+
+Since there is no compression here, the URL will become very long as the diagram grows.
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/theme-gallery.adoc b/plantuml-docs/docs_from_alphadoc/theme-gallery.adoc
new file mode 100644
index 00000000..6afd8279
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/theme-gallery.adoc
@@ -0,0 +1,11674 @@
+== Theme Gallery
+
+Here is a Gallery of all the PlantUML link::theme[theme].
+
+
+== List of all themes
+
+
+@startuml
+help themes
+@enduml
+
+
+
+=== amiga
+==== Activity with `+amiga+` theme
+
+@startuml
+
+@startuml
+!theme amiga
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+amiga+` theme
+
+@startuml
+
+@startuml
+!theme amiga
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+amiga+` theme
+
+@startuml
+
+@startuml
+!theme amiga
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+amiga+` theme
+
+@startuml
+
+@startuml
+!theme amiga
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+amiga+` theme
+
+@startuml
+
+@startmindmap
+!theme amiga
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+amiga+` theme
+
+@startuml
+
+@startuml
+!theme amiga
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+amiga+` theme
+
+@startuml
+
+@startuml
+!theme amiga
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+amiga+` theme
+
+@startuml
+
+@startsalt
+!theme amiga
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+amiga+` theme
+
+@startuml
+
+@startuml
+!theme amiga
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+amiga+` theme
+
+@startuml
+
+@startuml
+!theme amiga
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+amiga+` theme
+
+@startuml
+
+@startuml
+!theme amiga
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+amiga+` theme
+
+@startuml
+
+@startwbs
+!theme amiga
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== aws-orange
+==== Activity with `+aws-orange+` theme
+
+@startuml
+
+@startuml
+!theme aws-orange
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+aws-orange+` theme
+
+@startuml
+
+@startuml
+!theme aws-orange
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+aws-orange+` theme
+
+@startuml
+
+@startuml
+!theme aws-orange
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+aws-orange+` theme
+
+@startuml
+
+@startuml
+!theme aws-orange
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+aws-orange+` theme
+
+@startuml
+
+@startmindmap
+!theme aws-orange
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+aws-orange+` theme
+
+@startuml
+
+@startuml
+!theme aws-orange
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+aws-orange+` theme
+
+@startuml
+
+@startuml
+!theme aws-orange
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+aws-orange+` theme
+
+@startuml
+
+@startsalt
+!theme aws-orange
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+aws-orange+` theme
+
+@startuml
+
+@startuml
+!theme aws-orange
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+aws-orange+` theme
+
+@startuml
+
+@startuml
+!theme aws-orange
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+aws-orange+` theme
+
+@startuml
+
+@startuml
+!theme aws-orange
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+aws-orange+` theme
+
+@startuml
+
+@startwbs
+!theme aws-orange
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+black-knight+`
+==== Activity with `+black-knight+` theme
+
+@startuml
+
+@startuml
+!theme black-knight
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+black-knight+` theme
+
+@startuml
+
+@startuml
+!theme black-knight
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+black-knight+` theme
+
+@startuml
+
+@startuml
+!theme black-knight
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+black-knight+` theme
+
+@startuml
+
+@startuml
+!theme black-knight
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+black-knight+` theme
+
+@startuml
+
+@startmindmap
+!theme black-knight
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+black-knight+` theme
+
+@startuml
+
+@startuml
+!theme black-knight
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+black-knight+` theme
+
+@startuml
+
+@startuml
+!theme black-knight
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+black-knight+` theme
+
+@startuml
+
+@startsalt
+!theme black-knight
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+black-knight+` theme
+
+@startuml
+
+@startuml
+!theme black-knight
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+black-knight+` theme
+
+@startuml
+
+@startuml
+!theme black-knight
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+black-knight+` theme
+
+@startuml
+
+@startuml
+!theme black-knight
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+black-knight+` theme
+
+@startuml
+
+@startwbs
+!theme black-knight
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+bluegray+`
+==== Activity with `+bluegray+` theme
+
+@startuml
+
+@startuml
+!theme bluegray
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+bluegray+` theme
+
+@startuml
+
+@startuml
+!theme bluegray
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+bluegray+` theme
+
+@startuml
+
+@startuml
+!theme bluegray
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+bluegray+` theme
+
+@startuml
+
+@startuml
+!theme bluegray
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+bluegray+` theme
+
+@startuml
+
+@startmindmap
+!theme bluegray
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+bluegray+` theme
+
+@startuml
+
+@startuml
+!theme bluegray
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+bluegray+` theme
+
+@startuml
+
+@startuml
+!theme bluegray
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+bluegray+` theme
+
+@startuml
+
+@startsalt
+!theme bluegray
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+bluegray+` theme
+
+@startuml
+
+@startuml
+!theme bluegray
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+bluegray+` theme
+
+@startuml
+
+@startuml
+!theme bluegray
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+bluegray+` theme
+
+@startuml
+
+@startuml
+!theme bluegray
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+bluegray+` theme
+
+@startuml
+
+@startwbs
+!theme bluegray
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+blueprint+`
+==== Activity with `+blueprint+` theme
+
+@startuml
+
+@startuml
+!theme blueprint
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+blueprint+` theme
+
+@startuml
+
+@startuml
+!theme blueprint
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+blueprint+` theme
+
+@startuml
+
+@startuml
+!theme blueprint
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+blueprint+` theme
+
+@startuml
+
+@startuml
+!theme blueprint
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+blueprint+` theme
+
+@startuml
+
+@startmindmap
+!theme blueprint
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+blueprint+` theme
+
+@startuml
+
+@startuml
+!theme blueprint
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+blueprint+` theme
+
+@startuml
+
+@startuml
+!theme blueprint
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+blueprint+` theme
+
+@startuml
+
+@startsalt
+!theme blueprint
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+blueprint+` theme
+
+@startuml
+
+@startuml
+!theme blueprint
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+blueprint+` theme
+
+@startuml
+
+@startuml
+!theme blueprint
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+blueprint+` theme
+
+@startuml
+
+@startuml
+!theme blueprint
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+blueprint+` theme
+
+@startuml
+
+@startwbs
+!theme blueprint
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+cerulean+`
+==== Activity with `+cerulean+` theme
+
+@startuml
+
+@startuml
+!theme cerulean
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+cerulean+` theme
+
+@startuml
+
+@startuml
+!theme cerulean
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+cerulean+` theme
+
+@startuml
+
+@startuml
+!theme cerulean
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+cerulean+` theme
+
+@startuml
+
+@startuml
+!theme cerulean
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+cerulean+` theme
+
+@startuml
+
+@startmindmap
+!theme cerulean
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+cerulean+` theme
+
+@startuml
+
+@startuml
+!theme cerulean
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+cerulean+` theme
+
+@startuml
+
+@startuml
+!theme cerulean
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+cerulean+` theme
+
+@startuml
+
+@startsalt
+!theme cerulean
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+cerulean+` theme
+
+@startuml
+
+@startuml
+!theme cerulean
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+cerulean+` theme
+
+@startuml
+
+@startuml
+!theme cerulean
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+cerulean+` theme
+
+@startuml
+
+@startuml
+!theme cerulean
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+cerulean+` theme
+
+@startuml
+
+@startwbs
+!theme cerulean
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+cerulean-outline+`
+==== Activity with `+cerulean-outline+` theme
+
+@startuml
+
+@startuml
+!theme cerulean-outline
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+cerulean-outline+` theme
+
+@startuml
+
+@startuml
+!theme cerulean-outline
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+cerulean-outline+` theme
+
+@startuml
+
+@startuml
+!theme cerulean-outline
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+cerulean-outline+` theme
+
+@startuml
+
+@startuml
+!theme cerulean-outline
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+cerulean-outline+` theme
+
+@startuml
+
+@startmindmap
+!theme cerulean-outline
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+cerulean-outline+` theme
+
+@startuml
+
+@startuml
+!theme cerulean-outline
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+cerulean-outline+` theme
+
+@startuml
+
+@startuml
+!theme cerulean-outline
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+cerulean-outline+` theme
+
+@startuml
+
+@startsalt
+!theme cerulean-outline
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+cerulean-outline+` theme
+
+@startuml
+
+@startuml
+!theme cerulean-outline
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+cerulean-outline+` theme
+
+@startuml
+
+@startuml
+!theme cerulean-outline
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+cerulean-outline+` theme
+
+@startuml
+
+@startuml
+!theme cerulean-outline
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+cerulean-outline+` theme
+
+@startuml
+
+@startwbs
+!theme cerulean-outline
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+crt-amber+`
+==== Activity with `+crt-amber+` theme
+
+@startuml
+
+@startuml
+!theme crt-amber
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+crt-amber+` theme
+
+@startuml
+
+@startuml
+!theme crt-amber
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+crt-amber+` theme
+
+@startuml
+
+@startuml
+!theme crt-amber
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+crt-amber+` theme
+
+@startuml
+
+@startuml
+!theme crt-amber
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+crt-amber+` theme
+
+@startuml
+
+@startmindmap
+!theme crt-amber
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+crt-amber+` theme
+
+@startuml
+
+@startuml
+!theme crt-amber
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+crt-amber+` theme
+
+@startuml
+
+@startuml
+!theme crt-amber
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+crt-amber+` theme
+
+@startuml
+
+@startsalt
+!theme crt-amber
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+crt-amber+` theme
+
+@startuml
+
+@startuml
+!theme crt-amber
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+crt-amber+` theme
+
+@startuml
+
+@startuml
+!theme crt-amber
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+crt-amber+` theme
+
+@startuml
+
+@startuml
+!theme crt-amber
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+crt-amber+` theme
+
+@startuml
+
+@startwbs
+!theme crt-amber
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+crt-green+`
+==== Activity with `+crt-green+` theme
+
+@startuml
+
+@startuml
+!theme crt-green
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+crt-green+` theme
+
+@startuml
+
+@startuml
+!theme crt-green
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+crt-green+` theme
+
+@startuml
+
+@startuml
+!theme crt-green
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+crt-green+` theme
+
+@startuml
+
+@startuml
+!theme crt-green
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+crt-green+` theme
+
+@startuml
+
+@startmindmap
+!theme crt-green
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+crt-green+` theme
+
+@startuml
+
+@startuml
+!theme crt-green
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+crt-green+` theme
+
+@startuml
+
+@startuml
+!theme crt-green
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+crt-green+` theme
+
+@startuml
+
+@startsalt
+!theme crt-green
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+crt-green+` theme
+
+@startuml
+
+@startuml
+!theme crt-green
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+crt-green+` theme
+
+@startuml
+
+@startuml
+!theme crt-green
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+crt-green+` theme
+
+@startuml
+
+@startuml
+!theme crt-green
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+crt-green+` theme
+
+@startuml
+
+@startwbs
+!theme crt-green
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+cyborg+`
+==== Activity with `+cyborg+` theme
+
+@startuml
+
+@startuml
+!theme cyborg
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+cyborg+` theme
+
+@startuml
+
+@startuml
+!theme cyborg
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+cyborg+` theme
+
+@startuml
+
+@startuml
+!theme cyborg
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+cyborg+` theme
+
+@startuml
+
+@startuml
+!theme cyborg
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+cyborg+` theme
+
+@startuml
+
+@startmindmap
+!theme cyborg
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+cyborg+` theme
+
+@startuml
+
+@startuml
+!theme cyborg
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+cyborg+` theme
+
+@startuml
+
+@startuml
+!theme cyborg
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+cyborg+` theme
+
+@startuml
+
+@startsalt
+!theme cyborg
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+cyborg+` theme
+
+@startuml
+
+@startuml
+!theme cyborg
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+cyborg+` theme
+
+@startuml
+
+@startuml
+!theme cyborg
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+cyborg+` theme
+
+@startuml
+
+@startuml
+!theme cyborg
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+cyborg+` theme
+
+@startuml
+
+@startwbs
+!theme cyborg
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+cyborg-outline+`
+==== Activity with `+cyborg-outline+` theme
+
+@startuml
+
+@startuml
+!theme cyborg-outline
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+cyborg-outline+` theme
+
+@startuml
+
+@startuml
+!theme cyborg-outline
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+cyborg-outline+` theme
+
+@startuml
+
+@startuml
+!theme cyborg-outline
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+cyborg-outline+` theme
+
+@startuml
+
+@startuml
+!theme cyborg-outline
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+cyborg-outline+` theme
+
+@startuml
+
+@startmindmap
+!theme cyborg-outline
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+cyborg-outline+` theme
+
+@startuml
+
+@startuml
+!theme cyborg-outline
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+cyborg-outline+` theme
+
+@startuml
+
+@startuml
+!theme cyborg-outline
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+cyborg-outline+` theme
+
+@startuml
+
+@startsalt
+!theme cyborg-outline
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+cyborg-outline+` theme
+
+@startuml
+
+@startuml
+!theme cyborg-outline
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+cyborg-outline+` theme
+
+@startuml
+
+@startuml
+!theme cyborg-outline
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+cyborg-outline+` theme
+
+@startuml
+
+@startuml
+!theme cyborg-outline
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+cyborg-outline+` theme
+
+@startuml
+
+@startwbs
+!theme cyborg-outline
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+hacker+`
+==== Activity with `+hacker+` theme
+
+@startuml
+
+@startuml
+!theme hacker
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+hacker+` theme
+
+@startuml
+
+@startuml
+!theme hacker
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+hacker+` theme
+
+@startuml
+
+@startuml
+!theme hacker
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+hacker+` theme
+
+@startuml
+
+@startuml
+!theme hacker
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+hacker+` theme
+
+@startuml
+
+@startmindmap
+!theme hacker
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+hacker+` theme
+
+@startuml
+
+@startuml
+!theme hacker
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+hacker+` theme
+
+@startuml
+
+@startuml
+!theme hacker
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+hacker+` theme
+
+@startuml
+
+@startsalt
+!theme hacker
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+hacker+` theme
+
+@startuml
+
+@startuml
+!theme hacker
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+hacker+` theme
+
+@startuml
+
+@startuml
+!theme hacker
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+hacker+` theme
+
+@startuml
+
+@startuml
+!theme hacker
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+hacker+` theme
+
+@startuml
+
+@startwbs
+!theme hacker
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+lightgray+`
+==== Activity with `+lightgray+` theme
+
+@startuml
+
+@startuml
+!theme lightgray
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+lightgray+` theme
+
+@startuml
+
+@startuml
+!theme lightgray
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+lightgray+` theme
+
+@startuml
+
+@startuml
+!theme lightgray
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+lightgray+` theme
+
+@startuml
+
+@startuml
+!theme lightgray
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+lightgray+` theme
+
+@startuml
+
+@startmindmap
+!theme lightgray
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+lightgray+` theme
+
+@startuml
+
+@startuml
+!theme lightgray
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+lightgray+` theme
+
+@startuml
+
+@startuml
+!theme lightgray
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+lightgray+` theme
+
+@startuml
+
+@startsalt
+!theme lightgray
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+lightgray+` theme
+
+@startuml
+
+@startuml
+!theme lightgray
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+lightgray+` theme
+
+@startuml
+
+@startuml
+!theme lightgray
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+lightgray+` theme
+
+@startuml
+
+@startuml
+!theme lightgray
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+lightgray+` theme
+
+@startuml
+
+@startwbs
+!theme lightgray
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+materia+`
+==== Activity with `+materia+` theme
+
+@startuml
+
+@startuml
+!theme materia
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+materia+` theme
+
+@startuml
+
+@startuml
+!theme materia
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+materia+` theme
+
+@startuml
+
+@startuml
+!theme materia
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+materia+` theme
+
+@startuml
+
+@startuml
+!theme materia
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+materia+` theme
+
+@startuml
+
+@startmindmap
+!theme materia
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+materia+` theme
+
+@startuml
+
+@startuml
+!theme materia
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+materia+` theme
+
+@startuml
+
+@startuml
+!theme materia
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+materia+` theme
+
+@startuml
+
+@startsalt
+!theme materia
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+materia+` theme
+
+@startuml
+
+@startuml
+!theme materia
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+materia+` theme
+
+@startuml
+
+@startuml
+!theme materia
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+materia+` theme
+
+@startuml
+
+@startuml
+!theme materia
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+materia+` theme
+
+@startuml
+
+@startwbs
+!theme materia
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+materia-outline+`
+==== Activity with `+materia-outline+` theme
+
+@startuml
+
+@startuml
+!theme materia-outline
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+materia-outline+` theme
+
+@startuml
+
+@startuml
+!theme materia-outline
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+materia-outline+` theme
+
+@startuml
+
+@startuml
+!theme materia-outline
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+materia-outline+` theme
+
+@startuml
+
+@startuml
+!theme materia-outline
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+materia-outline+` theme
+
+@startuml
+
+@startmindmap
+!theme materia-outline
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+materia-outline+` theme
+
+@startuml
+
+@startuml
+!theme materia-outline
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+materia-outline+` theme
+
+@startuml
+
+@startuml
+!theme materia-outline
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+materia-outline+` theme
+
+@startuml
+
+@startsalt
+!theme materia-outline
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+materia-outline+` theme
+
+@startuml
+
+@startuml
+!theme materia-outline
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+materia-outline+` theme
+
+@startuml
+
+@startuml
+!theme materia-outline
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+materia-outline+` theme
+
+@startuml
+
+@startuml
+!theme materia-outline
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+materia-outline+` theme
+
+@startuml
+
+@startwbs
+!theme materia-outline
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+metal+`
+==== Activity with `+metal+` theme
+
+@startuml
+
+@startuml
+!theme metal
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+metal+` theme
+
+@startuml
+
+@startuml
+!theme metal
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+metal+` theme
+
+@startuml
+
+@startuml
+!theme metal
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+metal+` theme
+
+@startuml
+
+@startuml
+!theme metal
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+metal+` theme
+
+@startuml
+
+@startmindmap
+!theme metal
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+metal+` theme
+
+@startuml
+
+@startuml
+!theme metal
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+metal+` theme
+
+@startuml
+
+@startuml
+!theme metal
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+metal+` theme
+
+@startuml
+
+@startsalt
+!theme metal
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+metal+` theme
+
+@startuml
+
+@startuml
+!theme metal
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+metal+` theme
+
+@startuml
+
+@startuml
+!theme metal
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+metal+` theme
+
+@startuml
+
+@startuml
+!theme metal
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+metal+` theme
+
+@startuml
+
+@startwbs
+!theme metal
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+mimeograph+`
+==== Activity with `+mimeograph+` theme
+
+@startuml
+
+@startuml
+!theme mimeograph
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+mimeograph+` theme
+
+@startuml
+
+@startuml
+!theme mimeograph
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+mimeograph+` theme
+
+@startuml
+
+@startuml
+!theme mimeograph
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+mimeograph+` theme
+
+@startuml
+
+@startuml
+!theme mimeograph
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+mimeograph+` theme
+
+@startuml
+
+@startmindmap
+!theme mimeograph
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+mimeograph+` theme
+
+@startuml
+
+@startuml
+!theme mimeograph
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+mimeograph+` theme
+
+@startuml
+
+@startuml
+!theme mimeograph
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+mimeograph+` theme
+
+@startuml
+
+@startsalt
+!theme mimeograph
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+mimeograph+` theme
+
+@startuml
+
+@startuml
+!theme mimeograph
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+mimeograph+` theme
+
+@startuml
+
+@startuml
+!theme mimeograph
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+mimeograph+` theme
+
+@startuml
+
+@startuml
+!theme mimeograph
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+mimeograph+` theme
+
+@startuml
+
+@startwbs
+!theme mimeograph
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+minty+`
+==== Activity with `+minty+` theme
+
+@startuml
+
+@startuml
+!theme minty
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+minty+` theme
+
+@startuml
+
+@startuml
+!theme minty
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+minty+` theme
+
+@startuml
+
+@startuml
+!theme minty
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+minty+` theme
+
+@startuml
+
+@startuml
+!theme minty
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+minty+` theme
+
+@startuml
+
+@startmindmap
+!theme minty
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+minty+` theme
+
+@startuml
+
+@startuml
+!theme minty
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+minty+` theme
+
+@startuml
+
+@startuml
+!theme minty
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+minty+` theme
+
+@startuml
+
+@startsalt
+!theme minty
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+minty+` theme
+
+@startuml
+
+@startuml
+!theme minty
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+minty+` theme
+
+@startuml
+
+@startuml
+!theme minty
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+minty+` theme
+
+@startuml
+
+@startuml
+!theme minty
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+minty+` theme
+
+@startuml
+
+@startwbs
+!theme minty
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+plain+`
+==== Activity with `+plain+` theme
+
+@startuml
+
+@startuml
+!theme plain
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+plain+` theme
+
+@startuml
+
+@startuml
+!theme plain
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+plain+` theme
+
+@startuml
+
+@startuml
+!theme plain
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+plain+` theme
+
+@startuml
+
+@startuml
+!theme plain
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+plain+` theme
+
+@startuml
+
+@startmindmap
+!theme plain
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+plain+` theme
+
+@startuml
+
+@startuml
+!theme plain
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+plain+` theme
+
+@startuml
+
+@startuml
+!theme plain
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+plain+` theme
+
+@startuml
+
+@startsalt
+!theme plain
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+plain+` theme
+
+@startuml
+
+@startuml
+!theme plain
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+plain+` theme
+
+@startuml
+
+@startuml
+!theme plain
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+plain+` theme
+
+@startuml
+
+@startuml
+!theme plain
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+plain+` theme
+
+@startuml
+
+@startwbs
+!theme plain
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+resume-light+`
+==== Activity with `+resume-light+` theme
+
+@startuml
+
+@startuml
+!theme resume-light
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+resume-light+` theme
+
+@startuml
+
+@startuml
+!theme resume-light
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+resume-light+` theme
+
+@startuml
+
+@startuml
+!theme resume-light
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+resume-light+` theme
+
+@startuml
+
+@startuml
+!theme resume-light
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+resume-light+` theme
+
+@startuml
+
+@startmindmap
+!theme resume-light
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+resume-light+` theme
+
+@startuml
+
+@startuml
+!theme resume-light
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+resume-light+` theme
+
+@startuml
+
+@startuml
+!theme resume-light
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+resume-light+` theme
+
+@startuml
+
+@startsalt
+!theme resume-light
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+resume-light+` theme
+
+@startuml
+
+@startuml
+!theme resume-light
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+resume-light+` theme
+
+@startuml
+
+@startuml
+!theme resume-light
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+resume-light+` theme
+
+@startuml
+
+@startuml
+!theme resume-light
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+resume-light+` theme
+
+@startuml
+
+@startwbs
+!theme resume-light
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+sandstone+`
+==== Activity with `+sandstone+` theme
+
+@startuml
+
+@startuml
+!theme sandstone
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+sandstone+` theme
+
+@startuml
+
+@startuml
+!theme sandstone
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+sandstone+` theme
+
+@startuml
+
+@startuml
+!theme sandstone
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+sandstone+` theme
+
+@startuml
+
+@startuml
+!theme sandstone
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+sandstone+` theme
+
+@startuml
+
+@startmindmap
+!theme sandstone
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+sandstone+` theme
+
+@startuml
+
+@startuml
+!theme sandstone
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+sandstone+` theme
+
+@startuml
+
+@startuml
+!theme sandstone
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+sandstone+` theme
+
+@startuml
+
+@startsalt
+!theme sandstone
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+sandstone+` theme
+
+@startuml
+
+@startuml
+!theme sandstone
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+sandstone+` theme
+
+@startuml
+
+@startuml
+!theme sandstone
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+sandstone+` theme
+
+@startuml
+
+@startuml
+!theme sandstone
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+sandstone+` theme
+
+@startuml
+
+@startwbs
+!theme sandstone
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+silver+`
+==== Activity with `+silver+` theme
+
+@startuml
+
+@startuml
+!theme silver
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+silver+` theme
+
+@startuml
+
+@startuml
+!theme silver
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+silver+` theme
+
+@startuml
+
+@startuml
+!theme silver
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+silver+` theme
+
+@startuml
+
+@startuml
+!theme silver
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+silver+` theme
+
+@startuml
+
+@startmindmap
+!theme silver
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+silver+` theme
+
+@startuml
+
+@startuml
+!theme silver
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+silver+` theme
+
+@startuml
+
+@startuml
+!theme silver
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+silver+` theme
+
+@startuml
+
+@startsalt
+!theme silver
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+silver+` theme
+
+@startuml
+
+@startuml
+!theme silver
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+silver+` theme
+
+@startuml
+
+@startuml
+!theme silver
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+silver+` theme
+
+@startuml
+
+@startuml
+!theme silver
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+silver+` theme
+
+@startuml
+
+@startwbs
+!theme silver
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+sketchy+`
+==== Activity with `+sketchy+` theme
+
+@startuml
+
+@startuml
+!theme sketchy
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+sketchy+` theme
+
+@startuml
+
+@startuml
+!theme sketchy
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+sketchy+` theme
+
+@startuml
+
+@startuml
+!theme sketchy
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+sketchy+` theme
+
+@startuml
+
+@startuml
+!theme sketchy
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+sketchy+` theme
+
+@startuml
+
+@startmindmap
+!theme sketchy
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+sketchy+` theme
+
+@startuml
+
+@startuml
+!theme sketchy
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+sketchy+` theme
+
+@startuml
+
+@startuml
+!theme sketchy
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+sketchy+` theme
+
+@startuml
+
+@startsalt
+!theme sketchy
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+sketchy+` theme
+
+@startuml
+
+@startuml
+!theme sketchy
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+sketchy+` theme
+
+@startuml
+
+@startuml
+!theme sketchy
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+sketchy+` theme
+
+@startuml
+
+@startuml
+!theme sketchy
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+sketchy+` theme
+
+@startuml
+
+@startwbs
+!theme sketchy
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+=== Theme `+sketchy-outline+`
+==== Activity with `+sketchy-outline+` theme
+
+@startuml
+
+@startuml
+!theme sketchy-outline
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+
+=== Theme `+sketchy-outline+`
+==== Activity with `+sketchy-outline+` theme
+
+@startuml
+
+@startuml
+!theme sketchy-outline
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+sketchy-outline+` theme
+
+@startuml
+
+@startuml
+!theme sketchy-outline
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+sketchy-outline+` theme
+
+@startuml
+
+@startuml
+!theme sketchy-outline
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+sketchy-outline+` theme
+
+@startuml
+
+@startuml
+!theme sketchy-outline
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+sketchy-outline+` theme
+
+@startuml
+
+@startmindmap
+!theme sketchy-outline
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+sketchy-outline+` theme
+
+@startuml
+
+@startuml
+!theme sketchy-outline
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+sketchy-outline+` theme
+
+@startuml
+
+@startuml
+!theme sketchy-outline
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+sketchy-outline+` theme
+
+@startuml
+
+@startsalt
+!theme sketchy-outline
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+sketchy-outline+` theme
+
+@startuml
+
+@startuml
+!theme sketchy-outline
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+sketchy-outline+` theme
+
+@startuml
+
+@startuml
+!theme sketchy-outline
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+sketchy-outline+` theme
+
+@startuml
+
+@startuml
+!theme sketchy-outline
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+sketchy-outline+` theme
+
+@startuml
+
+@startwbs
+!theme sketchy-outline
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+spacelab+`
+==== Activity with `+spacelab+` theme
+
+@startuml
+
+@startuml
+!theme spacelab
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+spacelab+` theme
+
+@startuml
+
+@startuml
+!theme spacelab
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+spacelab+` theme
+
+@startuml
+
+@startuml
+!theme spacelab
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+spacelab+` theme
+
+@startuml
+
+@startuml
+!theme spacelab
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+spacelab+` theme
+
+@startuml
+
+@startmindmap
+!theme spacelab
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+spacelab+` theme
+
+@startuml
+
+@startuml
+!theme spacelab
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+spacelab+` theme
+
+@startuml
+
+@startuml
+!theme spacelab
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+spacelab+` theme
+
+@startuml
+
+@startsalt
+!theme spacelab
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+spacelab+` theme
+
+@startuml
+
+@startuml
+!theme spacelab
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+spacelab+` theme
+
+@startuml
+
+@startuml
+!theme spacelab
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+spacelab+` theme
+
+@startuml
+
+@startuml
+!theme spacelab
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+spacelab+` theme
+
+@startuml
+
+@startwbs
+!theme spacelab
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+toy+`
+==== Activity with `+toy+` theme
+
+@startuml
+
+@startuml
+!theme toy
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+toy+` theme
+
+@startuml
+
+@startuml
+!theme toy
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+toy+` theme
+
+@startuml
+
+@startuml
+!theme toy
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+toy+` theme
+
+@startuml
+
+@startuml
+!theme toy
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+toy+` theme
+
+@startuml
+
+@startmindmap
+!theme toy
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+toy+` theme
+
+@startuml
+
+@startuml
+!theme toy
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+toy+` theme
+
+@startuml
+
+@startuml
+!theme toy
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+toy+` theme
+
+@startuml
+
+@startsalt
+!theme toy
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+toy+` theme
+
+@startuml
+
+@startuml
+!theme toy
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+toy+` theme
+
+@startuml
+
+@startuml
+!theme toy
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+toy+` theme
+
+@startuml
+
+@startuml
+!theme toy
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+toy+` theme
+
+@startuml
+
+@startwbs
+!theme toy
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+united+`
+==== Activity with `+united+` theme
+
+@startuml
+
+@startuml
+!theme united
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+united+` theme
+
+@startuml
+
+@startuml
+!theme united
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+united+` theme
+
+@startuml
+
+@startuml
+!theme united
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+united+` theme
+
+@startuml
+
+@startuml
+!theme united
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+united+` theme
+
+@startuml
+
+@startmindmap
+!theme united
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+united+` theme
+
+@startuml
+
+@startuml
+!theme united
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+united+` theme
+
+@startuml
+
+@startuml
+!theme united
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+united+` theme
+
+@startuml
+
+@startsalt
+!theme united
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+united+` theme
+
+@startuml
+
+@startuml
+!theme united
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+united+` theme
+
+@startuml
+
+@startuml
+!theme united
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+united+` theme
+
+@startuml
+
+@startuml
+!theme united
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+united+` theme
+
+@startuml
+
+@startwbs
+!theme united
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+vibrant+`
+==== Activity with `+vibrant+` theme
+
+@startuml
+
+@startuml
+!theme vibrant
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+vibrant+` theme
+
+@startuml
+
+@startuml
+!theme vibrant
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+vibrant+` theme
+
+@startuml
+
+@startuml
+!theme vibrant
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+vibrant+` theme
+
+@startuml
+
+@startuml
+!theme vibrant
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+vibrant+` theme
+
+@startuml
+
+@startmindmap
+!theme vibrant
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+vibrant+` theme
+
+@startuml
+
+@startuml
+!theme vibrant
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+vibrant+` theme
+
+@startuml
+
+@startuml
+!theme vibrant
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+vibrant+` theme
+
+@startuml
+
+@startsalt
+!theme vibrant
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+vibrant+` theme
+
+@startuml
+
+@startuml
+!theme vibrant
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+vibrant+` theme
+
+@startuml
+
+@startuml
+!theme vibrant
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+vibrant+` theme
+
+@startuml
+
+@startuml
+!theme vibrant
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+vibrant+` theme
+
+@startuml
+
+@startwbs
+!theme vibrant
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+superhero+`
+==== Activity with `+superhero+` theme
+
+@startuml
+
+@startuml
+!theme superhero
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+superhero+` theme
+
+@startuml
+
+@startuml
+!theme superhero
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+superhero+` theme
+
+@startuml
+
+@startuml
+!theme superhero
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+superhero+` theme
+
+@startuml
+
+@startuml
+!theme superhero
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+superhero+` theme
+
+@startuml
+
+@startmindmap
+!theme superhero
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+superhero+` theme
+
+@startuml
+
+@startuml
+!theme superhero
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+superhero+` theme
+
+@startuml
+
+@startuml
+!theme superhero
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+superhero+` theme
+
+@startuml
+
+@startsalt
+!theme superhero
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+superhero+` theme
+
+@startuml
+
+@startuml
+!theme superhero
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+superhero+` theme
+
+@startuml
+
+@startuml
+!theme superhero
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+superhero+` theme
+
+@startuml
+
+@startuml
+!theme superhero
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+superhero+` theme
+
+@startuml
+
+@startwbs
+!theme superhero
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+superhero-outline+`
+==== Activity with `+superhero-outline+` theme
+
+@startuml
+
+@startuml
+!theme superhero-outline
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+superhero-outline+` theme
+
+@startuml
+
+@startuml
+!theme superhero-outline
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+superhero-outline+` theme
+
+@startuml
+
+@startuml
+!theme superhero-outline
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+superhero-outline+` theme
+
+@startuml
+
+@startuml
+!theme superhero-outline
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+superhero-outline+` theme
+
+@startuml
+
+@startmindmap
+!theme superhero-outline
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+superhero-outline+` theme
+
+@startuml
+
+@startuml
+!theme superhero-outline
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+superhero-outline+` theme
+
+@startuml
+
+@startuml
+!theme superhero-outline
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+superhero-outline+` theme
+
+@startuml
+
+@startsalt
+!theme superhero-outline
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+superhero-outline+` theme
+
+@startuml
+
+@startuml
+!theme superhero-outline
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+superhero-outline+` theme
+
+@startuml
+
+@startuml
+!theme superhero-outline
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+superhero-outline+` theme
+
+@startuml
+
+@startuml
+!theme superhero-outline
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+superhero-outline+` theme
+
+@startuml
+
+@startwbs
+!theme superhero-outline
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+reddress-darkblue+`
+==== Activity with `+reddress-darkblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkblue
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+reddress-darkblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkblue
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+reddress-darkblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkblue
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+reddress-darkblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkblue
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+reddress-darkblue+` theme
+
+@startuml
+
+@startmindmap
+!theme reddress-darkblue
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+reddress-darkblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkblue
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+reddress-darkblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkblue
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+reddress-darkblue+` theme
+
+@startuml
+
+@startsalt
+!theme reddress-darkblue
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+reddress-darkblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkblue
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+reddress-darkblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkblue
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+reddress-darkblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkblue
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+reddress-darkblue+` theme
+
+@startuml
+
+@startwbs
+!theme reddress-darkblue
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+reddress-darkorange+`
+==== Activity with `+reddress-darkorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkorange
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+reddress-darkorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkorange
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+reddress-darkorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkorange
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+reddress-darkorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkorange
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+reddress-darkorange+` theme
+
+@startuml
+
+@startmindmap
+!theme reddress-darkorange
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+reddress-darkorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkorange
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+reddress-darkorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkorange
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+reddress-darkorange+` theme
+
+@startuml
+
+@startsalt
+!theme reddress-darkorange
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+reddress-darkorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkorange
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+reddress-darkorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkorange
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+reddress-darkorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkorange
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+reddress-darkorange+` theme
+
+@startuml
+
+@startwbs
+!theme reddress-darkorange
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+reddress-darkred+`
+==== Activity with `+reddress-darkred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkred
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+reddress-darkred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkred
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+reddress-darkred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkred
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+reddress-darkred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkred
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+reddress-darkred+` theme
+
+@startuml
+
+@startmindmap
+!theme reddress-darkred
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+reddress-darkred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkred
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+reddress-darkred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkred
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+reddress-darkred+` theme
+
+@startuml
+
+@startsalt
+!theme reddress-darkred
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+reddress-darkred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkred
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+reddress-darkred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkred
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+reddress-darkred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-darkred
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+reddress-darkred+` theme
+
+@startuml
+
+@startwbs
+!theme reddress-darkred
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+reddress-lightblue+`
+==== Activity with `+reddress-lightblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightblue
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+reddress-lightblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightblue
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+reddress-lightblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightblue
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+reddress-lightblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightblue
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+reddress-lightblue+` theme
+
+@startuml
+
+@startmindmap
+!theme reddress-lightblue
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+reddress-lightblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightblue
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+reddress-lightblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightblue
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+reddress-lightblue+` theme
+
+@startuml
+
+@startsalt
+!theme reddress-lightblue
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+reddress-lightblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightblue
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+reddress-lightblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightblue
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+reddress-lightblue+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightblue
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+reddress-lightblue+` theme
+
+@startuml
+
+@startwbs
+!theme reddress-lightblue
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+=== Theme `+reddress-lightgreen+`
+==== Activity with `+reddress-lightgreen+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightgreen
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+
+=== Theme `+reddress-lightgreen+`
+==== Class with `+reddress-lightgreen+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightgreen
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+reddress-lightgreen+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightgreen
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+reddress-lightgreen+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightgreen
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+reddress-lightgreen+` theme
+
+@startuml
+
+@startmindmap
+!theme reddress-lightgreen
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+reddress-lightgreen+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightgreen
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+reddress-lightgreen+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightgreen
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+reddress-lightgreen+` theme
+
+@startuml
+
+@startsalt
+!theme reddress-lightgreen
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+reddress-lightgreen+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightgreen
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+reddress-lightgreen+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightgreen
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+reddress-lightgreen+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightgreen
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+reddress-lightgreen+` theme
+
+@startuml
+
+@startwbs
+!theme reddress-lightgreen
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+reddress-lightorange+`
+==== Activity with `+reddress-lightorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightorange
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+reddress-lightorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightorange
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+reddress-lightorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightorange
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+reddress-lightorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightorange
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+reddress-lightorange+` theme
+
+@startuml
+
+@startmindmap
+!theme reddress-lightorange
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+reddress-lightorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightorange
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+reddress-lightorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightorange
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+reddress-lightorange+` theme
+
+@startuml
+
+@startsalt
+!theme reddress-lightorange
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+reddress-lightorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightorange
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+reddress-lightorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightorange
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+reddress-lightorange+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightorange
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+reddress-lightorange+` theme
+
+@startuml
+
+@startwbs
+!theme reddress-lightorange
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+=== Theme `+reddress-lightred+`
+==== Activity with `+reddress-lightred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightred
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+
+@enduml
+
+
+==== Class with `+reddress-lightred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightred
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+interface interface
+@enduml
+
+@enduml
+
+
+==== Deployment with `+reddress-lightred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightred
+actor actor
+actor/ "actor/"
+agent agent
+artifact artifact
+boundary boundary
+card card
+circle circle
+cloud cloud
+collections collections
+component component
+control control
+database database
+entity entity
+file file
+folder folder
+frame frame
+hexagon hexagon
+interface interface
+label label
+node node
+package package
+person person
+queue queue
+rectangle rectangle
+stack stack
+storage storage
+usecase usecase
+usecase/ "usecase/"
+@enduml
+
+@enduml
+
+
+==== Gantt with `+reddress-lightred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightred
+[Task1] lasts 20 days
+note bottom
+ memo1 ...
+ memo2 ...
+ explanations1 ...
+ explanations2 ...
+end note
+[Task2] lasts 4 days
+[Task1] -> [Task2]
+-- Separator title --
+[M1] happens on 5 days after [Task1]'s end
+-- end --
+@enduml
+
+@enduml
+
+
+==== Mindmap with `+reddress-lightred+` theme
+
+@startuml
+
+@startmindmap
+!theme reddress-lightred
++ root
+**:right_1.1
+right_1.2;
+++ right_2
+
+left side
+
+-- left_1
+-- left_2
+**:left_3.1
+left_3.2;
+@endmindmap
+
+@enduml
+
+
+==== Nwdiag with `+reddress-lightred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightred
+nwdiag {
+ network DMZ {
+ address = "y.x.x.x/24"
+ web01 [address = "y.x.x.1"];
+ web02 [address = "y.x.x.2"];
+ }
+
+ network Internal {
+ web01;
+ web02;
+ db01 [address = "w.w.w.z", shape = database];
+ }
+
+ group {
+ description = "long group label";
+ web01;
+ web02;
+ db01;
+ }
+}
+@enduml
+
+@enduml
+
+
+==== Object with `+reddress-lightred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightred
+
+object user1
+user1 : name = "Dummy"
+user1 : id = 123
+
+object user2 {
+ name = "Dummy"
+ id = 123
+}
+
+object o1
+object o2
+diamond dia
+object o3
+
+o1 --> dia
+o2 --> dia
+dia --> o3
+@enduml
+
+@enduml
+
+
+==== Salt with `+reddress-lightred+` theme
+
+@startuml
+
+@startsalt
+!theme reddress-lightred
+{+
+ Just plain text
+ [This is my button]
+ () Unchecked radio
+ (X) Checked radio
+ [] Unchecked box
+ [X] Checked box
+ "Enter text here "
+ ^This is a droplist^
+}
+@endsalt
+@enduml
+
+
+==== Sequence with `+reddress-lightred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightred
+participant Participant as Foo
+actor Actor as Foo1
+boundary Boundary as Foo2
+control Control as Foo3
+entity Entity as Foo4
+database Database as Foo5
+collections Collections as Foo6
+queue Queue as Foo7
+Foo -> Foo1 : To actor
+Foo -> Foo2 : To boundary
+Foo -> Foo3 : To control
+Foo -> Foo4 : To entity
+Foo -> Foo5 : To database
+Foo -> Foo6 : To collections
+Foo -> Foo7: To queue
+@enduml
+
+@enduml
+
+
+==== State with `+reddress-lightred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightred
+state choice1 <>
+state fork1 <>
+state join2 <>
+state end3 <>
+
+[*] --> choice1 : from start\nto choice
+choice1 --> fork1 : from choice\nto fork
+choice1 --> join2 : from choice\nto join
+choice1 --> end3 : from choice\nto end
+
+fork1 ---> State1 : from fork\nto state
+fork1 --> State2 : from fork\nto state
+
+State2 --> join2 : from state\nto join
+State1 --> [*] : from state\nto end
+
+join2 --> [*] : from join\nto end
+@enduml
+
+@enduml
+
+
+==== Timing with `+reddress-lightred+` theme
+
+@startuml
+
+@startuml
+!theme reddress-lightred
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+@enduml
+
+
+==== WBS with `+reddress-lightred+` theme
+
+@startuml
+
+@startwbs
+!theme reddress-lightred
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+@enduml
+
+
+
+== ๐ง Under construction...
+
+
+Currently missing:
+* All activity
+* Object
+* Timing
+* Network (nwdiag)
+* Salt
+* Archimate
+* Gantt
+* JSON/YAML
+* Git/Wire/...
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/theme.adoc b/plantuml-docs/docs_from_alphadoc/theme.adoc
new file mode 100644
index 00000000..d83480d9
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/theme.adoc
@@ -0,0 +1,90 @@
+== Themes
+
+Following the work from https://github.com/bschwarz/puml-themes[Brett Schwarz], we have integrated several themes into https://github.com/plantuml/plantuml/tree/master/themes[the main core library].
+
+Since those themes are included into the library, it is working out of the box: you don't need to install anything on your side.
+You just have to use the `+!theme+` directive:
+
+
+@startuml
+!theme spacelab
+class Example {
+ Theme spacelab
+}
+@enduml
+
+
+
+@startuml
+!theme spacelab
+a -> b
+b -> c
+@enduml
+
+
+
+== List of available themes
+
+Several websites are listing available themes:
+
+* https://the-lum.github.io/puml-themes-gallery/[Gallery of all official PlantUML themes].
+* https://bschwarz.github.io/puml-themes[Examples of some Puml Themes] made by https://github.com/bschwarz/puml-themes[Brett Schwarz] on https://bschwarz.github.io/puml-themes/gallery.html[the Theme Gallery].
+
+
+Finally, you can list all available themes from your PlantUML library:
+
+
+@startuml
+help themes
+@enduml
+
+
+
+== Coloring message with some procedures included on some theme
+
+Some theme includes some procedures, to help coloring message, as:
+* `+$success("")+`
+* `+$failure("")+`
+* `+$warning("")+`
+
+Example:
+
+
+@startuml
+!theme spacelab
+Bob -> Alice : hello
+Bob <- Alice : $success("success: hello B.")
+Bob -x Alice : $failure("failure")
+Bob ->> Alice : $warning("warning")
+@enduml
+
+
+
+== Local themes
+
+You can create your own theme on your local file system. You can https://github.com/plantuml/plantuml/tree/master/themes[duplicate any existing theme] to create your own one.
+
+By default, a theme file is named `+puml-theme-foo.puml+` where `+foo+` is the name of the theme.
+
+To invoke a local theme, you have to use the following directive:
+
+----
+!theme foo from /path/to/themes/folder
+----
+
+
+== Themes from the Internet
+
+Other repositories can also publish themes for PlantUML.
+
+Theme files must follow the same convention: `+puml-theme-foo.puml+` where `+foo+` is the name of the theme.
+
+To use a theme from a remote repository, you have to use the following directive:
+
+----
+!theme amiga from https://raw.githubusercontent.com/plantuml/plantuml/master/themes
+----
+
+If you find any interesting theme, you can also propose a pull request so that we integrate this theme into https://github.com/plantuml/plantuml/tree/master/themes[the main core library].
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/timing-diagram-issues.adoc b/plantuml-docs/docs_from_alphadoc/timing-diagram-issues.adoc
new file mode 100644
index 00000000..39a688f9
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/timing-diagram-issues.adoc
@@ -0,0 +1,86 @@
+== Timing Diagram Issues (timing-diagram-issues)
+
+This page lists issues on link::timing-diagram[Timing Diagram].
+
+
+== Timing-diagram issues
+
+
+== Tests of clock's pulse
+
+=== No pulse
+
+@startuml
+title period 10
+clock C with period 10
+@enduml
+
+
+=== pulse < period
+
+@startuml
+title period 10 pulse 0
+clock C with period 10 pulse 0
+@enduml
+
+
+
+@startuml
+title period 10 pulse 1
+clock C with period 10 pulse 1
+@enduml
+
+
+
+@startuml
+title period 10 pulse 5
+clock C with period 10 pulse 5
+@enduml
+
+
+
+@startuml
+title period 10 pulse 9
+clock C with period 10 pulse 9
+@enduml
+
+
+=== pulse = period
+
+@startuml
+title period 10 pulse 10
+clock C with period 10 pulse 10
+@enduml
+
+
+=== pulse > period
+
+@startuml
+title period 10 pulse 11
+clock C with period 10 pulse 11
+@enduml
+
+
+
+@startuml
+title period 10 pulse 15
+clock C with period 10 pulse 15
+@enduml
+
+
+
+@startuml
+title period 10 pulse 20
+clock C with period 10 pulse 20
+@enduml
+
+
+=== pulse >> period
+
+@startuml
+title period 10 pulse 50
+clock C with period 10 pulse 50
+@enduml
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/timing-diagram.adoc b/plantuml-docs/docs_from_alphadoc/timing-diagram.adoc
new file mode 100644
index 00000000..108ee72a
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/timing-diagram.adoc
@@ -0,0 +1,917 @@
+== Timing Diagram
+
+This is still under construction. You can propose new features if you need some.
+
+
+== Declaring element or participant
+
+You declare participant using the following keywords, depending on how you want them to be drawn.
+
+|===
+| Keyword | Description
+
+| `+analog+`
+| An `+analog+` signal is continuous, and the values are linearly interpolated between the given setpoints
+
+| `+binary+`
+| A `+binary+` signal restricted to only 2 states
+
+| `+clock+`
+| A `+clocked+` signal that repeatedly transitions from high to low, with a `+period+`, and an optional `+pulse+` and `+offset+`
+
+| `+concise+`
+| A simplified `+concise+` signal designed to show the movement of data (great for messages)
+
+| `+robust+`
+| A `+robust+` complex line signal designed to show the transition from one state to another (can have many states)
+
+|===
+
+
+
+You define state change using the `+@+` notation, and the `+is+` verb.
+
+
+@startuml
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+@0
+WU is Idle
+WB is Idle
+
+@100
+WU is Waiting
+WB is Processing
+
+@300
+WB is Waiting
+@enduml
+
+
+
+@startuml
+clock "Clock_0" as C0 with period 50
+clock "Clock_1" as C1 with period 50 pulse 15 offset 10
+binary "Binary" as B
+concise "Concise" as C
+robust "Robust" as R
+analog "Analog" as A
+
+
+@0
+C is Idle
+R is Idle
+A is 0
+
+@100
+B is high
+C is Waiting
+R is Processing
+A is 3
+
+@300
+R is Waiting
+A is 1
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/14631[QA-14631], https://forum.plantuml.net/14647[QA-14647] and https://forum.plantuml.net/11288/mixed-signal-timing-diagram[QA-11288]]__
+
+
+== Binary and Clock
+
+It's also possible to have binary and clock signal, using the following keywords:
+
+* `+binary+`
+* `+clock+`
+
+
+@startuml
+clock clk with period 1
+binary "Enable" as EN
+
+@0
+EN is low
+
+@5
+EN is high
+
+@10
+EN is low
+@enduml
+
+
+
+== Adding message
+
+You can add message using the following syntax.
+
+
+@startuml
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+@0
+WU is Idle
+WB is Idle
+
+@100
+WU -> WB : URL
+WU is Waiting
+WB is Processing
+
+@300
+WB is Waiting
+@enduml
+
+
+
+
+== Relative time
+
+It is possible to use relative time with `+@+`.
+
+@startuml
+robust "DNS Resolver" as DNS
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+@0
+WU is Idle
+WB is Idle
+DNS is Idle
+
+@+100
+WU -> WB : URL
+WU is Waiting
+WB is Processing
+
+@+200
+WB is Waiting
+WB -> DNS@+50 : Resolve URL
+
+@+100
+DNS is Processing
+
+@+300
+DNS is Idle
+@enduml
+
+
+
+
+== Anchor Points
+
+Instead of using absolute or relative time on an absolute time you can define a time as an anchor point by using the `+as+` keyword and starting the name with a `+:+`.
+
+----
+@XX as :
+----
+
+
+
+@startuml
+clock clk with period 1
+binary "enable" as EN
+concise "dataBus" as db
+
+@0 as :start
+@5 as :en_high
+@10 as :en_low
+@:en_high-2 as :en_highMinus2
+
+@:start
+EN is low
+db is "0x0000"
+
+@:en_high
+EN is high
+
+@:en_low
+EN is low
+
+@:en_highMinus2
+db is "0xf23a"
+
+@:en_high+6
+db is "0x0000"
+@enduml
+
+
+
+== Participant oriented
+
+Rather than declare the diagram in chronological order, you can define it by participant.
+
+
+@startuml
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+@WB
+0 is idle
++200 is Proc.
++100 is Waiting
+
+@WU
+0 is Waiting
++500 is ok
+@enduml
+
+
+
+
+== Setting scale
+You can also set a specific scale.
+
+@startuml
+concise "Web User" as WU
+scale 100 as 50 pixels
+
+@WU
+0 is Waiting
++500 is ok
+@enduml
+
+
+When using absolute Times/Dates, 1 "tick" is equivalent to 1 second.
+
+@startuml
+concise "Season" as S
+'30 days is scaled to 50 pixels
+scale 2592000 as 50 pixels
+
+@2000/11/01
+S is "Winter"
+
+@2001/02/01
+S is "Spring"
+
+@2001/05/01
+S is "Summer"
+
+@2001/08/01
+S is "Fall"
+@enduml
+
+
+
+== Initial state
+You can also define an inital state.
+
+@startuml
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+
+@WU
+0 is Waiting
++500 is ok
+@enduml
+
+
+
+
+== Intricated state
+
+A signal could be in some undefined state.
+
+=== Intricated or undefined robust state
+
+@startuml
+robust "Signal1" as S1
+robust "Signal2" as S2
+S1 has 0,1,2,hello
+S2 has 0,1,2
+@0
+S1 is 0
+S2 is 0
+@100
+S1 is {0,1} #SlateGrey
+S2 is {0,1}
+@200
+S1 is 1
+S2 is 0
+@300
+S1 is hello
+S2 is {0,2}
+@enduml
+
+
+=== Intricated or undefined binary state
+
+@startuml
+clock "Clock" as C with period 2
+binary "Enable" as EN
+
+@0
+EN is low
+@1
+EN is high
+@3
+EN is low
+@5
+EN is {low,high}
+@10
+EN is low
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/11936[QA-11936] and https://forum.plantuml.net/15933[QA-15933]]__
+
+
+== Hidden state
+
+It is also possible to hide some state.
+
+
+@startuml
+concise "Web User" as WU
+
+@0
+WU is {-}
+
+@100
+WU is A1
+
+@200
+WU is {-}
+
+@300
+WU is {hidden}
+
+@400
+WU is A3
+
+@500
+WU is {-}
+@enduml
+
+
+
+@startuml
+scale 1 as 50 pixels
+
+concise state0
+concise substate1
+robust bit2
+
+bit2 has HIGH,LOW
+
+@state0
+0 is 18_start
+6 is s_dPause
+8 is 10_data
+14 is {hidden}
+
+@substate1
+0 is sSeq
+4 is sPause
+6 is {hidden}
+8 is dSeq
+12 is dPause
+14 is {hidden}
+
+@bit2
+0 is HIGH
+2 is LOW
+4 is {hidden}
+8 is HIGH
+10 is LOW
+12 is {hidden}
+@enduml
+
+__[Ref. https://forum.plantuml.net/12222[QA-12222]]__
+
+
+== Hide time axis
+
+It is possible to hide time axis.
+
+
+@startuml
+hide time-axis
+concise "Web User" as WU
+
+WU is Absent
+
+@WU
+0 is Waiting
++500 is ok
+@enduml
+
+
+
+== Using Time and Date
+
+It is possible to use time or date.
+
+
+
+@startuml
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+@2019/07/02
+WU is Idle
+WB is Idle
+
+@2019/07/04
+WU is Waiting : some note
+WB is Processing : some other note
+
+@2019/07/05
+WB is Waiting
+@enduml
+
+
+
+
+
+@startuml
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+@1:15:00
+WU is Idle
+WB is Idle
+
+@1:16:30
+WU is Waiting : some note
+WB is Processing : some other note
+
+@1:17:30
+WB is Waiting
+@enduml
+
+
+
+
+
+
+== Adding constraint
+It is possible to display time constraints on the diagrams.
+
+@startuml
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+
+
+
+
+== Highlighted period
+
+You can higlight a part of diagram.
+
+
+@startuml
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+@0
+WU is Idle
+WB is Idle
+
+@100
+WU -> WB : URL
+WU is Waiting #LightCyan;line:Aqua
+
+@200
+WB is Proc.
+
+@300
+WU -> WB@350 : URL2
+WB is Waiting
+
+@+200
+WU is ok
+
+@+200
+WB is Idle
+
+highlight 200 to 450 #Gold;line:DimGrey : This is my caption
+highlight 600 to 700 : This is another\nhighlight
+@enduml
+
+
+
+__[Ref. https://forum.plantuml.net/10868/highlighted-periods-in-timing-diagrams[QA-10868]]__
+
+
+== Using notes
+
+You can use the `+note top of+` and `+note bottom of+`
+keywords to define notes related to a single object or participant __(available only for__ `+concise+` __ object).__
+
+
+@startuml
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+@0
+WU is Idle
+WB is Idle
+
+@100
+WU is Waiting
+WB is Processing
+note top of WU : first note\non several\nlines
+note bottom of WU : second note\non several\nlines
+
+@300
+WB is Waiting
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/6877[QA-6877]]__
+
+
+== Adding texts
+
+You can optionally add a title, a header, a footer, a legend and a caption:
+
+
+@startuml
+Title This is my title
+header: some header
+footer: some footer
+legend
+Some legend
+end legend
+caption some caption
+
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+@0
+WU is Idle
+WB is Idle
+
+@100
+WU is Waiting
+WB is Processing
+
+@300
+WB is Waiting
+@enduml
+
+
+
+== Complete example
+
+
+Thanks to https://twitter.com/arosien[Adam Rosien] for this example.
+
+
+@startuml
+concise "Client" as Client
+concise "Server" as Server
+concise "Response freshness" as Cache
+
+Server is idle
+Client is idle
+
+@Client
+0 is send
+Client -> Server@+25 : GET
++25 is await
++75 is recv
++25 is idle
++25 is send
+Client -> Server@+25 : GET\nIf-Modified-Since: 150
++25 is await
++50 is recv
++25 is idle
+@100 <-> @275 : no need to re-request from server
+
+@Server
+25 is recv
++25 is work
++25 is send
+Server -> Client@+25 : 200 OK\nExpires: 275
++25 is idle
++75 is recv
++25 is send
+Server -> Client@+25 : 304 Not Modified
++25 is idle
+
+@Cache
+75 is fresh
++200 is stale
+@enduml
+
+
+
+== Digital Example
+
+
+@startuml
+scale 5 as 150 pixels
+
+clock clk with period 1
+binary "enable" as en
+binary "R/W" as rw
+binary "data Valid" as dv
+concise "dataBus" as db
+concise "address bus" as addr
+
+@6 as :write_beg
+@10 as :write_end
+
+@15 as :read_beg
+@19 as :read_end
+
+
+@0
+en is low
+db is "0x0"
+addr is "0x03f"
+rw is low
+dv is 0
+
+@:write_beg-3
+ en is high
+@:write_beg-2
+ db is "0xDEADBEEF"
+@:write_beg-1
+dv is 1
+@:write_beg
+rw is high
+
+
+@:write_end
+rw is low
+dv is low
+@:write_end+1
+rw is low
+db is "0x0"
+addr is "0x23"
+
+@12
+dv is high
+@13
+db is "0xFFFF"
+
+@20
+en is low
+dv is low
+@21
+db is "0x0"
+
+highlight :write_beg to :write_end #Gold:Write
+highlight :read_beg to :read_end #lightBlue:Read
+
+db@:write_beg-1 <-> @:write_end : setup time
+db@:write_beg-1 -> addr@:write_end+1 : hold
+@enduml
+
+
+
+== Adding color
+
+You can add link::color[color].
+
+
+@startuml
+concise "LR" as LR
+concise "ST" as ST
+
+LR is AtPlace #palegreen
+ST is AtLoad #gray
+
+@LR
+0 is Lowering
+100 is Lowered #pink
+350 is Releasing
+
+@ST
+200 is Moving
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/5776[QA-5776]]__
+
+
+== Using (global) style
+
+=== Without style __(by default)__
+
+@startuml
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+
+
+=== With style
+
+You can use link::style-evolution[style] to change rendering of elements.
+
+
+@startuml
+
+robust "Web Browser" as WB
+concise "Web User" as WU
+
+WB is Initializing
+WU is Absent
+
+@WB
+0 is idle
++200 is Processing
++100 is Waiting
+WB@0 <-> @50 : {50 ms lag}
+
+@WU
+0 is Waiting
++500 is ok
+@200 <-> @+150 : {150 ms}
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/14340/color-of-arrow-in-timing-diagram[QA-14340]]__
+
+
+== Applying Colors to specific lines
+
+You can use the `+
+
+clock clk with period 1
+binary "Input Signal 1" as IS1
+binary "Input Signal 2" as IS2 <>
+binary "Output Signal 1" as OS1 <>
+
+@0
+IS1 is low
+IS2 is high
+OS1 is low
+@2
+OS1 is high
+@4
+OS1 is low
+@5
+IS1 is high
+OS1 is high
+@6
+IS2 is low
+@10
+IS1 is low
+OS1 is low
+@enduml
+
+
+__[https://forum.plantuml.net/15870/timing-diagram-assign-different-colors-single-participants?show=15870#q15870[Ref. QA-15870]]__
+
+
+== Compact mode
+
+You can use `+compact+` command to compact the timing layout.
+
+=== By default
+
+@startuml
+robust "Web Browser" as WB
+concise "Web User" as WU
+robust "Web Browser2" as WB2
+
+@0
+WU is Waiting
+WB is Idle
+WB2 is Idle
+
+@200
+WB is Proc.
+
+@300
+WB is Waiting
+WB2 is Waiting
+
+@500
+WU is ok
+
+@700
+WB is Idle
+@enduml
+
+
+==== Global mode with `+mode compact+`
+
+@startuml
+mode compact
+robust "Web Browser" as WB
+concise "Web User" as WU
+robust "Web Browser2" as WB2
+
+@0
+WU is Waiting
+WB is Idle
+WB2 is Idle
+
+@200
+WB is Proc.
+
+@300
+WB is Waiting
+WB2 is Waiting
+
+@500
+WU is ok
+
+@700
+WB is Idle
+@enduml
+
+
+=== Local mode with only `+compact+` on element
+
+@startuml
+compact robust "Web Browser" as WB
+compact concise "Web User" as WU
+robust "Web Browser2" as WB2
+
+@0
+WU is Waiting
+WB is Idle
+WB2 is Idle
+
+@200
+WB is Proc.
+
+@300
+WB is Waiting
+WB2 is Waiting
+
+@500
+WU is ok
+
+@700
+WB is Idle
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/11130/is-there-a-compact-timing-diagram[QA-11130]]__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/undocumented.adoc b/plantuml-docs/docs_from_alphadoc/undocumented.adoc
new file mode 100644
index 00000000..97dcb46a
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/undocumented.adoc
@@ -0,0 +1,248 @@
+== Undocumented PlantUML features
+
+Page for list of **Undocumented PlantUML features** in order **to document**
+
+
+== Undocumented PlantUML features in order to document
+
+The list comes from https://github.com/plantuml/plantuml/issues/261[Issue#261] thanks to https://github.com/VladimirAlexiev[@VladimirAlexiev],
+
+And the list of https://github.com/plantuml/plantuml/issues/261[Issue#261] comes mostly from https://forum.plantuml.net/7095[QA#7095], https://forum.plantuml.net/7140[QA#7140] thanks to https://github.com/Anthony-Gaudino[@Anthony-Gaudino],
+and was complemented, categorized, and converted to a task list by @VladimirAlexiev.
+
+Then the list is here in order to put, after each item:
+* [[#98FB98#DONE]]
+* [[#FFD700#TODO]]
+* [[#AA1111#BUG]]
+* [[#FF6600#deprecated]]
+* [[#1111AA#SEE]]
+* or [[#C8FBC8#__TBC__]]
+and to follow and share the state of new documentation to produce.
+
+=== Preprocessor, Includes, Sectioning
+
+link::preprocessing-v2[preprocessing-v2 (old)] & link::preprocessing[preprocessing (new)]
+
+* https://forum.plantuml.net/6577[QA#6577] Ability to include blocks ("subsections") of code
+* https://forum.plantuml.net/7838[QA#7838] `+!pragma http.proxyHost+`
+* https://forum.plantuml.net/6289[QA#6289] `+%filename%+` and `+%filenameNoExtension%+`
+* https://forum.plantuml.net/6199[QA#6199] `+%PLANTUML_VERSION%+` [[#FF6600#deprecated]][[#1111AA#SEE]] New link::preprocessing#0umqmmdy1n9yk362kjka[Builtin functions] `+%version()+`
+* https://forum.plantuml.net/5968[QA#5968] `+%filedate%+`
+* https://forum.plantuml.net/5769[QA#5769] `+%filename%+` and `+%dirpath%+` variables [[#FF6600#deprecated]][[#1111AA#SEE]] New link::preprocessing#0umqmmdy1n9yk362kjka[Builtin functions]
+* https://forum.plantuml.net/5171[QA#5171] [[#98FB98#DONE]] Boolean not `+!+` and parenthesis on `+!ifdef+` [[#98FB98#DONE]] superseded by `+%not()+` [[#1111AA#SEE]] https://forum.plantuml.net/12320[QA#12320]
+* https://forum.plantuml.net/3868[QA#3868] Use tilde `+~+` to escape `+@startuml+`
+* https://forum.plantuml.net/5483[QA#5483] `+@startuml+` filename for automatic extensions
+* https://forum.plantuml.net/4467[QA#4467] [[#98FB98#DONE]] `+@startuml+` with identifier for includes [[#98FB98#DONE]] on link::sources[source file]
+* https://forum.plantuml.net/1466[QA#1466] [[#98FB98#DONE]] `+@startuml{OPTIONS}+` [[#98FB98#DONE]] on link::sources[source file]
+* https://forum.plantuml.net/4596[QA#4596] `+\startXXX+` instead of `+@startXXX+`
+* https://forum.plantuml.net/5769[QA#5769] [[#98FB98#DONE]] `+@startdef and @enddef+` [[#98FB98#DONE]] on link::sources[source file]
+* https://forum.plantuml.net/1525[QA#1525], https://forum.plantuml.net/5793[QA#5793] `+@pause @unpause+`
+* https://forum.plantuml.net/1525[QA#1525] `+@pause @unpause @continue @append and /' ... '/+` multiline comments [[#98FB98#DONE]] for comments [[#C8FBC8#__TBC__]] for pause/unpause/continue
+* https://forum.plantuml.net/4266[QA#4266] `+-config+` parameter
+* https://forum.plantuml.net/2410[QA#2410] Multiple include paths
+* https://forum.plantuml.net/7337[QA#7337] [[#98FB98#DONE]] `+$Tags+` to include individual pieces [[#98FB98#DONE]] for link::component-diagram[component] [[#C8FBC8#__TBC__]] for other diagram
+* https://forum.plantuml.net/7337[QA#7337] [[#98FB98#DONE]] remove / restore [[#98FB98#DONE]] for link::component-diagram[component] [[#C8FBC8#__TBC__]] for other diagram
+* wildcards in `+remove / hide / restore+`, eg `+remove *+` [[#98FB98#DONE]] for link::component-diagram[component] [[#C8FBC8#__TBC__]] for other diagram
+
+=== Running and Output
+
+link::command-line[Command-line] [[#98FB98#DONE]]
+
+* https://forum.plantuml.net/4752[QA#4752] [[#98FB98#DONE]] Output Braille diagrams (`+-tbraille+`) [[#98FB98#DONE]] link::command-line[command-line]
+* https://forum.plantuml.net/5037[QA#5037] [[#98FB98#DONE]] `+-pipemap+` parameter (HTML clickable maps): link::command-line#standard_input_output[`+command-line#standard_input_output+`]
+* https://forum.plantuml.net/3562[QA#3562] [[#98FB98#DONE]] Diagram code is embedded in PNG metadata (`+-metadata -checkmeta+`)
+* https://forum.plantuml.net/1601[QA#1601] [[#98FB98#DONE]] `+-gui+` parameter accepts a path [[#98FB98#DONE]]
+* https://forum.plantuml.net/3214[QA#3214] [[#98FB98#DONE]] `+-eps:text+` parameter [[#98FB98#DONE]] link::command-line[command-line]
+
+link::ascii-art[ASCII art] [[#98FB98#DONE]] output with `+-ttxt+` or `+-tutxt+` [[#98FB98#DONE]] link::command-line[command-line]
+
+* https://forum.plantuml.net/4147[QA#4147] [[#98FB98#DONE]] `+skinparam maxAsciiMessageLength+` [[#98FB98#DONE]]
+
+link::latex[LaTeX] output with `+-tlatex+` through Tikz [[#98FB98#DONE]] link::command-line[command-line]
+
+* https://forum.plantuml.net/1798[QA#1798] latex-tikz-support anything more to document?
+* Latex "see result online" (eg https://www.writelatex.com/read/pgkkspzgzgpb) doesn't work because need to migrate to overleaf
+* https://forum.plantuml.net/6495[QA#6495] `+skinparam tikzFont+`
+* https://forum.plantuml.net/3558[QA#3558] Latex link [[latex://]]
+
+link::svg[SVG] output with `+-tsvg+` [[#98FB98#DONE]]
+
+* https://forum.plantuml.net/5453[QA#5453] [[#98FB98#DONE]] `+skinparam pathHoverColor+` [[#98FB98#DONE]]
+* https://forum.plantuml.net/7334[QA#7334] [[#98FB98#DONE]] `+skinparam svgDimensionStyle+` [[#98FB98#DONE]]
+
+=== Layout
+
+* https://forum.plantuml.net/4418[QA#4418], https://forum.plantuml.net/3111[QA#3111], https://forum.plantuml.net/4045[QA#4045] `+!pragma svek_trace+`
+* https://forum.plantuml.net/1343[QA#1343] `+!pragma aspect+`
+* https://forum.plantuml.net/1226[QA#1226] `+!pragma ratio+`
+* https://forum.plantuml.net/977[QA#977] `+skinparam nodesep+`
+* https://forum.plantuml.net/977[QA#977] `+skinparam ranksep+`
+* https://forum.plantuml.net/3188[QA#3188] norank arrow option
+* https://forum.plantuml.net/8365[QA#8365] hidden and norank
+* https://forum.plantuml.net/4418[QA#4418], https://forum.plantuml.net/1132[QA#1132], https://forum.plantuml.net/3231[QA#3231], https://forum.plantuml.net/3111[QA#3111], https://forum.plantuml.net/3143[QA#3143] `+!pragma horizontalLineBetweenDifferentPackageAllowed+`
+* https://forum.plantuml.net/1296[QA#1296] `+skinparam minClassWidth+` and `+skinparam sameClassWidth+`
+* https://forum.plantuml.net/4637[QA#4637] `+skinparam minClassWidth+` on sequence diagram
+* https://forum.plantuml.net/2538[QA#2538] `+layout_new_line+` for disconnected parts
+* https://forum.plantuml.net/3118[QA#3118] `+skinparam padding+`
+* https://forum.plantuml.net/5493[QA#5493] `+skinparam ParticipantPadding+` and `+skinparam BoxPadding+`
+
+=== Text and Links
+
+link::creole[Creole], link::link[Link], link::ascii-math[ASCII Math, JLatexMath]
+
+* https://forum.plantuml.net/3104[QA#3104] Use `+\+` for multiline stuff
+* https://forum.plantuml.net/3055[QA#3055] Align text with `+\l+` and `+\r+`
+* https://forum.plantuml.net/3601[QA#3601] Creole on class titles with as
+* https://github.com/plantuml/plantuml/issues/104[Issues#104] `+skinparam wrapWidth+` and `+skinparam wrapMessageWidth+`
+* https://forum.plantuml.net/3820[QA#3820] `+skinparam tabSize+`
+* https://forum.plantuml.net/5254[QA#5254] [[#98FB98#DONE]] `+...+` to remove default text style (eg `+skinparam classFontStyle+`) [[#98FB98#DONE]] link::creole#xbti2cgar0ssk362kjd9[on creole page]
+* https://forum.plantuml.net/5574[QA#5574] [[#98FB98#DONE]] tooltip over link [[#98FB98#DONE]] Page link::link[link]
+
+=== Images, Icons, Sprites, Shapes, Embellishments
+
+* https://forum.plantuml.net/4080[QA#4080] Import images from jar/zip __(Link to https://forum.plantuml.net/12578[QA#12578])__
+* https://forum.plantuml.net/3790[QA#3790] DATA URI as embeded image
+* https://forum.plantuml.net/7485[QA#7485] `+skinparam DiagonalCorner+`
+* https://forum.plantuml.net/2899[QA#2899] `+skinparam activityShape+`
+* https://forum.plantuml.net/4076[QA#4076], https://forum.plantuml.net/4079[QA#4079] Sprites on stereotypes
+* https://forum.plantuml.net/8084[QA#8084] listsprites of stdlib: link::sprite#hdvb3xdf1doekdtyqgs2[alphadoc sprite#stdlib] and link::sprite#jq1w8ezst4vzkdtyqu8b[sprite#listing-sprites]
+
+=== Color [[#98FB98#DONE]]
+
+* https://forum.plantuml.net/3770[QA#3770] [[#98FB98#DONE]] Inline set of multiple colors in various diagrams (`+text;line;back;header+`) [[#98FB98#DONE]]
+* https://forum.plantuml.net/1487[QA#1487] [[#98FB98#DONE]] `+##[style]color+` of node borders: works for class and state diagrams [[#98FB98#DONE]] link::class-diagram[on class] and link::state-diagram[state]
+* https://forum.plantuml.net/5340[QA#5340] [[#98FB98#DONE]] Inline coloring of node borders [[#98FB98#DONE]] link::use-case-diagram[on use-case]
+* https://forum.plantuml.net/7287[QA#7287] [[#98FB98#DONE]] Automatic color [[#98FB98#DONE]] link::color[on color page]
+* https://forum.plantuml.net/3648[QA#3648] [[#98FB98#DONE]] Transparent color [[#98FB98#DONE]] link::color[on color page]
+
+=== Arrows
+
+* https://forum.plantuml.net/3636[QA#3636] [[#98FB98#DONE]] Arrows from/to class members [[#98FB98#DONE]]
+* https://forum.plantuml.net/3621[QA#3621] Component diagram consumer/provider arrows
+* make sure all arrow params are documented: `+dotted|dashed|plain|bold|hidden|norank|single|thickness|left|right|up|down, color+`
+* https://forum.plantuml.net/3816[QA#3816] `+skinparam ArrowColor+`, stereotyped arrows, new syntax for inline arrow style (Setting multiple arrow `+skinparams in one line+`); [[#FF6600#deprecated]] (componentArrowColor is deprecated)
+* https://forum.plantuml.net/4949[QA#4949] [[#98FB98#DONE]] Inline setting for edge style and thickness [[#98FB98#DONE]] on Class and Deployment
+* https://forum.plantuml.net/4260[QA#4260] [[#98FB98#DONE]] bold and plain arrow styles [[#98FB98#DONE]]
+* https://forum.plantuml.net/4181[QA#4181] [[#98FB98#DONE]] bold, dashed, dotted [[#98FB98#DONE]]
+* Make sure all arrow types are documented on one page: See `+arrows+` and `+arrows-2+` at https://github.com/anoff/blog/tree/master/static/assets/plantuml/diagrams[github.com/anoff/blog/tree/master/static/assets/plantuml/diagrams]
+* https://forum.plantuml.net/1736[QA#1736] [[#98FB98#DONE]] Multiple lollipop edge styles [[#98FB98#DONE]]
+* https://forum.plantuml.net/5261[QA#5261] Crows foot edge
+* https://forum.plantuml.net/2259[QA#2259] [[#98FB98#DONE]] Class diagram `+--(+` and `+-0)-+` arrows [[#98FB98#DONE]]
+* https://forum.plantuml.net/310[QA#310] [[#98FB98#DONE]] Sequence diagram `+?->+` and `+->?+` arrows [[#98FB98#DONE]]
+
+=== Mixed and Embedded Diagrams
+
+* https://forum.plantuml.net/2335[QA#2335] [[#98FB98#DONE]] `+allow_mixing vs mix_usecase mix_actor+`... [[#98FB98#DONE]] on link::deployment-diagram#6d6863e19pu3l3t7uqw6[Deployment]
+* https://forum.plantuml.net/375[QA#375] Embed SVG in SVG diagram
+* https://forum.plantuml.net/2427[QA#2427] [[#98FB98#DONE]] Embed SALT UI diagrams in notes and other texts ("Flowchat") [[#98FB98#DONE]] See link::salt[Salt]
+
+=== Alternative Layoters
+
+* https://forum.plantuml.net/4436[QA#4436], https://forum.plantuml.net/5336[QA#5336], link::smetana02[smetana02] [[#98FB98#DONE]] `+!pragma graphviz_dot jdot+`: replace graphviz with Java code [[#98FB98#DONE]] โฅ `+!pragma layout smetana+` __See link::smetana02[smetana02]__
+* link::vizjs[vizjs] `+-graphvizdot vizjs+`: replace graphviz with JavaScript code
+* http://beta.plantuml.net/noditaa/[noditaa]: replace ditaa with java code
+
+=== link::class-diagram[Class Diagrams]
+
+* https://forum.plantuml.net/5835[QA#5835] [[#98FB98#DONE]] Notes on class fields [[#98FB98#DONE]]
+* https://forum.plantuml.net/3054[QA#3054] details on how the "attributes" vs "methods" boxes are formed, and what happens when you add your own divider line
+* https://forum.plantuml.net/2913[QA#2913] Hide private / protected / package class members
+* https://forum.plantuml.net/3448[QA#3448] [[#98FB98#DONE]] Tree structure inside class [[#98FB98#DONE]] __See link::creole#2u7lnfjrnmfdk362kjda[creole tree]__
+* https://forum.plantuml.net/3424[QA#3424] Class attribute stereotype
+* https://forum.plantuml.net/2259[QA#2259] Class diagram circle
+* https://forum.plantuml.net/2239[QA#2239] extends and implements can reference multiple nodes
+* https://forum.plantuml.net/3193[QA#3193] `+skinparam groupInheritance+` to merge inheritance arrows going to the same parent [[#98FB98#DONE]] (+ Adding link to Defect https://forum.plantuml.net/13532/groupinheritance-bug[QA#13532])
+* https://forum.plantuml.net/1638[QA#1638] [[#98FB98#DONE]] package style card [[#98FB98#DONE]] [[#C8FBC8#__TBC__]]
+
+=== link::component-diagram[Component Diagrams] [[#98FB98#DONE]]
+
+* https://forum.plantuml.net/11052[QA#11052] [[#98FB98#DONE]] `+remove @unlinked components;+` [[#98FB98#DONE]] [[#C8FBC8#__TBC__]] for other diagram
+* https://forum.plantuml.net/11052[QA#11052] [[#98FB98#DONE]] `+component tags and hide/remove/restore $tag+` [[#98FB98#DONE]] for link::component-diagram[component] [[#C8FBC8#__TBC__]] for other diagram
+
+=== link::sequence-diagram[Sequence Diagrams] [[#98FB98#DONE]]
+
+link::teoz[teoz], link::sequence-diagram#anchors_and_duration[`+sequence-diagram#anchors_and_duration+`], https://forum.plantuml.net/tag/teoz[tag/teoz]: new Teoz (vs old Puma) for sequence diagrams
+
+* https://forum.plantuml.net/4247[QA#4247] [[#98FB98#DONE]] hide unlinked participants [[#98FB98#DONE]]
+* https://forum.plantuml.net/7119[QA#7119] [[#98FB98#DONE]] `+%autonumber%+`
+* https://forum.plantuml.net/8511[QA#8511] [[#98FB98#DONE]] `+autonumber inc+` [[#98FB98#DONE]]
+* https://forum.plantuml.net/2794[QA#2794] [[#98FB98#DONE]] `+skinparam lifelineStrategy+` [[#98FB98#DONE]]
+* https://forum.plantuml.net/2503[QA#2503] [[#98FB98#DONE]] Secondary group label in sequence diagram [[#98FB98#DONE]]
+* https://forum.plantuml.net/7264[QA#7264] [[#98FB98#DONE]] `+skinparam belowForResponse+` [[#98FB98#DONE]]
+* https://forum.plantuml.net/1047[QA#1047] [[#98FB98#DONE]] `+skinparam style strictuml+`: emits triangle rather than sharp arrow heads [[#98FB98#DONE]]
+* https://forum.plantuml.net/3482[QA#3482], https://forum.plantuml.net/206[QA#206] [[#98FB98#DONE]] `+skinparam sequenceMessageAlign+` [[#98FB98#DONE]]
+
+=== link::activity-diagram-beta[Activity Diagrams]
+
+* https://forum.plantuml.net/5201[QA#5201] `+skinparam swimlaneWidth+` [[#AA1111#BUG]] See https://forum.plantuml.net/12463[QA#12463]
+* https://forum.plantuml.net/2681[QA#2681] [[#98FB98#DONE]] Swimlane alias [[#98FB98#DONE]]
+* https://forum.plantuml.net/4470[QA#4470] [[#98FB98#DONE]] Label of arrows of repeat loops (repeat while) [[#98FB98#DONE]]
+* https://forum.plantuml.net/6105[QA#6105] [[#98FB98#DONE]] Activity diagram `+break+` [[#98FB98#DONE]]
+* https://forum.plantuml.net/301[QA#301] [[#98FB98#DONE]] Activity Beta `+if (...) is/equals (...) then+` [[#98FB98#DONE]]
+* https://forum.plantuml.net/265[QA#265] [[#98FB98#DONE]] Activity Beta `+kill+` [[#98FB98#DONE]]
+* https://forum.plantuml.net/3931[QA#3931] [[#98FB98#DONE]] `+!pragma useVerticalIf on+`: draw if/elseif/else structure vertically [[#98FB98#DONE]]
+* https://forum.plantuml.net/1626[QA#1626] [[#98FB98#DONE]] Activity diagram GOTO [[#98FB98#DONE]] See link::activity-diagram-beta[activity-diagram] and link::activity-diagram-issues[activity-diagram-issues]
+* https://forum.plantuml.net/2792[QA#2792] `+skinparam activityArrowFontSize+`
+* https://forum.plantuml.net/3166[QA#3166] `+skinparam activityArrowFontColor+`
+* https://forum.plantuml.net/5346[QA#5346] [[#98FB98#DONE]] Activity diagram joinspec [[#98FB98#DONE]]
+* https://forum.plantuml.net/2868[QA#2868] Activity diagram multiple halting states
+* https://forum.plantuml.net/3505[QA#3505] [[#98FB98#DONE]] Activity diagram end [[#98FB98#DONE]]
+* https://forum.plantuml.net/5826[QA#5826] Backward on loops
+* https://forum.plantuml.net/4906[QA#4906] [[#98FB98#DONE]] Gradient color on activity diagram partition [[#98FB98#DONE]]
+* https://forum.plantuml.net/2398[QA#2398] [[#98FB98#DONE]] Note on partition [[#98FB98#DONE]]
+* https://forum.plantuml.net/2793[QA#2793] [[#98FB98#DONE]] Inline coloring of partition [[#98FB98#DONE]]
+* https://forum.plantuml.net/1290[QA#1290] [[#98FB98#DONE]] `+skinparam conditionStyle+`: inside (hexagon: default), foo1 (big diamond), diamond (tiny diamond) [[#98FB98#DONE]]
+* https://forum.plantuml.net/6010[QA#6010] `+skinparam arrowMessageAlign center+`
+* https://forum.plantuml.net/4411[QA#4411] `+skinparam colorArrowSeparationSpace+`: multiple parallel arrows in activity digrams
+* [[#98FB98#DONE]] https://forum.plantuml.net/3770[QA#3770] Background color of `+alt/group+` -> to link::sequence-diagram[Sequence Diagrams]
+
+=== link::state-diagram[State Diagrams] [[#98FB98#DONE]]
+
+* https://forum.plantuml.net/1159[QA#1159] [[#98FB98#DONE]] State diagram `+<>, <>, <>, <>+` [[#98FB98#DONE]]
+* https://forum.plantuml.net/3672[QA#3672] [[#98FB98#DONE]] State Diagram `+<>+` [[#98FB98#DONE]]
+* https://forum.plantuml.net/10077[QA#10077] [[#98FB98#DONE]] Colored connectors in state diagrams [[#98FB98#DONE]]
+* https://forum.plantuml.net/1159[QA#1159] [[#98FB98#DONE]] Choice Pseudostate in State Diagrams [[#98FB98#DONE]]
+* https://forum.plantuml.net/1099[QA#1099] [[#98FB98#DONE]] State diagram hide empty description [[#98FB98#DONE]]
+* https://forum.plantuml.net/4309[QA#4309] [[#98FB98#DONE]] State diagram `+<> and <>, <> and <>, <> and <> +`[[#98FB98#DONE]]
+* https://forum.plantuml.net/1812[QA#1812] [[#98FB98#DONE]] State inline color [[#98FB98#DONE]]
+
+=== link::ie-diagram[SDL and ER/IE Diagrams] [[#98FB98#DONE]]
+
+* https://forum.plantuml.net/1232[QA#1232] [[#98FB98#DONE]] SDL shapes (some undocumented) [[#98FB98#DONE]]
+* IE-diagram, https://github.com/plantuml/plantuml/pull/31[Pull#31] [[#98FB98#DONE]] ER (IE) diagrams [[#98FB98#DONE]] link::ie-diagram[IE-diagram page]
+
+=== link::salt[SALT (UI) Diagrams] [[#98FB98#DONE]]
+
+https://forum.plantuml.net/search?q=salt[search?q=salt], https://forum.plantuml.net/tag/salt[tag/salt]
+
+* https://forum.plantuml.net/5849[QA#5849] [[#98FB98#DONE]] Salt pseudo "sprite" [[#98FB98#DONE]]
+* https://forum.plantuml.net/5840[QA#5840] [[#98FB98#DONE]] Salt titled groupbox [[#98FB98#DONE]]
+* https://forum.plantuml.net/1265[QA#1265], https://forum.plantuml.net/5400[QA#5400] [[#98FB98#DONE]] Salt tree table (table-tree) [[#98FB98#DONE]]
+
+=== link::timing-diagram[Timing Diagrams] [[#98FB98#DONE]]
+
+* https://forum.plantuml.net/5776[QA#5776] [[#98FB98#DONE]] Timing diagram coloring [[#98FB98#DONE]]
+
+=== link::gantt-diagram[Gantt Charts] [[#98FB98#DONE]]
+
+* https://forum.plantuml.net/5782[QA#5782] [[#98FB98#DONE]] Arrow on Gantt Diagram [[#98FB98#DONE]]
+* https://forum.plantuml.net/5510[QA#5510] [[#98FB98#DONE]] Gantt diagram dates [[#98FB98#DONE]]
+
+=== link::bpmn[BPMN Diagrams] [[#98FB98#DONE]]
+
+* https://forum.plantuml.net/5647[QA#5647] [[#98FB98#DONE]] BPMN (`+@startbpm+` and `+@endbpm+`) [[#98FB98#DONE]] Page link::bpmn[BPMN] updated
+
+=== link::mindmap-diagram[MindMap Diagrams]
+
+=== link::wbs-diagram[WBS Diagrams]
+
+Work Breakdown Structures, Organizational Breakdown Structures (organigrams)
+
+=== link::dot[Graphviz Diagrams (DOT)]
+
+* https://forum.plantuml.net/4210[QA#4210] When using Dot, PlantUML supports strict graph and digraph
+* https://forum.plantuml.net/1206[QA#1206] Dot graph
+
+=== Not yet categorized
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/unicode.adoc b/plantuml-docs/docs_from_alphadoc/unicode.adoc
new file mode 100644
index 00000000..5a9b81d0
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/unicode.adoc
@@ -0,0 +1,110 @@
+== Unicode
+
+The PlantUML language use __letters__ to define actor, usecase and so on.
+
+But __letters__ are not only A-Z latin characters, it could be __any kind of letter from any language__.
+
+
+== Examples
+
+
+@startuml
+skinparam handwritten true
+skinparam backgroundColor #EEEBDC
+
+actor ไฝฟ็จ่
+participant "้ ญ็ญ่" as A
+participant "็ฌฌไบ้ก" as B
+participant "ๆๅพไธๅ ่ชฒ" as ๅฅ็ๆฑ่ฅฟ
+
+ไฝฟ็จ่ -> A: ๅฎๆ้้ ๅทฅไฝ
+activate A
+
+A -> B: ๅตๅปบ่ซๆฑ
+activate B
+
+B -> ๅฅ็ๆฑ่ฅฟ: ๅตๅปบ่ซๆฑ
+activate ๅฅ็ๆฑ่ฅฟ
+ๅฅ็ๆฑ่ฅฟ --> B: ้้ ๅทฅไฝๅฎๆ
+destroy ๅฅ็ๆฑ่ฅฟ
+
+B --> A: ่ซๆฑๅตๅปบ
+deactivate B
+
+A --> ไฝฟ็จ่ : ๅๅฎ
+deactivate A
+@enduml
+
+
+
+
+
+@startuml
+
+(*) --> "่ฉๅนณๅฐ"
+--> === S1 ===
+--> ้ ่บฌๅๅ ฌ็พ
+--> === S2 ===
+--> ้ๅขไผๆณขๆญฆๅจ
+--> (*)
+
+skinparam backgroundColor #AAFFFF
+skinparam activityStartColor red
+skinparam activityBarColor SaddleBrown
+skinparam activityEndColor Silver
+skinparam activityBackgroundColor Peru
+skinparam activityBorderColor Peru
+@enduml
+
+
+
+@startuml
+
+skinparam usecaseBackgroundColor DarkSeaGreen
+skinparam usecaseArrowColor Olive
+skinparam actorBorderColor black
+skinparam usecaseBorderColor DarkSlateGray
+
+ไฝฟ็จ่ << ไบบ้ก >>
+"ไธปๆธๆๅบซ" as ๆธๆๅบซ << ๆ็จ็จๅผ >>
+(่ๅต) << ไธๆกฟ >>
+"ไธปๆฐๆฎ็" as (่ดไฝ) << ๅบๆฌ็ >>
+
+ไฝฟ็จ่ -> (่ๅต)
+ไฝฟ็จ่ --> (่ดไฝ)
+
+ๆธๆๅบซ --> (่ดไฝ)
+@enduml
+
+
+
+@startuml
+() "ฮฃฯฮบฯฮฌฯฮทฯ\nฮตฮฏฮฝฮฑฮน ฯฮตฯฯฮทฯ" as ฮฃฯฮบฯฮฌฯฮทฯ
+
+ฮฃฯฮบฯฮฌฯฮทฯ - [ฮ ฯฮทฮฝฮฌ ฯฮฟฮปฮตฮผฮฟฯฮฑฯฮฎฯ]
+[ฮ ฯฮทฮฝฮฌ ฯฮฟฮปฮตฮผฮฟฯฮฑฯฮฎฯ] ..> () ฮฮธฮฎฮฝฮฑ : ฮฯ ฯฮญฯ ฮฟฮน ฯฯฮฌฯฮตฮนฯ\nฮดฮตฮฝ ฯฮทฮผฮฑฮฏฮฝฮฟฯ ฮฝ ฯฮฏฯฮฟฯฮฑ
+@enduml
+
+
+
+
+== Charset
+The default charset used when __reading__ the text files containing the UML text description is system dependent.
+
+Normally, it should just be fine, but in some case, you may want to the use another charset. For example, with the command line:
+----
+java -jar plantuml.jar -charset UTF-8 files.txt
+----
+
+Or, with the ant task:
+----
+
+
+
+----
+
+Depending of your Java installation, the following charset should be
+available: `+ISO-8859-1+`, `+UTF-8+`, `+UTF-16BE+`, `+UTF-16LE+`, `+UTF-16+`.
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/url-authentication.adoc b/plantuml-docs/docs_from_alphadoc/url-authentication.adoc
new file mode 100644
index 00000000..b1c78cfc
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/url-authentication.adoc
@@ -0,0 +1,235 @@
+== URL authentication
+
+With URL authentication it is possible to provide an authentication method, credentials, and a proxy config to URL endpoints for different pre-processor commands like `+!include+`, `+!import+` or `+%load_json+`.
+
+The authentication data is not stored in a DSL script, but in extra configuration files to which PlantUML must have access. The folder for the user data can be defined via a property.
+
+Which authentication method with which user data should be performed for an endpoint is decided by a special notation in the URL. PlantUML interprets the https://en.wikipedia.org/wiki/URL[UserInfo of the authority part of a URL] as the name for the configuration.
+
+**Examples:**
+----
+@startuml
+
+!include https://access@raw.example.com/stash/repository/architecture/master/modelbase.puml
+
+!$DATA = %load_json('https://service-cred@localhost/api/rest/endpoint?format=json)
+
+' Embedded rendering of JSON structure
+
+ rectangle Test #tan as "
+ {{json
+ $DATA
+ }}
+ Example JSON data
+ "
+' ...
+@enduml
+----
+
+For the examples above, PlantUML needs two files (`+access.credential+` and `+service-cred.credential+`) in the folder configured by the property `+plantuml.security.credentials.path+`. Both files are structured as JSON and must be encoded in UTF-8.
+
+By default, PlantUML only allows authentication for https URLs, since the credentials must be transmitted in encrypted form. If logins should also be allowed to go to unencrypted connections, the `+plantuml.security.allowNonSSLAuth+` property must be set to `+true+`. This is not under any circumstances recommended for connections that access servers on the internet.
+
+
+Actually, PlantUML supports three kinds of authentication: https://en.wikipedia.org/wiki/Basic_access_authentication[Basic Auth], https://en.wikipedia.org/wiki/OAuth#OAuth_2.0[OAuth2], and raw token authentication. For the OAuth2 the grant types `+client_credential+` and `+password+` are supported. With the raw token authentication, it's possible to pass throw a manually generated token (e.g. API key, bearer token) to the URL endpoint.
+
+
+== Credentials configuration
+
+A credentials configuration file must be stored in the folder configured by the property `+plantuml.security.credentials.path+`. The file extension is `+.credential+`, the file content is structured in JSON, the charset encoding is UTF-8, the filename must match the UserInfo part of the URL.
+
+**General JSON structure:**
+----
+{
+ "name": "",
+ "type": "",
+ "identifier": "",
+ "secret": "",
+ "properties": {
+ "": "",
+ "": ""
+ },
+ "proxy": {
+ "type": "",
+ "address": "",
+ "port": ""
+ }
+}
+----
+
+[plantuml]
+----
+@startjson
+
+#highlight "name"
+#highlight "identifier"
+#highlight "proxy" / "type"
+#highlight "proxy" / "address"
+{
+ "name": "",
+ "type": "",
+ "identifier": "",
+ "secret": "",
+ "properties": {
+ "": "",
+ "": "",
+ "...":"..."
+ },
+ "proxy": {
+ "type": "",
+ "address": "",
+ "port": ""
+ }
+}
+@endjson
+----
+
+
+* `+name+`: **required**
+** The name of the configuration and should be similar to the file name
+* `+type+`: (`+basicauth+`, `+oauth+`, `+tokenauth+`), default: `+basicauth+`
+** Type of the authentication method
+* `+identifier+`: **required**
+** Client identifier name (user name, client id, principal, app key, ...)
+* `+secret+`:
+** Secret for the identifier in clear text (not encrypted)
+* `+properties+`:
+** Optional authentication-method specific properties. Properties should be defined as key-value pairs. A value can itself be a set of key-value pairs.
+* `+proxy+`:
+** Optional proxy configuration (overrides system proxy settings)
+* `+proxy+`.`+type+`: **required** (`+direct+`, `+socks+`, `+http+`)
+** Proxy type definition.
+* `+proxy+`.`+address+`: **required**
+** Proxy server address (hostname, IP address)
+* `+proxy+`.`+port+`:
+** Proxy server port number
+
+**Notes:**
+
+* The name of a configuration may only contain characters from the following set: [`+a-z+`], [`+A-Z+`], [`+0-9+`], and "`+-+`". Not more than 64 characters are allowed.
+
+The following pages describe the individual configuration options of the authentication methods:
+
+* link::url-basicauth[Basic Auth configuration]
+* link::url-oauth[OAuth2 configuration]
+* link::url-tokenauth[Token Auth configuration]
+
+
+== Proxy configuration
+
+A credential configuration can define a proxy configuration to override the system proxy configuration (e.g. via environment variables).
+
+
+**General Proxy structure:**
+----
+{
+ "type": "",
+ "address": "",
+ "port": ""
+}
+----
+
+[plantuml]
+----
+@startjson
+{
+ "type": "",
+ "address": "",
+ "port": ""
+}
+@endjson
+----
+
+
+Any authentication configuration can define its own proxy definition. Three kinds of proxy types are allowed: `+direct+`, `+socks+` and `+http+`.
+
+* `+direct+`
+** Represents a direct connection or the absence of a proxy.
+* `+socks+`
+** Represents a SOCKS (V4 or V5) proxy.
+* `+http+`
+** Represents proxy for high-level protocols such as HTTP or FTP.
+
+With `+direct+` an address and port are not required (and will be ignored).
+
+* `+address+`
+** Hostname or IP address of the proxy server
+* `+port+`
+** Port number of the proxy host.
+
+See also https://docs.oracle.com/javase/8/docs/technotes/guides/net/proxies.html[Java Networking and Proxies].
+
+**Examples:**
+
+
+----
+"proxy": {
+ "type": "socks",
+ "address": "192.168.1.251",
+ "port": "80"
+}
+----
+
+----
+"proxy": {
+ "type": "direct"
+}
+----
+
+----
+"proxy": {
+ "type": "http",
+ "address": "proxy.example.com",
+ "port": "8081"
+}
+----
+
+
+== Property configuration
+
++++**Folder with credentials files**+++
+
+* `+plantuml.security.credentials.path+`
+** Value: path to an existing folder with a read access for PlantUML
+
+PlantUML needs a property with a configuration value to define a folder with the credentials files. Without the configured folder, the URL authentication is completely disabled and all UserInfo parts in URLs will be silently ignored.
+
+The configuration value can be set as an environment variable or should be passed as -D parameter to the PlantUML JAR.
+
+**Example**
+
+`+java -jar PlantUML.jar -Dplantuml.security.credentials.path=/opt/mycomp/plantuml/security/credentials/+`
+
+See also link::security[Security configuration]
+
+
+**Notes:**
+
+* The internal function `+%getenv+` will not expose the configuration value.
+* Any content in the configured path (and in all subfolders) are invisible for DSL model scripts. It is required that the configured folder is a separate location for the credentials files.
+* Multiple paths will be ignored. PlantUML reads the credentials files only from the first configured folder.
+
+
++++**Authentication over plain HTTP without encryption**+++
+
+* `+plantuml.security.allowNonSSLAuth+`
+** Value: (`+true+`\|`+false+`)
+
+
+Normally, PlantUML only provides authentication to encrypted endpoints. Otherwise, the authentication data to be transmitted would be visible to anyone who is monitoring the communication.
+
+It may be necessary to reach services on the intranet that do not support SSL for their controller endpoints. In this case, you can enable authentication via HTTP.
+
+The configuration value can be set as an environment variable or should be passed as -D parameter to the PlantUML JAR.
+
+**Example**
+
+`+java -jar PlantUML.jar -Dplantuml.security.allowNonSSLAuth=true+`
+
+See also link::security[Security configuration]
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/url-basicauth.adoc b/plantuml-docs/docs_from_alphadoc/url-basicauth.adoc
new file mode 100644
index 00000000..1e3cbcef
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/url-basicauth.adoc
@@ -0,0 +1,108 @@
+== BasicAuth configuration
+
+A BasicAuth credentials configuration file must be stored in the folder configured by the property `+plantuml.security.credentials.path+`. The file extension is `+.credential+`, the file content is structured in JSON, the charset encoding is UTF-8, the filename must match the UserInfo part of the URL.
+
+See also:
+* link::url-oauth[OAuth2 configuration]
+* link::url-tokenauth[Token Auth configuration]
+* link::url-authentication[General URL authentication documentation]
+
+**Flow**
+
+
+[plantuml]
+----
+@startuml
+PlantUML -> Service : call service URL\n(with Authorization BasicAuth)
+Service -> AuthServer : validates credentials
+note right: Maybe internal check w/o AuthServer
+Service <- AuthServer: ok
+Service -> PlantUML : response with content
+@enduml
+----
+
+
+**BasicAuth JSON structure:**
+----
+{
+ "name": "",
+ "type": "basicauth",
+ "identifier": "",
+ "secret": "",
+ "proxy": {
+ "type": "",
+ "address": "",
+ "port": ""
+ }
+}
+----
+[plantuml]
+----
+@startjson
+
+#highlight "name"
+#highlight "identifier"
+#highlight "proxy" / "type"
+#highlight "proxy" / "address"
+{
+ "name": "",
+ "type": "**basicauth**",
+ "identifier": "",
+ "secret": "",
+ "proxy": {
+ "type": "",
+ "address": "",
+ "port": ""
+ }
+}
+@endjson
+----
+
+
+* `+name+`: **required**
+** The name of the configuration and should be similar to the file name
+* `+type+`: `+basicauth+`
+** Defines the basicauth method (can be omitted)
+* `+identifier+`: **required**
+** Identifier for a client or user
+* `+secret+`:
+** Secret for the identifier in clear text (not encrypted)
+a set of key-value pairs.
+* `+proxy+`:
+** Optional proxy configuration (overrides system proxy settings)
+* `+proxy+`.`+type+`: **required** (`+direct+`, `+socks+`, `+http+`)
+** Proxy type definition.
+* `+proxy+`.`+address+`: **required**
+** Proxy server address (hostname, IP address)
+* `+proxy+`.`+port+`:
+** Proxy server port number
+
+**Examples**
+
+----
+{
+ "name": "jira",
+ "identifier": "alice",
+ "secret": "secret"
+}
+----
+
+----
+{
+ "name": "stash-cloud",
+ "type": "basicauth",
+ "identifier": "repoadmin",
+ "secret": "verySecret",
+ "proxy": {
+ "type": "socks",
+ "address": "outboundcloud.int.example.com",
+ "port": "8091"
+ }
+}
+----
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/url-oauth.adoc b/plantuml-docs/docs_from_alphadoc/url-oauth.adoc
new file mode 100644
index 00000000..f3ffc139
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/url-oauth.adoc
@@ -0,0 +1,252 @@
+== OAuth2 configuration
+
+PlantUML supports two grant types for OAuth2: `+client_credentials+` and `+password+` (Resource Owner Password Credentials).
+
+An OAuth2 credentials configuration file must be stored in the folder configured by the property `+plantuml.security.credentials.path+`. The file extension is `+.credential+`, the file content is structured in JSON, the charset encoding is UTF-8, the filename must match the UserInfo part of the URL. +
+
+* see also
+** link::url-basicauth[Basic Auth configuration]
+** link::url-tokenauth[Token Auth configuration]
+** link::url-authentication[General URL authentication documentation]
+
+
+== OAuth2 client credentials flow
+
+
+**Flow**
+
+[plantuml]
+----
+@startuml
+PlantUML -> AuthServer : request token\n(with principal)
+AuthServer -> PlantUML : response with token
+PlantUML -> Service : call service URL with bearer token
+Service -> Service : validates token
+note right: Validation of a signed token\nor requesting a validation service
+Service -> PlantUML : response with content
+@enduml
+----
+
+**OAuth2 client\_credentials JSON structure:**
+
+----
+{
+ "name": "",
+ "type": "oauth",
+ "identifier": "",
+ "secret": "",
+ "properties": {
+ "grantType": "client_credentials",
+ "accessTokenUri": "",
+ "scope": ""
+ },
+ "proxy": {
+ "type": "",
+ "address": "",
+ "port": ""
+ }
+}
+----
+[plantuml]
+----
+@startjson
+
+#highlight "name"
+#highlight "type"
+#highlight "properties" / "grantType"
+#highlight "properties" / "accessTokenUri"
+#highlight "proxy" / "type"
+#highlight "proxy" / "address"
+{
+ "name": "",
+ "type": "**oauth**",
+ "identifier": "",
+ "secret": "",
+ "properties": {
+ "grantType": "**client_credentials**",
+ "accessTokenUri": "",
+ "scope": ""
+ },
+ "proxy": {
+ "type": "",
+ "address": "",
+ "port": ""
+ }
+}
+@endjson
+----
+
+* `+name+`: **required**
+** The name of the configuration and should be similar to the file name
+* `+type+`: `+oauth+` **required**
+** Defines an OAuth2 flow
+* `+identifier+`: **required**
+** Principal identifier name
+* `+secret+`:
+** Secret for the principal (not encrypted)
+* `+properties+`.`+grantType+`: `+client_credentials+` **required**
+** Defines the OAuth2 client credentials flow
+* `+properties+`.`+accessTokenUri+`: **required**
+** URI to the AuthServer token access controller. If PlantUML is configured to work with an allow-list, this controller URI must be added to the list (see also link::security[security configuration])
+* `+properties+`.`+scope+`:
+** Access tokens to request (e.g. `+read write+`)
+* `+proxy+`:
+** Optional proxy configuration (overrides system proxy settings)
+* `+proxy+`.`+type+`: **required** (`+direct+`, `+socks+`, `+http+`)
+** Proxy type definition.
+* `+proxy+`.`+address+`: **required**
+** Proxy server address (hostname, IP address)
+* `+proxy+`.`+port+`:
+** Proxy server port number
+
+**Examples:**
+
+----
+{
+ "name": "curity-demo",
+ "type": "oauth",
+ "identifier": "demo-backend-client",
+ "secret": "MJlO3binatD9jk1",
+ "properties": {
+ "grantType": "client_credentials",
+ "scope": "read write",
+ "accessTokenUri": "https://login-demo.curity.io/oauth/v2/oauth-token"
+ }
+}
+----
+
+
+== OAuth2 resource owner password credentials flow
+
+**Flow**
+
+[plantuml]
+----
+@startuml
+PlantUML -> AuthServer : request token\n(with principle and user credentials)
+AuthServer -> PlantUML : response with token
+PlantUML -> Service : call service URL with bearer token
+Service -> Service : validates token
+note right: Validation of a signed token\nor requesting a validation service
+Service -> Service : loads/validates user\nif encoded in token
+note right: maybe requesting a user service\nor use user data as is
+Service -> PlantUML : response with content
+@enduml
+----
+
+**OAuth2 password JSON structure:**
+
+----
+{
+ "name": "",
+ "type": "oauth",
+ "identifier": "",
+ "secret": "",
+ "properties": {
+ "grantType": "password",
+ "accessTokenUri": "",
+ "scope": "",
+ "resourceOwner": {
+ "identifier": "",
+ "secret": ""
+ }
+ },
+ "proxy": {
+ "type": "",
+ "address": "",
+ "port": ""
+ }
+}
+----
+[plantuml]
+----
+@startjson
+!theme plain
+
+#highlight "name"
+#highlight "type"
+#highlight "identifier"
+#highlight "properties" / "grantType"
+#highlight "properties" / "accessTokenUri"
+#highlight "proxy" / "type"
+#highlight "proxy" / "address"
+{
+ "name": "",
+ "type": "**oauth**",
+ "identifier": "",
+ "secret": "",
+ "properties": {
+ "grantType": "**password**",
+ "accessTokenUri": "",
+ "scope": "",
+ "resourceOwner": {
+ "identifier": "",
+ "secret": ""
+ }
+ },
+ "proxy": {
+ "type": "",
+ "address": "",
+ "port": ""
+ }
+}
+@endjson
+----
+* `+name+`: **required**
+** The name of the configuration and should be similar to the file name
+* `+type+`: `+oauth+` **required**
+** Defines an OAuth2 flow
+* `+identifier+`: **required**
+** Principal identifier name
+* `+secret+`:
+** Secret for the principal (not encrypted)
+* `+properties+`.`+grantType+`: `+password +` **required**
+** Defines the OAuth2 resource owner password credentials flow
+* `+properties+`.`+accessTokenUri+`: **required**
+** URI to the AuthServer token access controller. If PlantUML is configured to work with an allow-list, this controller URI must be added to the list (see also link::security[security configuration])
+* `+properties+`.`+scope+`:
+** Access tokens to request (e.g. `+read write+`)
+* `+properties+`.`+resourceOwner+`.`+identifier+`:
+** Resource owner name, who requests the access
+* `+properties+`.`+resourceOwner+`.`+secret+`:
+** Resource owner password
+* `+proxy+`:
+** Optional proxy configuration (overrides system proxy settings)
+* `+proxy+`.`+type+`: **required** (`+direct+`, `+socks+`, `+http+`)
+** Proxy type definition.
+* `+proxy+`.`+address+`: **required**
+** Proxy server address (hostname, IP address)
+* `+proxy+`.`+port+`:
+** Proxy server port number
+
+**Examples:**
+
+----
+{
+ "name": "oauth-example",
+ "type": "oauth",
+ "identifier": "demo-backend-client",
+ "secret": "MJlO3binatD9jk1",
+ "properties": {
+ "grantType": "password",
+ "scope": "read write",
+ "accessTokenUri": "https://login-demo.curity.io/oauth/v2/oauth-token",
+ "resourceOwner": {
+ "identifier": "alice",
+ "secret": "secret"
+ }
+ }
+}
+----
+
+__(Please note, login-demo.curity.io actually stopped the support for 'password' grant type)__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/url-tokenauth.adoc b/plantuml-docs/docs_from_alphadoc/url-tokenauth.adoc
new file mode 100644
index 00000000..b7b14142
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/url-tokenauth.adoc
@@ -0,0 +1,120 @@
+== Token Auth configuration
+
+PlantUML supports token authentication and this is basically the second part of an OAuth flow. This means that the token for authentication to a URL endpoint must be determined in a different way. This is only useful for tokens that are valid for a very long time (for example API keys without expiration date).
+
+A token auth credentials configuration file must be stored in the folder configured by the property `+plantuml.security.credentials.path+`. The file extension is `+.credential+`, the file content is structured in JSON, the charset encoding is UTF-8, the filename must match the UserInfo part of the URL. +
+
+* see also
+** link::url-oauth[OAuth2 configuration]
+** link::url-basicauth[Basic Auth configuration]
+** link::url-authentication[General URL authentication documentation]
+
+**Flow**
+
+__Preparation__
+
+[plantuml]
+----
+@startuml
+actor User
+User -> AuthServer : requests an unlimited API token via UI
+User <- AuthServer : response with API token
+User <- User : stores API token in PlantUML credentials file
+@enduml
+----
+
+__URL authentication__
+
+[plantuml]
+----
+@startuml
+PlantUML -> Service : call service URL with a resilent token\n(manually received and configured)
+Service -> Service : validates token
+note right: Validation of a signed token\nor requesting a validation service
+Service -> PlantUML : response with content
+@enduml
+----
+
+
+== Token auth configuration
+
+**Token auth JSON structure:**
+
+----
+{
+ "name": "",
+ "type": "tokenauth",
+ "properties": {
+ "headers": {
+ "key1": "value1",
+ "key2": "value2",
+ ...
+ }
+ },
+ "proxy": {
+ "type": "",
+ "address": "",
+ "port": ""
+ }
+}
+----
+[plantuml]
+----
+@startjson
+
+#highlight "name"
+#highlight "type"
+#highlight "proxy" / "type"
+#highlight "proxy" / "address"
+{
+ "name": "",
+ "type": "**tokenauth**",
+ "properties": {
+ "headers": {
+ "key1": "value1",
+ "key2": "value2",
+ "...": "..."
+ }
+ },
+ "proxy": {
+ "type": "",
+ "address": "",
+ "port": ""
+ }
+}
+@endjson
+----
+* `+name+`: **required**
+** The name of the configuration and should be similar to the file name
+* `+type+`: `+tokenauth+` **required**
+** Defines an token auth flow
+* `+properties+`.`+headers+`:
+** All static headers needed for the token auth flow
+* `+proxy+`:
+** Optional proxy configuration (overrides system proxy settings)
+* `+proxy+`.`+type+`: **required** (`+direct+`, `+socks+`, `+http+`)
+** Proxy type definition.
+* `+proxy+`.`+address+`: **required**
+** Proxy server address (hostname, IP address)
+* `+proxy+`.`+port+`:
+** Proxy server port number
+
+**Examples:**
+
+----
+{
+ "name": "public-api",
+ "type": "tokenauth",
+ "properties": {
+ "headers": {
+ "Authorization": "ApiKey a4db08b7-5729-4ba9-8c08-f2df493465a1"
+ }
+ }
+}
+----
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/use-case-diagram.adoc b/plantuml-docs/docs_from_alphadoc/use-case-diagram.adoc
new file mode 100644
index 00000000..bf05ae10
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/use-case-diagram.adoc
@@ -0,0 +1,511 @@
+== Use Case Diagram
+
+
+Let's have a few examples:
+
+
+== Usecases
+Use cases are enclosed using between parentheses (because two
+parentheses looks like an oval).
+
+You can also use the `+usecase+` keyword to define a
+usecase.
+And you can define an alias, using the `+as+` keyword.
+This alias will be used later, when defining relations.
+
+@startuml
+
+(First usecase)
+(Another usecase) as (UC2)
+usecase UC3
+usecase (Last\nusecase) as UC4
+
+@enduml
+
+
+
+== Actors
+
+The name defining an actor is enclosed between colons.
+
+You can also use the `+actor+` keyword to define an actor.
+An alias can be assigned using the `+as+` keyword and can be used later instead of the actor's name, e. g. when defining relations.
+
+You can see from the following examples, that the actor definitions are optional.
+
+@startuml
+
+:First Actor:
+:Another\nactor: as Man2
+actor Woman3
+actor :Last actor: as Person1
+
+@enduml
+
+
+
+== Change Actor style
+
+You can change the actor style from stick man __(by default)__ to:
+* an awesome man with the `+skinparam actorStyle awesome+` command;
+* a hollow man with the `+skinparam actorStyle hollow +` command.
+
+=== Stick man __(by default)__
+
+@startuml
+:User: --> (Use)
+"Main Admin" as Admin
+"Use the application" as (Use)
+Admin --> (Admin the application)
+@enduml
+
+
+=== Awesome man
+
+@startuml
+skinparam actorStyle awesome
+:User: --> (Use)
+"Main Admin" as Admin
+"Use the application" as (Use)
+Admin --> (Admin the application)
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/10493/how-can-i-customize-the-actor-icon-in-svg-output?show=10513#c10513[QA-10493]]__
+
+=== Hollow man
+
+@startuml
+skinparam actorStyle Hollow
+:User: --> (Use)
+"Main Admin" as Admin
+"Use the application" as (Use)
+Admin --> (Admin the application)
+@enduml
+
+
+__[Ref. https://github.com/plantuml/plantuml/pull/396[PR#396]]__
+
+
+== Usecases description
+
+
+If you want to have a description spanning several lines, you can use quotes.
+
+You can also use the following separators:
+* `+--+` (dashes)
+* `+..+` (periods)
+* `+==+` (equals)
+* `+__+` (underscores)
+
+By using them pairwise and enclosing text between them, you can created separators with titles.
+
+
+@startuml
+
+usecase UC1 as "You can use
+several lines to define your usecase.
+You can also use separators.
+--
+Several separators are possible.
+==
+And you can add titles:
+..Conclusion..
+This allows large description."
+
+@enduml
+
+
+
+== Use package
+
+You can use packages to group actors or use cases.
+
+
+@startuml
+left to right direction
+actor Guest as g
+package Professional {
+ actor Chef as c
+ actor "Food Critic" as fc
+}
+package Restaurant {
+ usecase "Eat Food" as UC1
+ usecase "Pay for Food" as UC2
+ usecase "Drink" as UC3
+ usecase "Review" as UC4
+}
+fc --> UC4
+g --> UC1
+g --> UC2
+g --> UC3
+@enduml
+
+
+
+You can use `+rectangle+` to change the display of the package.
+
+
+@startuml
+left to right direction
+actor "Food Critic" as fc
+rectangle Restaurant {
+ usecase "Eat Food" as UC1
+ usecase "Pay for Food" as UC2
+ usecase "Drink" as UC3
+}
+fc --> UC1
+fc --> UC2
+fc --> UC3
+@enduml
+
+
+
+== Basic example
+
+
+To link actors and use cases, the arrow `+-->+` is
+used.
+
+The more dashes `+-+` in the arrow, the longer the
+arrow.
+You can add a label on the arrow, by adding a `+:+`
+character in the arrow definition.
+
+In this example, you see that __User__ has not been defined
+before, and is used as an actor.
+
+@startuml
+
+User -> (Start)
+User --> (Use the application) : A small label
+
+:Main Admin: ---> (Use the application) : This is\nyet another\nlabel
+
+@enduml
+
+
+
+
+
+== Extension
+
+If one actor/use case extends another one, you can use the symbol `+<|--+`.
+
+
+@startuml
+:Main Admin: as Admin
+(Use the application) as (Use)
+
+User <|-- Admin
+(Start) <|-- (Use)
+
+@enduml
+
+
+
+
+== Using notes
+
+You can use the `+note left of+` , `+note right of+` ,
+`+note top of+` , `+note bottom of+` keywords to
+define notes related to a single object.
+
+A note can be also define alone with the `+note+`
+keywords, then linked to other objects using the `+..+` symbol.
+
+
+@startuml
+:Main Admin: as Admin
+(Use the application) as (Use)
+
+User -> (Start)
+User --> (Use)
+
+Admin ---> (Use)
+
+note right of Admin : This is an example.
+
+note right of (Use)
+ A note can also
+ be on several lines
+end note
+
+note "This note is connected\nto several objects." as N2
+(Start) .. N2
+N2 .. (Use)
+@enduml
+
+
+
+
+== Stereotypes
+
+You can add stereotypes while defining actors and use cases using `+<<+` and `+>>+`.
+
+
+@startuml
+User << Human >>
+:Main Database: as MySql << Application >>
+(Start) << One Shot >>
+(Use the application) as (Use) << Main >>
+
+User -> (Start)
+User --> (Use)
+
+MySql --> (Use)
+
+@enduml
+
+
+
+
+== Changing arrows direction
+
+By default, links between classes have two dashes `+--+` and are vertically oriented.
+It is possible to use horizontal link by putting a single dash (or dot) like this:
+
+
+@startuml
+:user: --> (Use case 1)
+:user: -> (Use case 2)
+@enduml
+
+
+You can also change directions by reversing the link:
+
+
+@startuml
+(Use case 1) <.. :user:
+(Use case 2) <- :user:
+@enduml
+
+
+It is also possible to change arrow direction by adding `+left+`, `+right+`, `+up+`
+or `+down+` keywords inside the arrow:
+
+
+@startuml
+:user: -left-> (dummyLeft)
+:user: -right-> (dummyRight)
+:user: -up-> (dummyUp)
+:user: -down-> (dummyDown)
+@enduml
+
+
+You can shorten the arrow by using only the first character of the direction (for example, `+-d-+` instead of
+`+-down-+`)
+or the two first characters (`+-do-+`).
+
+Please note that you should not abuse this functionality : __Graphviz__ gives usually good results without
+tweaking.
+
+And with the link::use-case-diagram#d551e48d272b2b07[`+left to right direction+`] parameter:
+
+@startuml
+left to right direction
+:user: -left-> (dummyLeft)
+:user: -right-> (dummyRight)
+:user: -up-> (dummyUp)
+:user: -down-> (dummyDown)
+@enduml
+
+
+
+== Splitting diagrams
+
+The `+newpage+` keywords to split your diagram into several pages or images.
+
+@startuml
+:actor1: --> (Usecase1)
+newpage
+:actor2: --> (Usecase2)
+@enduml
+
+
+
+
+== Left to right direction
+
+The general default behavior when building diagram is **top to bottom**.
+
+@startuml
+'default
+top to bottom direction
+user1 --> (Usecase 1)
+user2 --> (Usecase 2)
+
+@enduml
+
+You may change to **left to right** using the `+left to right direction+` command.
+The result is often better with this direction.
+
+
+@startuml
+
+left to right direction
+user1 --> (Usecase 1)
+user2 --> (Usecase 2)
+
+@enduml
+
+
+
+
+== Skinparam
+
+
+You can use the link::skinparam[skinparam]
+command to change colors and fonts for the drawing.
+
+You can use this command :
+* In the diagram definition, like any other commands,
+* In an link::preprocessing[included file],
+* In a configuration file, provided in link::command-line[the command line] or link::ant-task[the ANT task].
+
+You can define specific color and fonts for stereotyped actors and usecases.
+
+
+@startuml
+skinparam handwritten true
+
+skinparam usecase {
+BackgroundColor DarkSeaGreen
+BorderColor DarkSlateGray
+
+BackgroundColor<< Main >> YellowGreen
+BorderColor<< Main >> YellowGreen
+
+ArrowColor Olive
+ActorBorderColor black
+ActorFontName Courier
+
+ActorBackgroundColor<< Human >> Gold
+}
+
+User << Human >>
+:Main Database: as MySql << Application >>
+(Start) << One Shot >>
+(Use the application) as (Use) << Main >>
+
+User -> (Start)
+User --> (Use)
+
+MySql --> (Use)
+
+@enduml
+
+
+
+
+== Complete example
+
+
+
+@startuml
+left to right direction
+skinparam packageStyle rectangle
+actor customer
+actor clerk
+rectangle checkout {
+ customer -- (checkout)
+ (checkout) .> (payment) : include
+ (help) .> (checkout) : extends
+ (checkout) -- clerk
+}
+@enduml
+
+
+
+== Business Use Case
+
+You can add `+/+` to make Business Use Case.
+
+=== Business Usecase
+
+@startuml
+
+(First usecase)/
+(Another usecase)/ as (UC2)
+usecase/ UC3
+usecase/ (Last\nusecase) as UC4
+
+@enduml
+
+
+=== Business Actor
+
+@startuml
+
+:First Actor:/
+:Another\nactor:/ as Man2
+actor/ Woman3
+actor/ :Last actor: as Person1
+
+@enduml
+
+
+
+__[Ref. https://forum.plantuml.net/12179/[QA-12179]]__
+
+
+== Change arrow color and style (inline style)
+
+You can change the link::color[color] or style of individual arrows using the inline following notation:
+
+* `+#color;line.[bold|dashed|dotted];text:color+`
+
+
+@startuml
+actor foo
+foo --> (bar) : normal
+foo --> (bar1) #line:red;line.bold;text:red : red bold
+foo --> (bar2) #green;line.dashed;text:green : green dashed
+foo --> (bar3) #blue;line.dotted;text:blue : blue dotted
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/3770[QA-3770] and https://forum.plantuml.net/3816[QA-3816]]__
+__[See similar feature on link::deployment-diagram#qjxu5xkj874qkedanfcf[deployment-diagram] or link::class-diagram#b5b0e4228f2e5022[class diagram]]__
+
+
+== Change element color and style (inline style)
+
+You can change the link::color[color] or style of individual element using the following notation:
+* `+#[color|back:color];line:color;line.[bold|dashed|dotted];text:color+`
+
+
+@startuml
+actor a
+actor b #pink;line:red;line.bold;text:red
+usecase c #palegreen;line:green;line.dashed;text:green
+usecase d #aliceblue;line:blue;line.dotted;text:blue
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/5340[QA-5340] and adapted from https://forum.plantuml.net/6852[QA-6852]]__
+
+
+== Display JSON Data on Usecase diagram
+
+=== Simple example
+
+@startuml
+allowmixing
+
+actor Actor
+usecase Usecase
+
+json JSON {
+ "fruit":"Apple",
+ "size":"Large",
+ "color": ["Red", "Green"]
+}
+@enduml
+
+
+__[Ref. https://forum.plantuml.net/15481/possible-link-elements-from-two-jsons-with-both-jsons-embeded?show=15567#c15567[QA-15481]]__
+
+For another example, see on link::json#2fyxla9p9ob6l3t3tjre[JSON page].
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/using-a-citation-manager.adoc b/plantuml-docs/docs_from_alphadoc/using-a-citation-manager.adoc
new file mode 100644
index 00000000..b0574d38
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/using-a-citation-manager.adoc
@@ -0,0 +1,169 @@
+== Initial request
+
+A https://forum.plantuml.net/10470/using-a-citation-manager-in-plantuml[user has requested a supported or suggested method of using citations within a flow diagram].
+
+The goal of this page is to think together on an approriate solution.
+
+~~First, we have to focus **on the syntax**. We will see latter on to render such citations.~~
+There is now a __functionalities__ chapter when we should write exactly what we are expecting here. You can vote at the bottom of this page.
+
+Feel free to edit this page, to add comment or to add new proposal. We will then vote about the best syntax.
+
+
+== Functionalities
+
+
+What is it that is needed?
+You can start by voting:
+
+* vote::within[Citations to a reference box within in the diagram]?
+* vote::elsewhere[Citation to references held elsewhere in the host document]?
+* vote::both[Both features] ?
+
+=== Citation output
+What is wanted is effectively the ability to produce this:
+
+[plantuml]
+----
+@startuml
+"Alice1-3" --> Bob1,4
+@enduml
+----
+
+It is likely jounral editors may insist on slight variations like these:
+
+[plantuml]
+----
+@startuml
+"Alice(1-3)" --> Bob(1,4)
+@enduml
+----
+
+[plantuml]
+----
+@startuml
+"Alice[1-3]" --> Bob[1,4]
+@enduml
+----
+
+Ideally where the graphic format allows it, the citation should produce a clickable link which may take you to the Reference section of a document
+
+[plantuml]
+----
+@startuml
+"Alice[[#References 1-3]]" --> Bob
+@enduml
+----
+
+
+=== Reference List output
+If plantUML is hosting its own reference list in the figure, then it will need the ability to format up the reference correctly (or would it just be passed a preformatted string? But the preformatted string would need bold, underline and italics in the string?
+
+Normal reference lists are on fresh lines and look like this
+
+**1.** Derwing, T. M., Rossiter, M. J., & Munro, M. J. (2002). Teaching native speakers to listen to foreign-accented speech. Journal of Multilingual and Multicultural Development, 23(4), 245-259.
+
+**2.** Thomas, H. K. (2004). Training strategies for improving listeners' comprehension of foreign-accented speech (Doctoral dissertation). University of Colorado, Boulder.
+
+Space is at a premium in figures, so it may be sensible to pick a default reference style that minimises space, but also to consider NOT using new lines per reference.
+
+**1.** Derwing, TM __et al__ (2002). Teaching native speakers to listen to foreign-accented speech. Journal of Multilingual and Multicultural Development, 23, 245-59. **2.** Thomas, HK (2004). Training strategies for improving listeners' comprehension of foreign-accented speech (Doctoral dissertation). University of Colorado, Boulder.
+
+And so the functionality would produce something **like** this:
+
+[plantuml]
+----
+@startuml
+"Alice1" --> "Bob2"
+
+legend right
+ **References**
+ **1.** Derwing, TM //et al// (2002). Teaching native speakers to
+ listen to foreign-accented speech. Journal of Multilingual and
+ Multicultural Development, 23, 245-59. **2.** Thomas, HK (2004).
+ Training strategies for improving listeners' comprehension of
+ foreign-accented speech (Doctoral dissertation). University of
+ Colorado, Boulder
+endlegend
+
+@enduml
+----
+
+=== Inputs
+Apart from the basic syntax of how to reference, there would be a need to provide styling information to the outputs. While plantUML should make some good default choices, it is likely picky journal editors may have some specifics they want to specify.
+
+Therefore it would make sense for plantUML to either be able to take references to 2 files (URLs perhaps) that would save the overall content being in the UML? +
+
+* Reference File: I'd suggest something in a fairly standard format like 'bibtex' which most citation managers can output to. See http://www.bibtex.org/Format/[BibTex]
+* Citation File: See https://citationstyles.org/[CSL Standards]
+
+No-one would appreciate having to reproduce these as different types of document by hand for a single figure etc.
+
+
+== Proposal 1 for syntax
+
+This __proposal 1__ is the following one.
+
+----
+@startuml
+
+@Manual{anderson2015,
+ title = {Exhumation by debris flows in the 2013 Colorado Front Range storm},
+ author = { S.W. Anderson and S.P. Anderson and R.S Anderson},
+ journal = {Geology},
+ year = {2015},
+ pages = {31,94},
+ url = {https://www.R-project.org/},
+}
+
+start
+:Some text[@anderson2015];
+end
+@enduml
+----
+
+=== Advantage ?
+
+The `+[@anderson2015]+` format is used in some flavours of markdown. It remains human readable. An alternative might be latex's format of `+\cite{anderson2015}+`.
+
+=== Drawback
+
+'''
+
+> > ** Not sure syntax is the place to start!**
+> >
+> > Sorry - functionality is the place to start! What is it that is needed? Citations to a reference box within in the diagram? Or citation to references held elsewhere in the host document?
+> Ok, we have added a new chapter __Functionalities__.
+> This chapter will be moved before this one when the wiki will allow us to do so :-)
+
+I've had a breif play in latex to see what can be done.
+----
+@startuml
+:Some text \\citep{anderson2015};
+@enduml
+----
+
+> > Works in so far as after manipulating the \\ latex can make it a reference like (1) or ^1 etc, and Latex will then paste in the references at the end of the document along with any from the text part of the document. This feels clean. Latex will also make the citation a hyperlink to take you to that reference. This puts the effort of referencing and formatting etc with latex which has the abilities. Otherwise you start having to do a lot of work!
+> Well, this syntax is too close to Latex (PlantUML Team opinion).
+> Note that whatever the syntax we use (for example `+[@anderson2015]+`), we will generate some LaTex when exporting to Latex (so very likely `+\citep{anderson2015}+` in the Latex output). So the effort of referencing and formatting will still be done by LaTex. And maybe other format (PNG...) won't do something as complete as Latex, but that is not a real issue (at least, to us).
+
+However, the box widths are wrong because it thinks the box has \\citep{anderson2015} in it and it actually has (1).
+
+> > Latex wont suit everyone! But can't see how you would be more functional easily in a PNG for instance.
+> We really don't want to focus on LaTex only. It's important for us (PlantUML Team) to have something that works for all formats (including PNG). For PNG, we could list references details at the bottom of the diagram, for example.
+
+if you were limitting this to latex - you don't need the @Manual{} section above at all... (thats in the latex effectively)
+
+Couple of bits of sample code:
+
+* https://bitbucket.org/polc1410/plantumlcitation/downloads/plantuml.pdf[https://bitbucket.org/polc1410/plantumlcitation/downloads/plantuml.pdf]
+* https://bitbucket.org/polc1410/plantumlcitation/src/master[https://bitbucket.org/polc1410/plantumlcitation/src/master]
+
+=== Reference box on the diagram
+
+> > For simpler diagrams I can see a use for a reference box on the diagram. Effectively a notes box with the references in it. BUT - unless there is code ready to lift from other projects this is a LOT of effort - you'd need to format the citation (i.e. do you want a superscript, a normal number, round or square brackets, what about when you reference [1 - 4] and what about (1,3,4) or (1, 3 & 4) etc. Then the formatting of the actual reference changes by place of publication too. There are 'standard' formats for sharing those formats etc but perhaps the use case is not huge.
+> >
+> Rather that using notes box, I wonder if listing references on the bottom of the diagrams is a better solution.
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/versioning-scheme.adoc b/plantuml-docs/docs_from_alphadoc/versioning-scheme.adoc
new file mode 100644
index 00000000..ca3c9287
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/versioning-scheme.adoc
@@ -0,0 +1,63 @@
+== Context (of versioning)
+Back in 2009, **PlantUML** used a simple and unique increment number for its versioning.
+
+The major reason is that **PlantUML** is developed with
+http://en.wikipedia.org/wiki/Continuous_integration[continuous integration]
+in mind. That means that there are new releases quite often, with (hopefully!) backward compatibility.
+
+If the language is usually backward compatibility, it is not the case for the PlantUML Java API itself.
+The single number versioning schema does not allow to clearly indicated Java API changes.
+
+Note that here are two different things :
+* The PlantUML Language (that is everything that is between `+@startuml+` and `+@enduml+` for instance) : __This part is very stable. We really take care about backward compatibility here__. Even diagrams that have been written by earlier versions of PlantUML are still readable by latest releases.
+* The Java API Integration : it has been changing since the beginning. This impacts only Java Plugins and not tools that are using PlantUML through command line.
+
+
+== Official Versioning Scheme
+PlantUML follows now some usual and __almost__ standard pattern based on three
+numbers : `+MAJOR.YEAR.RELEASE+`.
+
+If you prefer, you can also read this as `+MAJOR.MINOR.PATCH+`.
+
+|===
+| Number | Example | Description
+
+| `+MAJOR+`
+| 1
+| This number will increase when there will be an incompatible change in the Java API.+++ +++Also, if ever there is a change in the PlantUML language itself which break ascending compatibility, we will also increase this number, __but we expect that this will never happen__ (it has __not__ since 2009!).+++ +++Change in `+MAJOR+` number will be documented: we will clearly explain what has changed between major versions. We expect less than one change per year here.
+
+| `+YEAR+` / `+MINOR+`
+| 2017
+| This number will be the releasing year of the version. While this is not http://semver.org/[completely standard], we think that it will help people to know whether they are using a recent version of PlantUML or not.
+
+| `+RELEASE+` / `+PATCH+`
+| 12
+| This number will be simply incremented for each release of the year. We expect about 20 to 30 releases per year. It will be reset to zero at each year change.
+
+|===
+
+
+Note that when incrementing the `+MAJOR+` number, `+YEAR+` will stick the the current year,
+and `+RELEASE+` will be also incremented.
+
+
+
+
+== Knowing the exact version you are using
+
+If you want to know the exact version you are using, you can type in the command line:
+
+----
+java -jar plantuml.jar -version
+----
+
+or use the following small special diagram description :
+
+@startuml
+version
+@enduml
+
+
+__(See also link::faq#e20981e91761e6e8[on the FAQ])__
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/vizjs.adoc b/plantuml-docs/docs_from_alphadoc/vizjs.adoc
new file mode 100644
index 00000000..9cb92d83
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/vizjs.adoc
@@ -0,0 +1,68 @@
+== The context of VizJs
+PlantUML uses Graphviz/DOT to compute node positionning for every UML diagrams (except Sequence Diagrams and Activity Beta Diagrams).
+The fact that DOT computes automatically the position of node is a key feature, and algorithms implemented in
+DOT usually give very good result.
+
+However, there are some drawbacks of using DOT :
+the computation is done by an external program (dot.exe on Windows, dot on linux), and that means that :
+
+* PlantUML has to create a new process for each diagram, (and communication with this new process could be source of bugs).
+* Users have to install DOT on their system, in addition of Java.
+* PlantUML is not fully portable.
+
+There is a work-in-progress to have link::smetana02[a full Java implementation of PlantUML.]
+However, even if this is somehow working, this is not finished yet.
+
+
+Recently, some user points out http://forum.plantuml.net/4577/effort-to-decouple-plantuml-from-graphviz[another possible solution]
+(We thank him by the way!).
+
+Using both https://github.com/mdaines/viz.js[VizJs (a port to Javascript of GraphViz)]
+and http://eclipsesource.com/blogs/getting-started-with-j2v8[J2V8 (a highly efficient JavaScript runtime for Java)], it is theorically possible
+to have a (almost) full Java implementation.
+
+With the great help of __Andreas Studer__ that makes a lot of work to test various JavaScript engine, we are now able to
+propose a working version.
+
+
+== Using visjs
+
+This means that it is possible to use PlantUML without installing GraphViz (which can be useful when you do not have administration right for example).
+To do so, in addition to plantuml.jar, you must have:
+
+* https://github.com/plantuml/vizjs[vizjs]: A Java library written by __Andreas Studer__ that embed viz.js and call J2V8
+* The corresponding J2V8 implementation for your OS:
+* For Windows x86/64 bit: http://beta.plantuml.net/j2v8_win32_x86_64-3.1.6.jar[j2v8\_win32\_x86\_64-3.1.6.jar]
+* For Linux x86: http://beta.plantuml.net/j2v8_linux_x86_64-3.1.6.jar?[j2v8\_linux\_x86\_64-3.1.6.jar]
+* For Mac OS: http://beta.plantuml.net/j2v8_macosx_x86_64-3.1.6.jar[j2v8\_macosx\_x86\_64-3.1.6.jar]
+
+So, having the three files plantuml.jar, http://beta.plantuml.net/vizjs.jar[vizjs.jar] and j2v8\_XXXXX-3.1.6.jar in the very same folder (this is important) you can
+run PlantUML without having GraphViz installed.
+
+Finally, you have to set up the `+GRAPHVIZ_DOT+` link::graphviz-dot[environment variable] value to `+vizjs+`
+(or through the command line with http://stackoverflow.com/questions/5045608/proper-usage-of-java-d-command-line-parameters[-D flag] or -graphvizdot flag).
+
+Then, you can double-check your configuration by running the usual:
+
+----
+@startuml
+testdot
+@enduml
+----
+
+
+== Limitations
+
+Note that this is only working with Java 8 (because of J2V8).
+For complex diagrams (especially with labels on arrow), the solution is not working very well.
+
+An issue has been opened on viz.js side (see https://github.com/mdaines/viz.js/issues/65[Error when generating graph]).
+
+However, in that case, PlantUML falls back to some degrated solution.
+
+
+== Alternative layout engines
+
+See link::elk[elk] and link::smetana02[smetana] for other alternatives to link::graphviz-dot[graphviz-dot].
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/wbs-diagram.adoc b/plantuml-docs/docs_from_alphadoc/wbs-diagram.adoc
new file mode 100644
index 00000000..d7b40d3e
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/wbs-diagram.adoc
@@ -0,0 +1,334 @@
+== Work Breakdown Structure (WBS)
+
+WBS diagram are still in beta: the syntax may change without notice.
+
+
+== OrgMode syntax
+
+This syntax is compatible with OrgMode
+
+
+@startwbs
+* Business Process Modelling WBS
+** Launch the project
+*** Complete Stakeholder Research
+*** Initial Implementation Plan
+** Design phase
+*** Model of AsIs Processes Completed
+**** Model of AsIs Processes Completed1
+**** Model of AsIs Processes Completed2
+*** Measure AsIs performance metrics
+*** Identify Quick Wins
+** Complete innovate phase
+@endwbs
+
+
+
+== Change direction
+
+You can change direction using `+<+` and `+>+`
+
+
+@startwbs
+* Business Process Modelling WBS
+** Launch the project
+*** Complete Stakeholder Research
+*** Initial Implementation Plan
+** Design phase
+*** Model of AsIs Processes Completed
+****< Model of AsIs Processes Completed1
+****> Model of AsIs Processes Completed2
+***< Measure AsIs performance metrics
+***< Identify Quick Wins
+@endwbs
+
+
+
+== Arithmetic notation
+
+You can use the following notation to choose diagram side.
+
+
+@startwbs
++ New Job
+++ Decide on Job Requirements
++++ Identity gaps
++++ Review JDs
+++++ Sign-Up for courses
+++++ Volunteer
+++++ Reading
+++- Checklist
++++- Responsibilities
++++- Location
+++ CV Upload Done
++++ CV Updated
+++++ Spelling & Grammar
+++++ Check dates
+---- Skills
++++ Recruitment sites chosen
+@endwbs
+
+
+
+== Multilines
+
+You can use `+:+` and `+;+` to have multilines box, as on link::mindmap-diagram#4ea2ymh57pwsk99qth2e[MindMap].
+
+
+@startwbs
+* <&flag> Debian
+** <&globe> Ubuntu
+
+***:Linux Mint
+Open Source;
+
+*** Kubuntu
+*** ...
+@endwbs
+
+
+__[Ref. https://forum.plantuml.net/13945[QA-13945]]__
+
+
+== Removing box
+
+You can use underscore `+_+` to remove box drawing.
+
+=== Boxless on Arithmetic notation
+==== Several boxless node
+
+@startwbs
++ Project
+ + Part One
+ + Task 1.1
+ - LeftTask 1.2
+ + Task 1.3
+ + Part Two
+ + Task 2.1
+ + Task 2.2
+ -_ Task 2.2.1 To the left boxless
+ -_ Task 2.2.2 To the Left boxless
+ +_ Task 2.2.3 To the right boxless
+@endwbs
+
+==== All boxless node
+
+@startwbs
++_ Project
+ +_ Part One
+ +_ Task 1.1
+ -_ LeftTask 1.2
+ +_ Task 1.3
+ +_ Part Two
+ +_ Task 2.1
+ +_ Task 2.2
+ -_ Task 2.2.1 To the left boxless
+ -_ Task 2.2.2 To the Left boxless
+ +_ Task 2.2.3 To the right boxless
+@endwbs
+
+
+=== Boxless on OrgMode syntax
+==== Several boxless node
+
+@startwbs
+* World
+** America
+***_ Canada
+***_ Mexico
+***_ USA
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+__[Ref. https://forum.plantuml.net/13297[QA-13297]]__
+
+==== All boxless node
+
+@startwbs
+*_ World
+**_ America
+***_ Canada
+***_ Mexico
+***_ USA
+**_ Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+__[Ref. https://forum.plantuml.net/13355[QA-13355]]__
+
+
+== Colors (with inline or style color)
+
+It is possible to change node link::color[color]:
+
+* with inline color
+
+@startwbs
+*[#SkyBlue] this is the partner workpackage
+**[#pink] this is my workpackage
+** this is another workpackage
+@endwbs
+
+
+@startwbs
++[#SkyBlue] this is the partner workpackage
+++[#pink] this is my workpackage
+++ this is another workpackage
+@endwbs
+
+
+__[Ref. https://forum.plantuml.net/12374[QA-12374], only from v1.2020.20]__
+
+* with style color
+
+@startwbs
+
+* this is the partner workpackage <>
+** this is my workpackage <>
+** this is another workpackage
+@endwbs
+
+
+@startwbs
+
++ this is the partner workpackage <>
+++ this is my workpackage <>
+++ this is another workpackage
+@endwbs
+
+
+
+== Using style
+
+It is possible to change diagram style.
+
+
+@startwbs
+
+* World
+** America
+*** Canada
+*** Mexico
+**** Chihuahua
+*** USA
+**** Texas
+***< New York
+** Europe
+***_ England
+***_ Germany
+***_ Spain
+@endwbs
+
+
+
+== Word Wrap
+
+Using `+MaximumWidth+` setting you can control automatic word wrap. Unit used is pixel.
+
+
+@startwbs
+
+
+
+
+* Hi =)
+** sometimes i have node in wich i want to write a long text
+*** this results in really huge diagram
+**** of course, i can explicit split with a\nnew line
+**** but it could be cool if PlantUML was able to split long lines, maybe with an option who specify the maximum width of a node
+
+@endwbs
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/what-is-a-software-modeling-tool.adoc b/plantuml-docs/docs_from_alphadoc/what-is-a-software-modeling-tool.adoc
new file mode 100644
index 00000000..1035409b
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/what-is-a-software-modeling-tool.adoc
@@ -0,0 +1,11 @@
+== Modeling Tool
+
+Some users like to use PlantUML as a modeling tool.
+
+The goal of this page is to answer to this simple question:
+
+* **What is a modeling tool ?**
+
+Something important for the PlantUML team is to keep PlantUML as a text driven tool. Apart from this, we are open to all suggestions, so feel free to contribute by editing this page!
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/wire-diagram.adoc b/plantuml-docs/docs_from_alphadoc/wire-diagram.adoc
new file mode 100644
index 00000000..962a2f52
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/wire-diagram.adoc
@@ -0,0 +1,765 @@
+== Wire or Block Diagram
+
+
+Wire or Block diagram is a subproject included in PlantUML that may help you to design block diagram, wire or https://en.wikipedia.org/wiki/Wiring_diagram[wiring diagram].
+
+You can use @startwire and @endwire keywords.
+
+
+=== Reference
+
+See Q&A references:
+* https://forum.plantuml.net/9054/is-possible-create-functional-block-diagrams-example-given[QA-9054]
+* https://forum.plantuml.net/11066/is-there-any-way-to-produce-block-diagrams[QA-11066]
+* https://forum.plantuml.net/12518/is-there-simple-way-use-plantuml-draw-hardware-block-diagram[QA-12518]
+* https://forum.plantuml.net/12700[QA-12700]
+
+=== Caution
+
+> "There are many requests for block diagrams.
+>
+> The good news is that we have started to do some experiments...
+>
+> This is really a preliminary version so don't expect anything real useful right now. However, you can play with the syntax and tell us what you think about it."
+
+
+== Basic component
+
+Component of the wire diagram are declared with an ID starting with `+*+` and containing only letters, digit or underscore. When printed, underscores is changed to spaces. You can optionally provide a dimension to components.
+
+
+@startwire
+* first
+* second_box [100x50]
+* third
+@endwire
+
+
+
+You can start new column using `+--+` as separator
+
+Components can be nested using indentations (like in Python)
+
+
+@startwire
+* first
+* second_box [100x50]
+* third
+--
+* big_container
+ * foo1
+ * foo2
+ * foo3
+@endwire
+
+
+
+You can change the placement using two directives:
+* `+move+` for relative movement
+* `+goto+` for absolute movement
+
+
+@startwire
+* first [70x70]
+move(10,20)
+* second_box [90x70]
+* third [70x70]
+
+goto(100,10)
+* last [70x70]
+
+goto(300,5)
+* big_container
+ * foo1 #lightBlue
+ * foo2 #AAA
+ * foo3
+
+@endwire
+
+
+
+== Local reference
+
+Each component implicitely create a local referential you can use.
+
+The `+spot+` directive allows to show a point on the diagram.
+
+
+
+@startwire
+* first [70x70] #EEE
+move(10,20)
+* second_box [70x70]
+* third [70x70]
+
+goto(100,10)
+* last [70x70]
+
+goto(300,5)
+* big_container
+ * foo1
+ * foo2
+ * foo3
+
+spot first
+spot big_container #blue
+spot second_box(100%, 100%)
+spot second_box(10, 30) #FF00FF
+spot third(100%+10, 50%) #cyan
+@endwire
+
+
+
+== Arrows
+
+It is possible to add horizontal or vertical arrows on the diagram.
+It's important to note that those lines do **not** change the layout of the element.
+Furthermore, those arrows are always straight.
+
+You can put text on arrows and change their color.
+
+
+@startwire
+
+* DDR3 [100x200]
+--
+move(100,0)
+* SLC_NAND [100x200]
+
+DDR3 -> SLC_NAND : abcd
+DDR3 <-> SLC_NAND : abcd
+DDR3 <- SLC_NAND : abcd
+DDR3 - SLC_NAND : abcd
+DDR3 => SLC_NAND : abcd
+DDR3 <=> SLC_NAND #red : abcd
+DDR3 <= SLC_NAND : abcd
+DDR3 = SLC_NAND : abcd
+@endwire
+
+
+
+
+@startwire
+
+* DDR3 [200x100]
+move(0,200)
+* SLC_NAND [200x100]
+
+DDR3 --> SLC_NAND
+DDR3 <--> SLC_NAND
+DDR3 <-- SLC_NAND
+DDR3 -- SLC_NAND
+DDR3 ==> SLC_NAND
+DDR3 <==> SLC_NAND
+DDR3 <== SLC_NAND
+DDR3 == SLC_NAND #red
+@endwire
+
+
+
+== Print texts
+
+You can add some texts to your diagrams.
+
+
+@startwire
+
+* DDR3L #salmon
+ print("This is inside")
+
+print("This text is printed between")
+print("the components")
+
+* SLC_NAND [150x200]
+* TestPoints
+--
+* Big_Chip #AAA
+ move(10, 30)
+ print("Foo 10")
+ * PF3000 [150x300]
+ print("Foo 20")
+
+ print("Bar")
+
+ * EEPROM #lightBlue
+@endwire
+
+
+
+
+== Full example
+
+
+@startwire
+goto(0,360)
+* DDR3L [70x70]
+* SLC_NAND [70x70]
+* TestPoints [70x30]
+* PF3000 [70x130]
+* EEPROM [70x30]
+
+--
+move(60,0)
+* i_MX7_SoC
+ * 2x_ARM [70x70]
+ * ARM [70x70]
+ * PXP [70x70]
+ * Crypto [70x30]
+ * DDR3 [70x70]
+ move(0,90)
+ * JTAG [70x30]
+ --
+ * signals
+ * 24_bit_display [85x20]
+ * 24_bit_camera [85x20]
+ * 2x_DS_DSIO [85x20]
+ * 124x_GPIO [85x20]
+ * 4x_12C [85x20]
+ * 3x_12S [85x20]
+ * 7x_UART [85x20]
+ * 2x_QuadSPI [85x20]
+ * 4x_eCSPI [85x20]
+ * 2x_CAN [85x20]
+ * 4x_Timer [85x20]
+ * Local_bus [85x20]
+ * GPMI [85x20]
+ * 2x_Gbit_MAC [85x20]
+ * 6x6_keypard [85x20]
+ * 4x_PWM [85x20]
+ * 2x_SmartCard [85x20]
+ * 4x_Watchdog [85x20]
+ * MQS [85x20]
+
+ move(35,10)
+ * ADC1 [70x30]
+ * ADC2 [70x30]
+ * MIPI_DSI [70x30]
+ * PCIe [70x30]
+ * USB2_0 [70x30]
+ * USB2_0_ [70x30]
+ * USB2_0__ [70x30]
+ * MIPI_CSI [70x30]
+
+--
+move(40, 480)
+* WLAN_BT [100x30]
+* 1Gbit_PHY [100x30]
+* 1Gbit_PHY_ [100x30]
+move(0, 120)
+* WM_8731L [100x30]
+
+move(-40, 10)
+* SPI_FLASH [80x30]
+move(110, -50)
+* Resistive [80x30]
+
+move(-90, 80)
+* DSI_to_LVDS [100x30]
+move(0,60)
+* USB2_0 [100x30]
+
+--
+
+* 240pin [50x1220]
+
+
+DDR3L(100%,50%-10) => i_MX7_SoC.DDR3
+SLC_NAND -> i_MX7_SoC.signals
+SLC_NAND(100%, 50) -> i_MX7_SoC.signals
+
+TestPoints -> i_MX7_SoC.JTAG
+
+
+PF3000 => i_MX7_SoC #0000ff
+PF3000 => i_MX7_SoC
+PF3000 => i_MX7_SoC
+
+
+i_MX7_SoC.signals(100%,25) => 240pin
+i_MX7_SoC.signals(100%,65) => 240pin
+
+i_MX7_SoC.signals -> 240pin #red
+i_MX7_SoC.signals -> 240pin
+i_MX7_SoC.signals -> 240pin
+i_MX7_SoC.signals -> 240pin
+i_MX7_SoC.signals -> 240pin
+i_MX7_SoC.signals -> 240pin
+i_MX7_SoC.signals -> 240pin
+i_MX7_SoC.signals -> 240pin
+i_MX7_SoC.signals -> 240pin
+i_MX7_SoC.signals -> 240pin
+i_MX7_SoC.signals -> 240pin
+i_MX7_SoC.signals -> 240pin
+i_MX7_SoC.signals -> 240pin
+i_MX7_SoC.signals -> 240pin
+i_MX7_SoC.signals -> 240pin
+i_MX7_SoC.signals -> 240pin
+
+i_MX7_SoC.signals.Local_bus -> WLAN_BT
+
+@endwire
+
+
+
+
+== Suggestions and ideas about the new 1.2020.24 syntax
+
+
+[[#77FF00#The PlantUML Team:]] We are waiting for users feedback :-)
+
+
+== Wanted features or examples of expecting syntax
+
+=== General
+General feature requests that did not come from a QA.
+
+* Most wire diagrams have the same "device/component" in multiple locations. For instance, you could have the exact same temperature sensor in multiple spots (as if spread out over the board). A great feature would be to setup components with their connection points then replicated them throughout the layout. See item #5 in the "first impressions" section at the bottom.
+* support "rankDir" or left to right vs top to bottom layout. sometimes I would rather new componets layout left to right instead of vertically.
+
+=== From QA-11066
+
+According to https://forum.plantuml.net/11066/is-there-any-way-to-produce-block-diagrams[QA-11066]:
+
+* Add the possibility to give hspace (horizontal space) [[#00FF00#DONE]] (with `+move+`)
+* Putting block in block with defined size [[#00FF00#DONE]]
+* ~~The vspace inside block do nothing~~
+
+* Add `+left, middle and right (or absolute offset)+` for lateral positionning of blocks
+* Name blocks and IO to be able to connect easily after. Connections are often `+1 to 1+`, but sometimes `+1 -> n+` or `+n -> 1+`.
+
+* Instead of:
+** "right:" and "left:"
+** "connector "RTN" is left" and "connector "VCC" is top" would make it more clear. -> to debate
+
+* proposal syntax:
+** `+=>+` can represent a thicker arrow like a bus [[#00FF00#DONE]]
+** `+->+` will represent a single wire and should try to be a straight as possible. [[#00FF00#DONE]]
+** `+left of+`, `+right of+` should be for component placement. All `+left of X+` should be vertically aligned and stacked; while X should expand vertically to accept straight wires (unless absolute size is specified).
+** prefer right angles for wire connections and direction changing
+** the render of the wire will assume the same overlay layer as the highest connection point. That is, if a component(x) is overlayed another component, any wire to that component(x) will overlay the same components that the component(x) overlays
+** the name of the bus/wire will be centered on the wire and re-rendered for each "section" between connections or breaks (overlay breaks).
+
+
+
+
+
+image::https://www.compulab.com/wp-content/uploads/2015/10/SOM-iMX7-System-on-Module-block-diagram.png[]
+
+
+=== [[#aaff00#SW:]] From my own tests https://forum.plantuml.net/12700/wireframe-null-pointer-syntax-error-with-a-space[QA-12700]
+. Text or label on arrow with syntax like sequence diagram with the ": label" [[#00FF00#DONE]]
+. Alias with "BlockLabelwith BackSlash\_n:allowed" as BlockAlias
+. Vertical arrow with `+-->+` [[#00FF00#DONE]]
+. Arrow with 2 ends with `+<->+` [[#00FF00#DONE]]
+. Arrow with angle: if you write "$i__MX7__SoC.Crypto -> $i__MX7__SoC.signals.3x\_12S" the line go to 7x UART
+. If not possible, let create hLines and vline to create our own arrow
+. Start an arrow on a spot or at a given position
+. Stereotypes [[[#aaffaa#ThL:]]or global/local style or inline style] to be able to use new skinparams (background color, block name position and orientation, etc.)
+. Free label with position (or block without border) ([[#aaffaa#ThL:]] in order to accept special char, `+(,),-+` or `+newline+`)
+. Let space (and tab) be used before wires and spots
+. Is the `+$+` syntax the best? It is not easy when you have procedure and functions also with $. [[#aaff00#SW:]]only one syntax (even i don't like it :-) ) is better than many syntaxes (less code to maintain, less bug, etc.) [[#00FF00#DONE]] (we use `+*+` now)
+
+
+
+[[#aaffaa#ThL:]] Then for nested, use multiples `+*+` (Perhaps re-use code of mindmap...):
+----
+@startwire
+*first
+*second_box [100x300]
+*third
+--
+*big_container
+**foo1
+**foo2
+**foo3
+@endwire
+----
+
+Allow also not significant space or indentation __(especially from processing [cf. https://forum.plantuml.net/12230[QA-12230]])__
+----
+@startwire
+ *big_container
+ **foo1
+ **foo2
+ **foo3
+@endwire
+----
+
+
+
+
+
+[[#aaff00#SW:]] To be really usable in real work, the mandatory features are:
+
+. Labels (on lines and on components) [[#00FF00#DONE]] [[#aaff00#SW:]] not for vertical lines
+. Lines not only from left to right. For inspiration https://docs.python.org/3/library/turtle.html[Turtle Graphics] if not automatic
+. A base syntax to be extended easily like "nwdiag extended syntax" for example
+. [[#aaffaa#ThL:]] Could you add text on vertical mode, as:
+
+@startwire
+* DDR3 [200x100]
+move(0,200)
+* SLC_NAND [200x100]
+
+DDR3 --> SLC_NAND : abcd
+DDR3 <--> SLC_NAND : abcd
+DDR3 <-- SLC_NAND : abcd
+DDR3 -- SLC_NAND : abcd
+DDR3 ==> SLC_NAND : abcd
+DDR3 <==> SLC_NAND : abcd
+DDR3 <== SLC_NAND : abcd
+DDR3 == SLC_NAND #red : abcd
+@endwire
+
+. [[#aaff00#SW:]]h and vline
+
+
+@startwire
+* _ [50x1]
+move (50, -20)
+* __ [1x50]
+move (-50, -20)
+* ___ [50x1]
+move (0, -20)
+* ____ [1x50]
+move (0, -20)
+* _____ [50x1]
+--
+*_______________ [50x100]
+--
+* ______ [50x1]
+move (50, -20)
+* _______ [1x50]
+move (-50, -20)
+* ________ [50x1]
+move (0, -20)
+* _________ [1x50]
+move (0, -20)
+* __________ [50x1]
+--
+* ____________ [1x100]
+move (10, -100)
+print("<&heart>\n**Happy New year**")
+move (2, 1 )
+print ("")
+@endwire
+
+----
+@startwire
+ ' simpler with
+hline [50]
+move (50, -20)
+vline (50)
+move (-50, -20)
+hline (50)
+move (0, -20)
+vline (50)
+move (0, -20)
+hline (50)
+--
+*_______________ [50x100]
+
+--
+hline (50)
+move (50, -20)
+vline (50)
+move (-50, -20)
+hline (50)
+move (0, -20)
+vline (50)
+move (0, -20)
+hline (50)
+--
+* ____________ [1x100]
+move (10, -100)
+print("<&heart>\n**Happy New year**")
+move (2, 1 )
+print ("")
+@endwire
+----
+
+...
+
+Any thought ?
+
+...
+
+
+=== From other... TBC...
+
+
+@startwire
+* foo
+@endwire
+
+
+or expecting syntax:
+----
+@startwire
+ ' To be complete
+@endwire
+----
+
+
+== Attempt to reproduce the full example
+
+
+@startwire
+goto(0,360)
+* DDR3L [70x70] #lightgray
+* SLC_NAND [70x70] #lightgray
+* TestPoints [70x30] #lightgray
+* PF3000 [70x130] #lightgray
+move(0,220)
+* EEPROM [70x30] #lightgray
+
+--
+move(60,0)
+* i_MX7_SoC #lightgray
+ * 2x_ARM [70x70] #white
+ * ARM [70x70] #white
+ * PXP [70x70] #white
+ * Crypto [70x30] #white
+ * DDR3 [70x70] #white
+ move(0,90)
+ * JTAG [70x30] #white
+ --
+ * signals #white
+ * 24_bit_display [85x20]
+ * 24_bit_camera [85x20]
+ * 2x_DS_DSIO [85x20]
+ * 124x_GPIO [85x20]
+ * 4x_12C [85x20]
+ * 3x_12S [85x20]
+ * 7x_UART [85x20]
+ * 2x_QuadSPI [85x20]
+ * 4x_eCSPI [85x20]
+ * 2x_CAN [85x20]
+ * 4x_Timer [85x20]
+ * Local_bus [85x20]
+ * GPMI [85x20]
+ * 2x_Gbit_MAC [85x20]
+ * 6x6_keypard [85x20]
+ * 4x_PWM [85x20]
+ * 2x_SmartCard [85x20]
+ * 4x_Watchdog [85x20]
+ * MQS [85x20]
+
+ move(35,10)
+ * ADC1 [70x30] #white
+ * ADC2 [70x30] #white
+ * MIPI_DSI [70x30] #white
+ * PCIe [70x30] #white
+ * USB2_0 [70x30] #white
+ * USB2_0_ [70x30] #white
+ * USB2_0__ [70x30] #white
+ * MIPI_CSI [70x30] #white
+
+--
+move(40, 480)
+* WLAN_BT [100x30] #lightgray
+* 1Gbit_PHY [100x30] #lightgray
+* 1Gbit_PHY_ [100x30] #lightgray
+move(0, 120)
+* WM_8731L [100x30] #lightgray
+
+move(-40, 10)
+* SPI_FLASH [80x30] #lightgray
+move(110, -50)
+* Resistive [80x30] #lightgray
+
+move(-90, 80)
+* DSI_to_LVDS [100x30] #lightgray
+move(0,30)
+* USB2_0 [100x40] #lightgray
+
+--
+
+* 240pin [50x1220] #lightgray
+
+
+DDR3L(100%,50%-10) <=> i_MX7_SoC.DDR3 : 32 bit
+SLC_NAND <-> i_MX7_SoC.signals : GPMI
+SLC_NAND(100%, 50) <-> i_MX7_SoC.signals : MMC
+
+TestPoints <-> i_MX7_SoC.JTAG : JTAG
+
+
+PF3000 => i_MX7_SoC #0000ff : Power
+PF3000 => i_MX7_SoC : Power
+PF3000 => i_MX7_SoC : Power
+
+EEPROM <-> DSI_to_LVDS : I2C
+
+i_MX7_SoC.signals(100%,25) => 240pin : \nup to 1x PD (24-bit)\n
+i_MX7_SoC.signals(100%,65) <= 240pin : up to 1x C (P CSI)
+
+i_MX7_SoC.signals -> 240pin #red :
+i_MX7_SoC.signals <-> 240pin : up-to 7x
+i_MX7_SoC.signals <-> 240pin : up-to 3x
+i_MX7_SoC.signals <-> 240pin : up-to 3x
+i_MX7_SoC.signals <-> 240pin : up-to 124x
+i_MX7_SoC.signals <-> 240pin : up-to 2x
+i_MX7_SoC.signals <-> 240pin : up-to 3x
+i_MX7_SoC.signals <-> 240pin : up-to 2x
+i_MX7_SoC.signals <-> 240pin : up-to 2x
+i_MX7_SoC.signals <-> 240pin : up-to 4x PWM
+i_MX7_SoC.signals <-> 240pin : up-to 6x
+i_MX7_SoC.signals <-> 240pin : up-to 1x
+i_MX7_SoC.signals <-> 240pin : up-to 6 x 6
+i_MX7_SoC.signals <-> 240pin : up-to 2x
+i_MX7_SoC.signals <-> 240pin : up-to 4x
+i_MX7_SoC.signals <-> 240pin : up-to 1x MQS int
+
+i_MX7_SoC.signals <-> WLAN_BT : UART
+i_MX7_SoC.signals <-> WLAN_BT : MMC
+
+i_MX7_SoC.signals <-> 1Gbit_PHY : RGMII
+1Gbit_PHY <-> 240pin : 1Gbit Eth
+
+i_MX7_SoC.signals <-> 1Gbit_PHY_ : RGMII
+1Gbit_PHY_ <-> 240pin : 1Gbit Eth
+
+i_MX7_SoC.PCIe <=> 240pin : PCI Express 1
+
+i_MX7_SoC.USB2_0 <-> USB2_0 : HSIC
+USB2_0 <-> 240pin : USB 2.0
+USB2_0 <-> 240pin : USB 2.0
+USB2_0 <-> 240pin : USB 2.0
+
+i_MX7_SoC.USB2_0_ <-> 240pin : USB 2.0 OTG
+i_MX7_SoC.USB2_0__ <-> 240pin : USB 2.0 HOST
+
+i_MX7_SoC.MIPI_CSI <-> 240pin : MIPI-CSI
+
+@endwire
+
+
+
+== Remark after first use...
+
+=== 1. Label of component
+
+`+print+` (for label of component) is not useful (for other text, why not!)
+
+* Why not create label as:
+----
+* alias [a x b] #color : long label
+----
+
+e.g. :
+----
+* WM_8731L [100x30] #green : "Audio_Codec \nWM_8731L"
+----
+or
+----
+* WM_8731L [100x30] #green : Audio_Codec \nWM_8731L
+----
+
+=== 2. Padding
+
+Could you add padding for text on double arrow `+<=>+`?
+
+=== 3. Component Label Positioning
+* I think centering the label inside a box would be a better default
+* scaling the label size with the size of the box might also be a nice feature.
+
+=== 4. Component Declaration syntax
+The use of \`\*\` to declare a component is incongruent with the rest of plantuml, where one explicitly types out the type of component they want, such as:
+----
+state myState
+actor myActor
+class myClass
+----
+I would much prefer to keep plantuml readable and suggest changing the syntax to either use "component/device/etc" over the \`\*\`.
+
+or, you could just assume (like other diagrams) the type by way of the `+startwire+`; thus you know that any object typed in should be a box of type "device/component/\*".
+
+This would also allow for defining specifics about a "device" by use of brackets (just like the rest of plantuml).
+----
+device DDR3 {
+label is center
+
+connector 1 left
+connector 2 right
+connector 3 left
+connector VDD right
+connector gpio1 left
+connector GND right
+}
+----
+
+If you could declare a device as above, then that could set you up for replication; because we often have a lot of the same components on the same bus (e.g. 6 temperature sensors on the same spi bus).
+
+----
+device tmp125 {
+label: TMP125 \n 30Mhz
+connector somi is right
+connector simo is left
+connector vdd is top
+connector gnd is bottom
+# lightgrey
+}
+
+
+component tmp125 as tmp1
+component tmp125 as tmp2
+component tmp125 as tmp3
+
+component MicroProc{
+connector somi is right
+connector simo is right
+}
+
+MicroProc.simo -> tmp1.simo
+MicroProc.simo -> tmp2.simo
+MicroProc.simo -> tmp3.simo
+
+tmp1.somi -> MicroProc.somi
+tmp2.somi -> MicroProc.somi
+tmp3.somi -> MicroProc.somi
+----
+
+Here would be the current method of "rendering" the above.
+
+
+@startwire
+* MicroProc
+ * SOMI
+ * SIMO
+ * SCLK
+-------
+* TMP125_1
+ * SOMI
+ * SIMO
+ * SCLK
+* TMP125_2
+ * SOMI
+ * SIMO
+ * SCLK
+* TMP125_3
+ * SOMI
+ * SIMO
+ * SCLK
+
+
+
+
+MicroProc.SIMO -> TMP125_1 : SIMO
+MicroProc.SIMO -> TMP125_2 : SIMO
+MicroProc.SIMO -> TMP125_3 : SIMO
+
+TMP125_1.SOMI -> MicroProc.SOMI : SOMI
+TMP125_2.SOMI -> MicroProc.SOMI : SOMI
+TMP125_3.SOMI -> MicroProc.SOMI : SOMI
+
+
+@endwire
+
+
+
+
+=== 5. Component Sizing
+The sizing of a component should be dynamic. It should start out just big enough for the label+padding; then expand if it needs to fit stuff inside of it. like connection points+padding or other blocks/devices contained within (which should follow the same sizing rules).
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/word.adoc b/plantuml-docs/docs_from_alphadoc/word.adoc
new file mode 100644
index 00000000..8a574f88
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/word.adoc
@@ -0,0 +1,34 @@
+== Word Add-in
+Adriaan van den Brand has made many improvements to the Word Add-in.
+
+He has created a Word Template that allows a very good integration between __Word__ and PlantUML and better performance.
+
+With this Word Add-in, a new bar will be available within Word:
+
+image::word_bar1.png[]
+
+By click on __"Preferences"__, you can now choose to use EPS instead of PNG for diagrams to improve print quality
+(because EPS is a vector image format.)
+
+This template allows using PlantUML directly from __MS Word 2010__ without need to alter document templates
+or edit VBA macro's. __MS Word Versions 2007__ and __2013__ might work, but are not tested.
+
+Everything is documented in the template itself, that you can
+https://github.com/plantuml/word-template[download here].
+
+Many thanks for his works!
+
+The macro searches the `+plantuml.jar+` file in that order:
+
+* In the same directory as your document
+* Then, in the parent directory of this directory
+* Then, in the parent directory of the parent... up to the root folder
+* Then, in the same directory as the `+normal.dot+` file
+* Then, in the parent directory of this directory
+* Then, in the parent directory of the parent... up to the root folder
+
+If the `+plantuml.jar+` file is not found, a box display the list of all searched directories.
+
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/xearth.adoc b/plantuml-docs/docs_from_alphadoc/xearth.adoc
new file mode 100644
index 00000000..4325d905
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/xearth.adoc
@@ -0,0 +1,215 @@
+== Earth Day
+
+To celebrate http://en.wikipedia.org/wiki/Earth_Day[Earth Day], you can use **PlantUML**...
+
+
+
+== XEarth
+
+http://hewgill.com/xearth/original[XEarth] is a unix utility written in http://hewgill.com/xearth/original/HISTORY[1993] by Kirk Lauritz Johnson. http://www.acproductions.de/acearth[It has been ported to Java by Christian Treber]. So it was easy to integrate it into **PlantUML**, even if it won't probably help for documentation.
+
+
+
+@startuml
+xearth
+@enduml
+
+
+
+
+== Add more stars
+
+
+@startuml
+xearth(300,300)
+starsP = true
+starFrequency = 0.025
+bigStars = 20
+@enduml
+
+
+
+
+== Relative view from Sun
+
+
+
+@startuml
+xearth(300,300)
+viewPositionType = Sun-relative
+sunPosRelLat = -10
+sunPosRelLong = 40
+@enduml
+
+
+
+
+
+== Change grid configuration
+
+The default view is from Sun
+
+
+@startuml
+xearth(300,300)
+gridP = true
+gridDivision = 9
+gridPixelDivision = 8
+@enduml
+
+
+
+
+== Fixed position, without shading
+
+
+
+@startuml
+xearth(300,300)
+viewPositionType = Fixed
+viewPosLat = -30
+viewPosLong = -30
+shadeP = false
+gridP = false
+@enduml
+
+
+
+
+== View from Moon and changing luminosity
+
+
+
+@startuml
+xearth(300,300)
+viewPositionType = Moon
+daySideBrightness = 100
+nightSideBrightness = 30
+terminatorDiscontinuity = 50
+@enduml
+
+
+
+
+== View set by orbit and changing luminosity
+
+
+
+@startuml
+xearth(300,300)
+viewPositionType = Orbit
+orbitPeriod = 1
+orbitInclination = 30
+daySideBrightness = 100
+nightSideBrightness = 30
+terminatorDiscontinuity = 50
+@enduml
+
+
+
+
+== Zooming
+
+
+
+@startuml
+xearth(300,300)
+viewMagnification = 1.2
+daySideBrightness = 100
+nightSideBrightness = 50
+terminatorDiscontinuity = 30
+sunPosRelLong = -40
+sunPosRelLat = 20
+@enduml
+
+
+
+
+
+== Adding cities
+
+
+
+@startuml
+xearth
+ 61.17 -150.00 "Anchorage" # Alaska, USA
+ 38.00 23.73 "Athens" # Greece
+ 33.4 44.4 "Baghdad" # Iraq
+ 13.73 100.50 "Bangkok" # Thailand
+ 39.92 116.43 "Beijing" # China
+ 52.53 13.42 "Berlin" # Germany
+ 32.3 -64.7 "Bermuda" # Bermuda
+ 42.33 -71.08 "Boston" # Massachusetts, USA
+-15.8 -47.9 "Brasilia" # Brazil
+ -4.2 15.3 "Brazzaville" # Congo
+-34.67 -58.50 "Buenos Aires" # Argentina
+ 31.05 31.25 "Cairo" # Egypt
+ 22.5 88.3 "Calcutta" # India
+-33.93 18.47 "Cape Town" # South Africa
+ 33.6 -7.6 "Casablanca" # Morocco (Rabat?)
+ 41.83 -87.75 "Chicago" # Illinois, USA
+ 32.78 -96.80 "Dallas" # Texas, USA
+ 28.63 77.20 "New Delhi" # India
+ 39.75 -105.00 "Denver" # Colorado, USA
+ 24.23 55.28 "Dubai" # UAE (Abu Dhabi?)
+-27.1 -109.4 "Easter Island" # Easter Island
+-18.0 178.1 "Fiji" # Fiji
+ 13.5 144.8 "Guam" # Guam
+ 60.13 25.00 "Helsinki" # Finland
+ 22.2 114.1 "Hong Kong" # Hong Kong
+ 21.32 -157.83 "Honolulu" # Hawaii, USA
+ 52.2 104.3 "Irkutsk" # Irkutsk, Russia
+ 41.0 29.0 "Istanbul" # Turkey (Ankara?)
+ -6.13 106.75 "Jakarta" # Indonesia
+ 31.8 35.2 "Jerusalem" # Israel
+ 34.5 69.2 "Kabul" # Afghanistan
+ 27.7 85.3 "Kathmandu" # Nepal
+ 50.4 30.5 "Kiev" # Ukraine
+ 3.13 101.70 "Kuala Lumpur" # Malaysia
+ 6.45 3.47 "Lagos" # Nigeria
+-12.10 -77.05 "Lima" # Peru
+ 51.50 -0.17 "London" # United Kingdom
+ 40.42 -3.72 "Madrid" # Spain
+ 14.6 121.0 "Manila" # The Phillipines
+ 21.5 39.8 "Mecca" # Saudi Arabia
+ 19.4 -99.1 "Mexico City" # Mexico
+ 25.8 -80.2 "Miami" # Florida, USA
+ 6.2 -10.8 "Monrovia" # Liberia
+ 45.5 -73.5 "Montreal" # Quebec, Canada
+ 55.75 37.70 "Moscow" # Russia
+ -1.28 36.83 "Nairobi" # Kenya
+ 59.93 10.75 "Oslo" # Norway
+ 48.87 2.33 "Paris" # France
+-32.0 115.9 "Perth" # Australia
+ 45.5 -122.5 "Portland" # Oregon, USA
+ -0.2 -78.5 "Quito" # Ecuador
+ 64.15 -21.97 "Reykjavik" # Iceland
+-22.88 -43.28 "Rio de Janeiro" # Brazil
+ 41.88 12.50 "Rome" # Italy
+ 11.0 106.7 "Ho Chi Minh City" # Vietnam (Hanoi?)
+ 37.75 -122.45 "San Francisco" # California, USA
+ 9.98 -84.07 "San Jose" # Costa Rica
+ 18.5 -66.1 "San Juan" # Puerto Rico
+-33.5 -70.7 "Santiago" # Chile
+ 1.2 103.9 "Singapore" # Singapore
+ 42.67 23.30 "Sofia" # Bulgaria
+ 59.33 18.08 "Stockholm" # Sweden
+-33.92 151.17 "Sydney" # Australia
+-17.6 -149.5 "Tahiti" # Tahiti
+ 16.8 -3.0 "Timbuktu" # Mali (Bamako?)
+ 35.67 139.75 "Tokyo" # Japan
+ 43.70 -79.42 "Toronto" # Ontario, Canada
+ 32.9 13.2 "Tripoli" # Libya
+ 47.9 106.9 "Ulan Bator" # Mongolia
+ 49.22 -123.10 "Vancouver" # B.C., Canada
+ 48.22 16.37 "Vienna" # Austria
+ 38.9 -77.0 "Washington" # United States
+-41.28 174.78 "Wellington" # New Zealand
+ 62.5 -114.3 "Yellowknife" # N.T., Canada
+ 90.00 0.00 "North Pole" # North Pole
+-90.00 0.00 "South Pole" # South Pole
+@enduml
+
+
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/xmi.adoc b/plantuml-docs/docs_from_alphadoc/xmi.adoc
new file mode 100644
index 00000000..cec3351a
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/xmi.adoc
@@ -0,0 +1,44 @@
+== XML Metadata Interchange (XMI)
+
+> http://www.quotationspage.com/quote/473.html[The nice thing about standards is that there are so many of them to choose from.] __Andrew S. Tanenbaum__
+
+Many users ask for http://en.wikipedia.org/wiki/XML_Metadata_Interchange[XMI]
+support in PlantUML. So the `+-xmi+` flag has been added in the
+command line (and in the ANT task also), for betatesting. This is only
+working with class diagrams.
+
+As explain on the http://modeling-languages.com/[Modeling Portal], XMI http://modeling-languages.com/blog/content/xmi-nightmares-argouml-xmi-format-change[theoretically]
+allows to interchange data between programs.
+
+So let's have a very simple example, with three classes:
+
+@startuml
+class class1 {
+ field
+}
+class1 - class2
+class2 - class3
+@enduml
+
+Imagine that you can have a XMI file that can be imported successfully on
+several UML tools. It would be nice.
+
+Unfortunately, having the very same file is difficult. For
+example,
+* On http://staruml.sourceforge.net/en[StarUML], you have to use http://plantuml.com/testStarUML.xml[testStarUML.xml]
+* On http://argouml.tigris.org[ArgoUML], you have to use http://plantuml.com/testArgoUML.xml[testArgoUML.xml]
+If someone manages to have an identical file that would work on both
+tools, please post it there : **you will have a free licence of PlantUML :-)**
+
+So, they are actually 3 flags:
+* `+-xmi+` : only classes are exported, without any relationship. This is very basic but should work with on many tools
+* `+-xmi:argo+` : to be read by http://argouml.tigris.org[ArgoUML]
+* `+-xmi:star+` : to be read by http://staruml.sourceforge.net/en[StarUML]
+Please note that this is an alpha version, and that many things will probably not work. http://forum.plantuml.net/[You should use the forum to ask for corrections.]
+
+
+Update: now this feature is in production and is invoked as follows:
+* `+-txmi:argo+` : to be read by http://argouml.tigris.org[ArgoUML]
+* `+-txmi+` or `+-txmi:star+` : to be read by http://staruml.sourceforge.net/en[StarUML]
+
+
diff --git a/plantuml-docs/docs_from_alphadoc/yaml.adoc b/plantuml-docs/docs_from_alphadoc/yaml.adoc
new file mode 100644
index 00000000..5a09b40d
--- /dev/null
+++ b/plantuml-docs/docs_from_alphadoc/yaml.adoc
@@ -0,0 +1,193 @@
+== Display YAML Data
+
+https://en.wikipedia.org/wiki/YAML[YAML] format is widely used in software.
+
+You can use PlantUML to visualize your data.
+
+To activate this feature, the diagram must:
+* begin with `+@startyaml+` keyword
+* end with `+@endyaml+` keyword.
+
+
+@startyaml
+fruit: Apple
+size: Large
+color:
+ - Red
+ - Green
+@endyaml
+
+
+
+== Complex example
+
+
+@startyaml
+doe: "a deer, a female deer"
+ray: "a drop of golden sun"
+pi: 3.14159
+xmas: true
+french-hens: 3
+calling-birds:
+ - huey
+ - dewey
+ - louie
+ - fred
+xmas-fifth-day:
+ calling-birds: four
+ french-hens: 3
+ golden-rings: 5
+ partridges:
+ count: 1
+ location: "a pear tree"
+ turtle-doves: two
+@endyaml
+
+
+
+== Specific key (with symbols or unicode)
+
+@startyaml
+@fruit: Apple
+$size: Large
+&color: Red
+โค: Heart
+โฐ: Per mille
+@endyaml
+
+
+__[Ref. https://forum.plantuml.net/13376/[QA-13376]]__
+
+
+== Highlight parts
+
+=== Normal style
+
+@startyaml
+#highlight "french-hens"
+#highlight "xmas-fifth-day" / "partridges"
+
+doe: "a deer, a female deer"
+ray: "a drop of golden sun"
+pi: 3.14159
+xmas: true
+french-hens: 3
+calling-birds:
+ - huey
+ - dewey
+ - louie
+ - fred
+xmas-fifth-day:
+ calling-birds: four
+ french-hens: 3
+ golden-rings: 5
+ partridges:
+ count: 1
+ location: "a pear tree"
+ turtle-doves: two
+@endyaml
+
+
+
+=== Customised style
+
+@startyaml
+
+#highlight "french-hens"
+#highlight "xmas-fifth-day" / "partridges"
+
+doe: "a deer, a female deer"
+ray: "a drop of golden sun"
+pi: 3.14159
+xmas: true
+french-hens: 3
+calling-birds:
+ - huey
+ - dewey
+ - louie
+ - fred
+xmas-fifth-day:
+ calling-birds: four
+ french-hens: 3
+ golden-rings: 5
+ partridges:
+ count: 1
+ location: "a pear tree"
+ turtle-doves: two
+@endyaml
+
+__[Ref. https://forum.plantuml.net/13288/the-ability-to-customise-the-highlight-for-json-yaml?show=13378#c13378[QA-13288]]__
+
+
+== Using (global) style
+
+=== Without style __(by default)__
+
+@startyaml
+ -
+ name: Mark McGwire
+ hr: 65
+ avg: 0.278
+ -
+ name: Sammy Sosa
+ hr: 63
+ avg: 0.288
+@endyaml
+
+
+
+=== With style
+
+You can use link::style-evolution[style] to change rendering of elements.
+
+
+@startyaml
+
+ -
+ name: Mark McGwire
+ hr: 65
+ avg: 0.278
+ -
+ name: Sammy Sosa
+ hr: 63
+ avg: 0.288
+@endyaml
+
+
+__[Ref. https://forum.plantuml.net/13123[QA-13123]]__
+
+
diff --git a/plantuml-docs/fetchDocsFromAlphadoc.mjs b/plantuml-docs/fetchDocsFromAlphadoc.mjs
new file mode 100644
index 00000000..c309ddf7
--- /dev/null
+++ b/plantuml-docs/fetchDocsFromAlphadoc.mjs
@@ -0,0 +1,20 @@
+import fs from 'fs'
+import * as cheerio from 'cheerio'
+
+// Get all the links from table of contents
+const response = await fetch("http://alphadoc.plantuml.com/toc/asciidoc/en")
+const tocHtml = await response.text()
+const $ = cheerio.load(tocHtml)
+const docLinks = []
+$('#cont .conta .ctop').each((i, element) => {
+ docLinks.push($(element).find('a:first').attr('href'))
+})
+
+// Fetch content from each link and store them
+for (let path of docLinks){
+ const rawDocUrl = `http://alphadoc.plantuml.com/raw/${path.replace('/doc/', '/raw/')}`
+ const filename = `${path.split('/').at(-1)}.adoc`
+ const rawDoc = await (await fetch(rawDocUrl)).text()
+ fs.writeFileSync(`./docs_from_alphadoc/${filename}`, rawDoc)
+ console.info(`Saved ${filename}`)
+}
diff --git a/plantuml-docs/modules/ROOT/nav.adoc b/plantuml-docs/modules/ROOT/nav.adoc
new file mode 100644
index 00000000..853bfcf7
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/nav.adoc
@@ -0,0 +1,149 @@
+* xref:index.adoc[PlantUML in a nutshell]
+* xref:starting.adoc[Quick Start]
+
+.UML Diagrams
+ * xref:sequence-diagram.adoc[Sequence diagram]
+ * xref:use-case-diagram.adoc[Usecase diagram]
+ * xref:class-diagram.adoc[Class diagram]
+ * xref:object-diagram.adoc[Object diagram]
+ * xref:activity-diagram-beta.adoc[Activity diagram]
+ * xref:activity-diagram-legacy.adoc[Activity diagram (legacy)]
+ * xref:component-diagram.adoc[Component diagram]
+ * xref:deployment-diagram.adoc[Deployment diagram]
+ * xref:state-diagram.adoc[State diagram]
+ * xref:timing-diagram.adoc[Timing diagram]
+
+.non-UML Diagrams
+ * xref:json.adoc[JSON data]
+ * xref:yaml.adoc[YAML data]
+ * xref:ebnf.adoc[Extended Backus-Naur Form (EBNF) diagram]
+ * xref:nwdiag.adoc[Network diagram (nwdiag)]
+ * xref:salt.adoc[Wireframe graphical interface or UI mockups (salt)]
+ * xref:archimate-diagram.adoc[Archimate diagram]
+ * xref:activity-diagram-beta#sdl.adoc[Specification and Description Language (SDL)]
+ * xref:ditaa.adoc[Ditaa diagram]
+ * xref:gantt-diagram.adoc[Gantt diagram]
+ * xref:mindmap-diagram.adoc[MindMap diagram]
+ * xref:wbs-diagram.adoc[Work Breakdown Structure diagram (WBS)]
+ * xref:ascii-math.adoc[Mathematic with AsciiMath or JLaTeXMath notation]
+ * xref:ie-diagram.adoc[Entity Relationship diagram (IE/ER)]
+
+.Additional Diagram Elements
+ * xref:link.adoc[Hyperlinks and tooltips]
+ * xref:creole.adoc[Creole]: rich text, emoticons, unicode, icons
+ * xref:openiconic.adoc[OpenIconic icons]
+ * xref:sprite.adoc[Sprite icons]
+ * xref:ascii-math.adoc[AsciiMath mathematical expressions]
+
+.Extra
+* xref:stdlib.adoc[stdlib]
+* xref:theme.adoc[Themes]
+* xref:preprocessing.adoc[Preprocessing]
+
+.Formats
+ * PNG
+ * xref:svg.adoc[SVG]
+ * xref:latex.adoc[LaTeX]
+ * xref:ascii-art.adoc[ASCII art]
+
+.Other pages
+ * xref:a_begin_for_this_wiki.adoc[A begin for this wiki…]
+ * xref:activity-diagram-issues.adoc[Activity Diagram issues (activity-diagram-issues)]
+ * xref:ant-task.adoc[Writing an Ant Task]
+ * xref:api.adoc[Calling PlantUML from Java]
+ * xref:board-diagram.adoc[Board diagram]
+ * xref:bpmn.adoc[Business Process Model and Notation (BPMN)]
+ * xref:class-diagram-issues.adoc[Class Diagram issues (class-diagram-issues)]
+ * xref:code-groovy.adoc[Groovy API Client Code]
+ * xref:code-javascript-asynchronous.adoc[Javascript API Client Code]
+ * xref:code-javascript-synchronous.adoc[Javascript API Client Code]
+ * xref:code-php.adoc[PHP API Client Code]
+ * xref:color.adoc[Colors]
+ * xref:command-line.adoc[Command line]
+ * xref:commons.adoc[Common commands]
+ * xref:dark-mode.adoc[Using dark mode]
+ * xref:dedication.adoc[Dedication]
+ * xref:deployment-diagram-issues.adoc[Deployment (Component, Use-case, and Deployment) Diagram issues (deployment-diagram-issues)]
+ * xref:developers.adoc[Language]
+ * xref:doclet.adoc[New Doclet]
+ * xref:docutils.adoc[Docutils (Install)]
+ * xref:donors.adoc[Special thanks to our sponsors and donors]
+ * xref:dot.adoc[Generalisation]
+ * xref:doxygen.adoc[Doxygen]
+ * xref:ebnf-discussion.adoc[Discussion about EBNF]
+ * xref:eclipse.adoc[Information about the PlantUML Eclipse Plugin]
+ * xref:elk.adoc[Eclipse Layout Kernel]
+ * xref:emacs.adoc[Emacs]
+ * xref:eps.adoc[EPS]
+ * xref:external-xrefs.adoc[External xrefs]
+ * xref:faq-install.adoc[Local Installation notes]
+ * xref:font.adoc[Font]
+ * xref:formatting.adoc[Wiki Basic formatting]
+ * xref:ftp.adoc[File Transfer Protocol]
+ * xref:gfm-support.adoc[GFM Support]
+ * xref:graphviz-dot.adoc[GraphViz]
+ * xref:gui.adoc[PlantUML GUI]
+ * xref:handwritten.adoc[Handwritten diagram style]
+ * xref:hcl.adoc[Display HCL Data]
+ * xref:index-full.adoc[PlantUML in a nutshell]
+ * xref:issues.adoc[If you see something, say something]
+ * xref:javadoc.adoc[New Doclet]
+ * xref:jcckit.adoc[JCCKit]
+ * xref:jquery.adoc[JQuery integration]
+ * xref:json-issues.adoc[JSON Diagram issues (json-issues)]
+ * xref:xref.adoc[Format definition]
+ * xref:menu.adoc[Translation of the menus]
+ * xref:notes.adoc[Notes]
+ * xref:nwdiag-issues.adoc[Network diagram issues (nwdiag-issues)]
+ * xref:oregon-trail.adoc[The Oregon Trail]
+ * xref:patreon-support.adoc[Why crowdfunding?]
+ * xref:pdf.adoc[PDF Support]
+ * xref:picoweb.adoc[PlantUML PicoWeb Server]
+ * xref:plantuml-text-encoding.adoc[PlantUML Text Encoding]
+ * xref:plantumlshell.adoc[Beta implementation]
+ * xref:pmwiki.adoc[PmWiki integration]
+ * xref:poll-about-package-and-namespace.adoc[Issue about Namespace and Package]
+ * xref:poll-about-wiki-syntax.adoc[Vote for your syntax!]
+ * xref:preprocessing-gallery.adoc[Preprocessing Gallery (preprocessing-gallery)]
+ * xref:preprocessing-json.adoc[Preprocessing JSON]
+ * xref:preprocessing-v2.adoc[Preprocessing-v2 (old)]
+ * xref:problem-diagram.adoc[Problem diagram]
+ * xref:professional.adoc[Professional usage]
+ * xref:pte.adoc[PlantUML Text Encoding]
+ * xref:regex.adoc[Display Regex Data]
+ * xref:security.adoc[Deploy PlantUML safely]
+ * xref:server.adoc[PlantUML Server]
+ * xref:skinparam.adoc[Skinparam command]
+ * xref:smetana02.adoc[Context of the Smetana project]
+ * xref:sources.adoc[How and where diagrams can be written]
+ * xref:start.adoc[Start]
+ * xref:starting.adoc[PlantUML for the impatient]
+ * xref:state-diagram-issues.adoc[State Diagram issues (state-diagram-issues)]
+ * xref:statistics-report.adoc[Enable statistics]
+ * xref:steve.adoc[Steve Jobs, 1955 - 2011]
+ * xref:style-evolution-history.adoc[Elements that can be styled]
+ * xref:style-evolution.adoc[Style (or CSS like style)]
+ * xref:sub-diagram.adoc[Sub-diagram]
+ * xref:sudoku.adoc[Have a break: resolve a Sudoku…]
+ * xref:svek.adoc[Current architecture: Svek]
+ * xref:syntax-asciidoc.adoc[Basic Formatting]
+ * xref:syntax-dokuwiki.adoc[Syntax Dokuwiki]
+ * xref:syntax-markdown.adoc[Basic Formatting]
+ * xref:teoz.adoc[Current "Puma" architecture]
+ * xref:text-encoding.adoc[PlantUML Text Encoding]
+ * xref:theme-gallery.adoc[Theme Gallery]
+ * xref:timing-diagram-issues.adoc[Timing Diagram Issues (timing-diagram-issues)]
+ * xref:undocumented.adoc[Undocumented PlantUML features]
+ * xref:unicode.adoc[Unicode]
+ * xref:url-authentication.adoc[URL authentication]
+ * xref:url-basicauth.adoc[BasicAuth configuration]
+ * xref:url-oauth.adoc[OAuth2 configuration]
+ * xref:url-tokenauth.adoc[Token Auth configuration]
+ * xref:using-a-citation-manager.adoc[Initial request]
+ * xref:versioning-scheme.adoc[Context (of versioning)]
+ * xref:vizjs.adoc[The context of VizJs]
+ * xref:what-is-a-software-modeling-tool.adoc[Modeling Tool]
+ * xref:wire-diagram.adoc[Wire or Block Diagram]
+ * xref:word.adoc[Word Add-in]
+ * xref:xearth.adoc[Earth Day]
+ * xref:xmi.adoc[XML Metadata Interchange (XMI)]
diff --git a/plantuml-docs/modules/ROOT/pages/a_begin_for_this_wiki.adoc b/plantuml-docs/modules/ROOT/pages/a_begin_for_this_wiki.adoc
new file mode 100644
index 00000000..055b4a53
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/pages/a_begin_for_this_wiki.adoc
@@ -0,0 +1,364 @@
+== A begin for this wiki...
+
+__(in order to be on the top of the TOC... ;-)__
+
+
+== For starting
+
+You can read : link::start[the start page].
+
+
+== Issues: __"If you see something, say something"__
+
+For that, you can go the link::issues[issues page].
+
+
+== Improve Documentation
+
+Contribute by:
+* by improving the English PlantUML documentation
+* by translating the English pages
+* by adding new topics...
+* helping with the huge categorized list of https://github.com/plantuml/plantuml/issues/261[Undocumented plantuml features] (100-200 tasks gathered from the forum) that needs your help!
+* here is the page, on **this wiki**, for follow link::undocumented[Undocumented PlantUML features in order to document]
+
+Here's how to start:
+* go to the http://alphadoc.plantuml.com/toc/[TOC] or mini-TOC (below)
+* select your preferred wiki syntax
+* select your language __(if you want to translate)__
+* and select a topic.
+
+
+== Wiki Mini TOC
+
+This section lists all pages in a categorized listing, whereas http://alphadoc.plantuml.com/toc/markdown/en[Wiki TOC] also lists all subsections.
+
+=== This Documentation Wiki
+* link::start[Start]
+* link::a_begin_for_this_wiki[A Begin for This Wiki]
+* link::menu[Menu translation]
+* link::formatting[formatting]
+* link::syntax-asciidoc[syntax-asciidoc]
+* link::syntax-dokuwiki[syntax-dokuwiki]
+* link::syntax-markdown[syntax-markdown]
+* link::poll-about-wiki-syntax[poll-about-wiki-syntax]
+
+=== Intro
+* link::index[Index]
+* link::starting[Quick Start]
+* link::faq[FAQ]
+* http://plantuml.com/guide[PlantUML Language Reference Guide]
+* https://plantuml.com/running[Running with Other Tools]
+* link::what-is-a-software-modeling-tool[What is a Software Modeling Tool]
+
+=== Diagrams
+
+The default header/footer (or StartTag/EndTag) are `+@startuml+`/`+@enduml+`.
+
+|===
+| Diagram | Diagram Issues | Header | Keyword | Sub-diagram Keyword
+
+| link::activity-diagram-beta[Activity]
+| link::activity-diagram-issues[Activity Issues]
+|
+|
+|
+
+| link::activity-diagram-beta#vmm58ifz7wd3k362kj5w[Activity - Specification and Description Language (SDL)]
+|
+|
+|
+|
+
+| link::activity-diagram-legacy[Activity-legacy] [[#FF6600#deprecated]]
+|
+|
+|
+|
+
+| link::archimate-diagram[Archimate]
+|
+|
+|
+|
+
+| link::bpmn[Business Process Modeling Notation (BPMN)]
+|
+| @startbpm
+|
+|
+
+| link::board-diagram[Board or User Story Maps+++ +++(๐ง __under construction__)]
+|
+| @startboard
+|
+| {{board
+
+| link::class-diagram[Class]
+| link::class-diagram-issues[Class Issues]
+|
+|
+|
+
+| link::component-diagram[Component]
+| link::deployment-diagram-issues[Deployment Issue]
+|
+|
+|
+
+| link::deployment-diagram[Deployment]
+| link::deployment-diagram-issues[Deployment Issue]
+|
+|
+|
+
+| link::ebnf[EBNF+++ +++(๐ functionality)]
+| link::ebnf-issues[EBNF Issues]
+| @startebnf
+|
+| {{ebnf
+
+| link::gantt-diagram[Gantt project planning]
+|
+| @startgantt
+|
+| {{gantt
+
+| link::ie-diagram[Information Engineering (IE) / Entity Relationship (ER)]
+|
+|
+|
+|
+
+| link::json[JSON]
+| link::json-issues[JSON Issues]
+| @startjson
+|
+| {{json
+
+| link::mindmap-diagram[MindMap]
+|
+| @startmindmap
+|
+| {{mindmap
+
+| link::nwdiag[Network (nwdiag)]
+| link::nwdiag-issues[Network Issue]
+| @startnwdiag
+| nwdiag {+++ +++}
+|
+
+| link::object-diagram[Object]
+|
+|
+|
+|
+
+| link::problem-diagram[Problem diagram]
+|
+|
+|
+|
+
+| link::sequence-diagram[Sequence]
+|
+|
+|
+|
+
+| link::state-diagram[State]
+| link::state-diagram-issues[State Issue]
+|
+|
+|
+
+| link::timing-diagram[Timing]
+| link::timing-diagram-issues[Timing Issue]
+|
+|
+|
+
+| link::use-case-diagram[Use-Case]
+| link::deployment-diagram-issues[Deployment Issue]
+|
+|
+|
+
+| link::wbs-diagram[Work Breakdown Structure (WBS)]
+|
+| @startwbs
+|
+| {{wbs
+
+| link::salt[Wireframe (SALT)]
+|
+| @startsalt
+| salt+++ +++{+++ +++}
+|
+
+| link::wire-diagram[Wire or Block Diagram+++ +++(๐ __beta version to test__)]
+|
+| @startwire
+|
+| {{wire [[#00CC00#Version 1.2021.01]]
+
+| link::yaml[YAML]
+|
+| @startyaml
+|
+| {{yaml [[#00CC00#Version 1.2021.01]]
+
+|===
+
+=== Other Diagrams/Games
+
+|===
+| Diagram | Header | Keyword | Sub-diagram Keyword | Command
+
+| link::creole[Creole]
+| @startcreole
+|
+|
+|
+
+| link::ditaa[ditaa]
+| @startditaa
+| ditaa
+|
+| (--no-separation, --no-shadows, scale=)
+
+| link::dot[Dot]
+| @startdot
+| digraph {+++ +++}
+|
+|
+
+| link::ascii-math[Math]
+| @startmath
+| `++`
+|
+|
+
+| link::ascii-math[LaTeX]
+| @startlatex
+| `+...+`
+|
+|
+
+| link::oregon-trail[Oregon Trail]
+|
+|
+|
+| run oregon trail
+
+| link::sudoku[Sudoku]
+|
+|
+|
+| sudoku
+
+| link::xearth[XEarth]
+|
+|
+|
+| xearth
+
+|===
+
+=== Common/Markup/Layout
+* link::commons[commons]
+* link::ascii-math[๐งฎ AsciiMath]
+* link::color[๐ color]
+* link::creole[creole]
+* link::font[๐ค font]
+* link::gfm-support[GFM-support]
+* link::handwritten[โ handwritten]
+* link::notes[๐จ notes]
+* link::link[๐ link]
+* link::openiconic[openiconic]
+* link::skinparam[skinparam]
+* link::sprite[sprite]
+* link::style-evolution-history[style-evolution-history]
+* link::style-evolution[๐จ๐๏ธstyle-evolution (Style or CSS like style)]
+* link::using-a-citation-manager[using-a-citation-manager]
+* link::poll-about-package-and-namespace[poll-about-package-and-namespace]
+
+=== Preprocessing/Libraries
+* link::stdlib[๐ stdlib]
+* link::theme[๐ผ๏ธ theme]
+* link::theme-gallery[๐ผ๏ธ๐ theme Gallery]
+* link::preprocessing[โ preprocessing __(new)__]
+* link::preprocessing-json[preprocessing-json]
+* link::preprocessing-gallery[โ๐ Preprocessing Gallery]
+* link::preprocessing-v2[preprocessing-v2 __(old)__] [[#FF6600#deprecated]]
+* link::plantumlshell[plantumlshell __(very old)__] [[#FF6600#deprecated]]
+
+=== URL Authentication
+* link::url-authentication[URL-Authentication]
+** link::url-basicauth[URL-BasicAuth]
+** link::url-oauth[URL-OAauth]
+** link::url-tokenauth[URL-TokenAuth]
+
+=== Alternative Layouters
+* link::smetana02[Smetana]
+* link::elk[ELK]
+* link::svek[Svek]
+* link::teoz[Teoz]
+* link::vizjs[VizJs]
+
+=== Executing
+* link::command-line[Command-line]
+* link::faq-install[FAQ-install]
+* link::ftp[FTP]
+* link::gui[GUI]
+* link::graphviz-dot[Graphviz-dot]
+* link::server[Server]
+* link::sources[Sources]
+* link::security[Security]
+* link::starting[Starting]
+* link::statistics-report[Statistics-report]
+* link::text-encoding[Text-encoding]
+* link::unicode[Unicode]
+* link::versioning-scheme[Versioning-scheme]
+
+=== Alternative Output
+* link::ascii-art[ASCII-art]
+* link::eps[EPS]
+* link::latex[LaTeX]
+* link::pdf[PDF]
+* link::svg[SVG]
+
+=== Integrations
+
+__(see https://plantuml.com/running[running] for a lot more links, unfortunately that page is not on alphadocs)__
+
+* link::ant-task[Ant-task]
+* link::doclet[Doclet]
+* link::docutils[Docutils]
+* link::doxygen[Doxygen]
+* link::eclipse[Eclipse]
+* link::emacs[Emacs]
+* link::javadoc[Javadoc]
+* link::jquery[JQuery]
+* link::pmwiki[PmWiki]
+* link::word[Word]
+* link::xmi[XMI]
+
+=== Programming
+* link::developers[Developers]
+* link::api[API]
+* link::code-groovy[code-groovy]
+* link::code-javascript-asynchronous[code-javascript-asynchronous]
+* link::code-javascript-synchronous[code-javascript-synchronous]
+* link::code-php[code-php]
+
+=== Support and Appreciation
+* link::patreon-support[Patreon-support]
+* link::donors[Donors]
+* link::external-links[External-links]: Projects using PlantUML, Learn & Teach with PlantUML, etc.
+* link::professional[Professional]
+* link::issues[Wiki Issues]
+* link::dedication[Dedication]
+* link::steve[Steve Jobs]
+
+
diff --git a/plantuml-docs/modules/ROOT/pages/activity-diagram-beta.adoc b/plantuml-docs/modules/ROOT/pages/activity-diagram-beta.adoc
new file mode 100644
index 00000000..27337810
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/pages/activity-diagram-beta.adoc
@@ -0,0 +1,1353 @@
+== Activity Diagram (new)
+
+Old link::activity-diagram-legacy[syntax for activity diagram] had several limitations and
+drawbacks (for example, it's difficult to maintain).
+
+So a completely new syntax and implementation is now available to users. Another advantage of this implementation is that it's done without the need of having
+Graphviz installed (as for sequence diagrams).
+
+This syntax will replace the old legacy one. However, for compatibility reason, the old syntax will still be recognized, to ensure __ascending compatibility__.
+
+Users are simply encouraged to migrate to the new syntax.
+
+
+== Simple action
+Activities label starts with `+:+` and ends with `+;+`.
+
+Text formatting can be done using link::creole[creole wiki syntax].
+
+They are implicitly linked in their definition order.
+[plantuml]
+----
+@startuml
+:Hello world;
+:This is defined on
+several **lines**;
+@enduml
+----
+
+
+== Start/Stop/End
+
+You can use `+start+` and `+stop+` keywords to denote the
+beginning and the end of a diagram.
+
+[plantuml]
+----
+@startuml
+start
+:Hello world;
+:This is defined on
+several **lines**;
+stop
+@enduml
+----
+
+You can also use the `+end+` keyword.
+[plantuml]
+----
+@startuml
+start
+:Hello world;
+:This is defined on
+several **lines**;
+end
+@enduml
+----
+
+
+== Conditional
+
+You can use `+if+`, `+then+` and `+else+` keywords to put tests in your diagram.
+Labels can be provided using parentheses.
+
+The 3 syntaxes are possible:
+* `+if (...) then (...)+`
+[plantuml]
+----
+@startuml
+
+start
+
+if (Graphviz installed?) then (yes)
+ :process all\ndiagrams;
+else (no)
+ :process only
+ __sequence__ and __activity__ diagrams;
+endif
+
+stop
+
+@enduml
+----
+
+* `+if (...) is (...) then+`
+[plantuml]
+----
+@startuml
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+@enduml
+----
+
+* `+if (...) equals (...) then+`
+[plantuml]
+----
+@startuml
+if (counter?) equals (5) then
+:print 5;
+else
+:print not 5;
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/301/activity-diagram-beta?show=302#a302[QA-301]]__
+
+=== Several tests (horizontal mode)
+
+You can use the `+elseif+` keyword to have several tests __(by default, it is the horizontal mode)__:
+
+[plantuml]
+----
+@startuml
+start
+if (condition A) then (yes)
+ :Text 1;
+elseif (condition B) then (yes)
+ :Text 2;
+ stop
+(no) elseif (condition C) then (yes)
+ :Text 3;
+(no) elseif (condition D) then (yes)
+ :Text 4;
+else (nothing)
+ :Text else;
+endif
+stop
+@enduml
+----
+
+=== Several tests (vertical mode)
+
+You can use the command `+!pragma useVerticalIf on+` to have the tests in vertical mode:
+
+[plantuml]
+----
+@startuml
+!pragma useVerticalIf on
+start
+if (condition A) then (yes)
+ :Text 1;
+elseif (condition B) then (yes)
+ :Text 2;
+ stop
+elseif (condition C) then (yes)
+ :Text 3;
+elseif (condition D) then (yes)
+ :Text 4;
+else (nothing)
+ :Text else;
+endif
+stop
+@enduml
+----
+
+You can use the `+-P+` link::command-line[command-line] option to specify the pragma:
+
+----
+java -jar plantuml.jar -PuseVerticalIf=on
+----
+
+__[Refs. https://forum.plantuml.net/3931/please-provide-elseif-structure-vertically-activity-diagrams[QA-3931], https://github.com/plantuml/plantuml/issues/582[issue-582]]__
+
+
+== Switch and case [switch, case, endswitch]
+
+You can use `+switch+`, `+case+` and `+endswitch+` keywords to put switch in your diagram.
+
+Labels can be provided using parentheses.
+
+
+[plantuml]
+----
+@startuml
+start
+switch (test?)
+case ( condition A )
+ :Text 1;
+case ( condition B )
+ :Text 2;
+case ( condition C )
+ :Text 3;
+case ( condition D )
+ :Text 4;
+case ( condition E )
+ :Text 5;
+endswitch
+stop
+@enduml
+----
+
+
+== Conditional with stop on an action [kill, detach]
+
+You can stop action on a if loop.
+[plantuml]
+----
+@startuml
+if (condition?) then
+ :error;
+ stop
+endif
+#palegreen:action;
+@enduml
+----
+
+But if you want to stop at the precise action, you can use the `+kill+` or `+detach+` keyword:
+
+* `+kill+`
+[plantuml]
+----
+@startuml
+if (condition?) then
+ #pink:error;
+ kill
+endif
+#palegreen:action;
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/265/new-activity-diagram-syntax-direction-of-links?show=306#a306[QA-265]]__
+
+* `+detach+`
+[plantuml]
+----
+@startuml
+if (condition?) then
+ #pink:error;
+ detach
+endif
+#palegreen:action;
+@enduml
+----
+
+
+== Repeat loop
+
+You can use `+repeat+` and `+repeatwhile+` keywords to have repeat loops.
+
+[plantuml]
+----
+@startuml
+
+start
+
+repeat
+ :read data;
+ :generate diagrams;
+repeat while (more data?) is (yes)
+->no;
+stop
+
+@enduml
+----
+
+It is also possible to use a full action as `+repeat+` target and insert an action in the return path using the `+backward+` keyword.
+
+[plantuml]
+----
+@startuml
+
+start
+
+repeat :foo as starting label;
+ :read data;
+ :generate diagrams;
+backward:This is backward;
+repeat while (more data?)
+
+stop
+
+@enduml
+----
+
+
+== Break on a repeat loop [break]
+
+You can use the `+break+` keyword after an action on a loop.
+[plantuml]
+----
+@startuml
+start
+repeat
+ :Test something;
+ if (Something went wrong?) then (no)
+ #palegreen:OK;
+ break
+ endif
+ ->NOK;
+ :Alert "Error with long text";
+repeat while (Something went wrong with long text?) is (yes) not (no)
+->//merged step//;
+:Alert "Success";
+stop
+@enduml
+----
+
+
+__[Ref. https://forum.plantuml.net/6105/possible-to-draw-a-line-to-another-box-via-id-or-label?show=6107#a6107[QA-6105]]__
+
+
+== Goto and Label Processing [label, goto]
+
+โ It is currently only experimental ๐ง
+
+You can use `+label+` and `+goto+` keywords to denote goto processing, with:
+* `+label +`
+* `+goto +`
+
+[plantuml]
+----
+@startuml
+title Point two queries to same activity\nwith `goto`
+start
+if (Test Question?) then (yes)
+'space label only for alignment
+label sp_lab0
+label sp_lab1
+'real label
+label lab
+:shared;
+else (no)
+if (Second Test Question?) then (yes)
+label sp_lab2
+goto sp_lab1
+else
+:nonShared;
+endif
+endif
+:merge;
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/15026/[QA-15026], https://forum.plantuml.net/12526/[QA-12526] and initially https://forum.plantuml.net/1626[QA-1626]]__
+
+
+== While loop
+
+You can use `+while+` and `+endwhile+` keywords to have repeat loops.
+
+[plantuml]
+----
+@startuml
+
+start
+
+while (data available?)
+ :read data;
+ :generate diagrams;
+endwhile
+
+stop
+
+@enduml
+----
+
+It is possible to provide a label after the `+endwhile+` keyword, or using the `+is+` keyword.
+
+[plantuml]
+----
+@startuml
+while (check filesize ?) is (not empty)
+ :read file;
+endwhile (empty)
+:close file;
+@enduml
+----
+
+If you are using `+detach+` to form an infinite while loop, then you will want to also hide the partial arrow that results using `+-[hidden]->+`
+
+[plantuml]
+----
+@startuml
+:Step 1;
+if (condition1) then
+ while (loop forever)
+ :Step 2;
+ endwhile
+ -[hidden]->
+ detach
+else
+ :end normally;
+ stop
+endif
+@enduml
+----
+
+
+== Parallel processing [fork, fork again, end fork, end merge]
+
+You can use `+fork+`, `+fork again+` and `+end fork+` or `+end merge+` keywords to denote parallel processing.
+
+=== Simple `+fork+`
+[plantuml]
+----
+@startuml
+start
+fork
+ :action 1;
+fork again
+ :action 2;
+end fork
+stop
+@enduml
+----
+
+=== `+fork+` with end merge
+[plantuml]
+----
+@startuml
+start
+fork
+ :action 1;
+fork again
+ :action 2;
+end merge
+stop
+@enduml
+----
+__[Ref. https://forum.plantuml.net/5320/please-provide-fork-without-join-with-merge-activity-diagrams?show=5321#a5321[QA-5320]]__
+
+[plantuml]
+----
+@startuml
+start
+fork
+ :action 1;
+fork again
+ :action 2;
+fork again
+ :action 3;
+fork again
+ :action 4;
+end merge
+stop
+@enduml
+----
+
+[plantuml]
+----
+@startuml
+start
+fork
+ :action 1;
+fork again
+ :action 2;
+ end
+end merge
+stop
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/13731[QA-13731]]__
+
+=== Label on `+end fork+` (or UML joinspec):
+[plantuml]
+----
+@startuml
+start
+fork
+ :action A;
+fork again
+ :action B;
+end fork {or}
+stop
+@enduml
+----
+[plantuml]
+----
+@startuml
+start
+fork
+ :action A;
+fork again
+ :action B;
+end fork {and}
+stop
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/5346/please-inplement-joinspec-for-join-nodes?show=5348#a5348[QA-5346]]__
+
+=== Other example
+[plantuml]
+----
+@startuml
+
+start
+
+if (multiprocessor?) then (yes)
+ fork
+ :Treatment 1;
+ fork again
+ :Treatment 2;
+ end fork
+else (monoproc)
+ :Treatment 1;
+ :Treatment 2;
+endif
+
+@enduml
+----
+
+
+== Split processing
+
+=== Split
+You can use `+split+`, `+split again+` and `+end split+` keywords to denote split processing.
+
+[plantuml]
+----
+@startuml
+start
+split
+ :A;
+split again
+ :B;
+split again
+ :C;
+split again
+ :a;
+ :b;
+end split
+:D;
+end
+@enduml
+----
+
+=== Input split (multi-start)
+You can use `+hidden+` arrows to make an input split (multi-start):
+[plantuml]
+----
+@startuml
+split
+ -[hidden]->
+ :A;
+split again
+ -[hidden]->
+ :B;
+split again
+ -[hidden]->
+ :C;
+end split
+:D;
+@enduml
+----
+
+[plantuml]
+----
+@startuml
+split
+ -[hidden]->
+ :A;
+split again
+ -[hidden]->
+ :a;
+ :b;
+split again
+ -[hidden]->
+ (Z)
+end split
+:D;
+@enduml
+----
+__[Ref. https://forum.plantuml.net/8662[QA-8662]]__
+
+=== Output split (multi-end)
+
+You can use `+kill+` or `+detach+` to make an output split (multi-end):
+
+[plantuml]
+----
+@startuml
+start
+split
+ :A;
+ kill
+split again
+ :B;
+ detach
+split again
+ :C;
+ kill
+end split
+@enduml
+----
+[plantuml]
+----
+@startuml
+start
+split
+ :A;
+ kill
+split again
+ :b;
+ :c;
+ detach
+split again
+ (Z)
+ detach
+split again
+ end
+split again
+ stop
+end split
+@enduml
+----
+
+
+== Notes
+
+Text formatting can be done using link::creole[creole wiki syntax].
+
+A note can be floating, using `+floating+` keyword.
+[plantuml]
+----
+@startuml
+
+start
+:foo1;
+floating note left: This is a note
+:foo2;
+note right
+ This note is on several
+ //lines// and can
+ contain HTML
+ ====
+ * Calling the method ""foo()"" is prohibited
+end note
+stop
+
+@enduml
+----
+
+You can add note on backward activity:
+
+[plantuml]
+----
+@startuml
+start
+repeat :Enter data;
+:Submit;
+backward :Warning;
+note right: Note
+repeat while (Valid?) is (No) not (Yes)
+stop
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/11788/is-it-possible-to-add-a-note-to-backward-activity?show=11802#a11802[QA-11788]]__
+
+
+You can add note on partition activity:
+[plantuml]
+----
+@startuml
+start
+partition "**process** HelloWorld" {
+ note
+ This is my note
+ ----
+ //Creole test//
+ end note
+ :Ready;
+ :HelloWorld(i)>
+ :Hello-Sent;
+}
+@enduml
+----
+__[Ref. https://forum.plantuml.net/2398/is-it-possible-to-add-a-comment-on-top-of-a-activity-partition?show=2403#a2403[QA-2398]]__
+
+
+== Colors
+
+You can specify a link::color[color] for some activities.
+
+[plantuml]
+----
+@startuml
+
+start
+:starting progress;
+#HotPink:reading configuration files
+These files should be edited at this point!;
+#AAAAAA:ending of the process;
+
+@enduml
+----
+
+You can also use link::color[gradient color].
+[plantuml]
+----
+@startuml
+start
+partition #red/white testPartition {
+ #blue\green:testActivity;
+}
+@enduml
+----
+__[Ref. https://forum.plantuml.net/4906/setting-ad-hoc-gradient-backgrounds-in-activity?show=4917#a4917[QA-4906]]__
+
+
+== Lines without arrows
+
+You can use `+skinparam ArrowHeadColor none+` in order to connect activities using lines only, without arrows.
+
+[plantuml]
+----
+@startuml
+skinparam ArrowHeadColor none
+start
+:Hello world;
+:This is on defined on
+several **lines**;
+stop
+@enduml
+----
+
+
+[plantuml]
+----
+@startuml
+skinparam ArrowHeadColor none
+start
+repeat :Enter data;
+:Submit;
+backward :Warning;
+repeat while (Valid?) is (No) not (Yes)
+stop
+@enduml
+----
+
+
+== Arrows
+
+Using the `+->+` notation, you can add texts to arrow, and change
+their link::color[color].
+
+It's also possible to have dotted, dashed, bold or hidden arrows.
+
+[plantuml]
+----
+@startuml
+:foo1;
+-> You can put text on arrows;
+if (test) then
+ -[#blue]->
+ :foo2;
+ -[#green,dashed]-> The text can
+ also be on several lines
+ and **very** long...;
+ :foo3;
+else
+ -[#black,dotted]->
+ :foo4;
+endif
+-[#gray,bold]->
+:foo5;
+@enduml
+----
+
+
+
+== Connector
+
+You can use parentheses to denote connector.
+
+[plantuml]
+----
+@startuml
+start
+:Some activity;
+(A)
+detach
+(A)
+:Other activity;
+@enduml
+----
+
+
+
+== Color on connector
+
+You can add link::color[color] on connector.
+
+[plantuml]
+----
+@startuml
+start
+:The connector below
+wishes he was blue;
+#blue:(B)
+:This next connector
+feels that she would
+be better off green;
+#green:(G)
+stop
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/10077/assigning-color-to-connectors?show=10080#c10080[QA-10077]]__
+
+
+== Grouping or partition
+
+=== Group
+You can group activity together by defining group:
+[plantuml]
+----
+@startuml
+start
+group Initialization
+ :read config file;
+ :init internal variable;
+end group
+group Running group
+ :wait for user interaction;
+ :print information;
+end group
+
+stop
+@enduml
+----
+
+=== Partition
+You can group activity together by defining partition:
+
+[plantuml]
+----
+@startuml
+start
+partition Initialization {
+ :read config file;
+ :init internal variable;
+}
+partition Running {
+ :wait for user interaction;
+ :print information;
+}
+
+stop
+@enduml
+----
+
+
+It's also possible to change partition link::color[color]:
+
+[plantuml]
+----
+@startuml
+start
+partition #lightGreen "Input Interface" {
+ :read config file;
+ :init internal variable;
+}
+partition Running {
+ :wait for user interaction;
+ :print information;
+}
+stop
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/2793/activity-beta-partition-name-more-than-one-word-does-not-work?show=2798#a2798[QA-2793]]__
+
+It's also possible to add link::link[link] to partition:
+[plantuml]
+----
+@startuml
+start
+partition "[[http://plantuml.com partition_name]]" {
+ :read doc. on [[http://plantuml.com plantuml_website]];
+ :test diagram;
+}
+end
+@enduml
+----
+__[Ref. https://forum.plantuml.net/542/ability-to-define-hyperlink-on-diagram-elements?show=14003#c14003[QA-542]]__
+
+=== Group, Partition, Package, Rectangle or Card
+You can group activity together by defining:
+* group;
+* partition;
+* package;
+* rectangle;
+* card.
+[plantuml]
+----
+@startuml
+start
+group Group
+ :Activity;
+end group
+floating note: Note on Group
+
+partition Partition {
+ :Activity;
+}
+floating note: Note on Partition
+
+package Package {
+ :Activity;
+}
+floating note: Note on Package
+
+rectangle Rectangle {
+ :Activity;
+}
+floating note: Note on Rectangle
+
+card Card {
+ :Activity;
+}
+floating note: Note on Card
+end
+@enduml
+----
+
+
+== Swimlanes
+
+Using pipe `+|+`, you can define swimlanes.
+
+It's also possible to change swimlanes link::color[color].
+[plantuml]
+----
+@startuml
+|Swimlane1|
+start
+:foo1;
+|#AntiqueWhite|Swimlane2|
+:foo2;
+:foo3;
+|Swimlane1|
+:foo4;
+|Swimlane2|
+:foo5;
+stop
+@enduml
+----
+
+You can add `+if+` conditional or `+repeat+` or `+while+` loop within swimlanes.
+[plantuml]
+----
+@startuml
+|#pink|Actor_For_red|
+start
+if (color?) is (red) then
+#pink:**action red**;
+:foo1;
+else (not red)
+|#lightgray|Actor_For_no_red|
+#lightgray:**action not red**;
+:foo2;
+endif
+|Next_Actor|
+#lightblue:foo3;
+:foo4;
+|Final_Actor|
+#palegreen:foo5;
+stop
+@enduml
+----
+
+You can also use `+alias+` with swimlanes, with this syntax:
+* `+|[#|]| +`
+
+[plantuml]
+----
+@startuml
+|#palegreen|f| fisherman
+|c| cook
+|#gold|e| eater
+|f|
+start
+:go fish;
+|c|
+:fry fish;
+|e|
+:eat fish;
+stop
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/2681/possible-define-alias-swimlane-place-alias-everywhere-else?show=2685#a2685[QA-2681]]__
+
+
+== Detach or kill [detach, kill]
+
+It's possible to remove an arrow using the `+detach+` or `+kill+` keyword:
+
+* `+detach+`
+
+[plantuml]
+----
+@startuml
+ :start;
+ fork
+ :foo1;
+ :foo2;
+ fork again
+ :foo3;
+ detach
+ endfork
+ if (foo4) then
+ :foo5;
+ detach
+ endif
+ :foo6;
+ detach
+ :foo7;
+ stop
+@enduml
+----
+
+* `+kill+`
+
+
+[plantuml]
+----
+@startuml
+ :start;
+ fork
+ :foo1;
+ :foo2;
+ fork again
+ :foo3;
+ kill
+ endfork
+ if (foo4) then
+ :foo5;
+ kill
+ endif
+ :foo6;
+ kill
+ :foo7;
+ stop
+@enduml
+----
+
+
+== SDL (Specification and Description Language)
+
+By changing the final `+;+` separator, you can set different rendering for the activity:
+* `+|+`
+* `+<+`
+* `+>+`
+* `+/+`
+* `+\\+`
+* `+]+`
+* `+}+`
+[plantuml]
+----
+@startuml
+:Ready;
+:next(o)|
+:Receiving;
+split
+ :nak(i)<
+ :ack(o)>
+split again
+ :ack(i)<
+ :next(o)
+ on several lines|
+ :i := i + 1]
+ :ack(o)>
+split again
+ :err(i)<
+ :nak(o)>
+split again
+ :foo/
+split again
+ :bar\\
+split again
+ :i > 5}
+stop
+end split
+:finish;
+@enduml
+----
+
+
+== Complete example
+
+
+[plantuml]
+----
+@startuml
+
+start
+:ClickServlet.handleRequest();
+:new page;
+if (Page.onSecurityCheck) then (true)
+ :Page.onInit();
+ if (isForward?) then (no)
+ :Process controls;
+ if (continue processing?) then (no)
+ stop
+ endif
+
+ if (isPost?) then (yes)
+ :Page.onPost();
+ else (no)
+ :Page.onGet();
+ endif
+ :Page.onRender();
+ endif
+else (false)
+endif
+
+if (do redirect?) then (yes)
+ :redirect process;
+else
+ if (do forward?) then (yes)
+ :Forward request;
+ else (no)
+ :Render page template;
+ endif
+endif
+
+stop
+
+@enduml
+----
+
+
+== Condition Style
+
+=== Inside style (by default)
+[plantuml]
+----
+@startuml
+skinparam conditionStyle inside
+start
+repeat
+ :act1;
+ :act2;
+repeatwhile (end)
+:act3;
+@enduml
+----
+[plantuml]
+----
+@startuml
+start
+repeat
+ :act1;
+ :act2;
+repeatwhile (end)
+:act3;
+@enduml
+----
+
+=== Diamond style
+[plantuml]
+----
+@startuml
+skinparam conditionStyle diamond
+start
+repeat
+ :act1;
+ :act2;
+repeatwhile (end)
+:act3;
+@enduml
+----
+
+
+
+=== InsideDiamond (or __Foo1__) style
+[plantuml]
+----
+@startuml
+skinparam conditionStyle InsideDiamond
+start
+repeat
+ :act1;
+ :act2;
+repeatwhile (end)
+:act3;
+@enduml
+----
+[plantuml]
+----
+@startuml
+skinparam conditionStyle foo1
+start
+repeat
+ :act1;
+ :act2;
+repeatwhile (end)
+:act3;
+@enduml
+----
+
+
+__[Ref. https://forum.plantuml.net/1290/plantuml-condition-rendering[QA-1290] and https://github.com/plantuml/plantuml/issues/400#issuecomment-721287124[#400]]__
+
+
+== Condition End Style
+
+=== Diamond style (by default)
+
+* With one branch
+[plantuml]
+----
+@startuml
+skinparam ConditionEndStyle diamond
+:A;
+if (decision) then (yes)
+ :B1;
+else (no)
+endif
+:C;
+@enduml
+----
+
+* With two branches (`+B1+`, `+B2+`)
+[plantuml]
+----
+@startuml
+skinparam ConditionEndStyle diamond
+:A;
+if (decision) then (yes)
+ :B1;
+else (no)
+ :B2;
+endif
+:C;
+@enduml
+@enduml
+----
+
+=== Horizontal line (hline) style
+* With one branch
+[plantuml]
+----
+@startuml
+skinparam ConditionEndStyle hline
+:A;
+if (decision) then (yes)
+ :B1;
+else (no)
+endif
+:C;
+@enduml
+----
+
+* With two branches (`+B1+`, `+B2+`)
+[plantuml]
+----
+@startuml
+skinparam ConditionEndStyle hline
+:A;
+if (decision) then (yes)
+ :B1;
+else (no)
+ :B2;
+endif
+:C;
+@enduml
+@enduml
+----
+
+
+__[Ref. https://forum.plantuml.net/4015/its-possible-to-draw-if-else-endif-without-merge-symbol[QA-4015]]__
+
+
+== Using (global) style
+
+=== Without style __(by default)__
+[plantuml]
+----
+@startuml
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+----
+
+
+=== With style
+
+You can use link::style-evolution[style] to change rendering of elements.
+
+[plantuml]
+----
+@startuml
+
+start
+:init;
+-> test of color;
+if (color?) is (red) then
+:print red;
+else
+:print not red;
+note right: no color
+endif
+partition End {
+:end;
+}
+-> this is the end;
+end
+@enduml
+----
+
+
diff --git a/plantuml-docs/modules/ROOT/pages/activity-diagram-issues.adoc b/plantuml-docs/modules/ROOT/pages/activity-diagram-issues.adoc
new file mode 100644
index 00000000..17b35d8a
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/pages/activity-diagram-issues.adoc
@@ -0,0 +1,182 @@
+== Activity Diagram issues (activity-diagram-issues)
+
+This page lists issues on link::activity-diagram-beta[Activity Diagram].
+
+
+== Backward Error on swim-lanes
+
+[plantuml]
+----
+@startuml
+|Swimlane1|
+start
+repeat :foo as starting label;
+ :read data;
+ :generate diagrams;
+|Swimlane2|
+backward:This is backward;
+repeat while (more data?)
+|Swimlane1|
+stop
+@enduml
+----
+
+[plantuml]
+----
+@startuml
+|Swimlane1|
+start
+repeat :foo as starting label;
+ :read data;
+|Swimlane2|
+ :generate diagrams;
+repeat while (more data?)
+|Swimlane1|
+stop
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/12427[QA-12427]]__
+
+'''
+
+[plantuml]
+----
+@startuml
+|#AntiqueWhite|Sistem|
+|Admin|
+repeat :Generate Again;
+:Generate Foo;
+|Sistem|
+:Bar;
+backward: Do bar;
+repeat while (Is foo?) is (yes)
+->no;
+:finish foo;
+stop
+@enduml
+----
+
+[plantuml]
+----
+@startuml
+|Admin|
+repeat :Generate Again;
+:Generate Foo;
+|#AntiqueWhite|Sistem|
+:Bar;
+backward: Do bar;
+repeat while (Is foo?) is (yes)
+->no;
+:finish foo;
+stop
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/14473[QA-14473]]__
+
+
+== If test on swimlane
+
+[plantuml]
+----
+@startuml
+|Lane 1|
+|Lane 2|
+|Lane 1|
+start
+if (sure?) then (yes)
+else (no)
+ |Lane 2|
+ :baz;
+endif
+|Lane 2|
+:foo;
+@enduml
+----
+
+VS
+
+[plantuml]
+----
+@startuml
+|Lane 2|
+|Lane 1|
+start
+if (sure?) then (yes)
+else (no)
+ |Lane 2|
+ :baz;
+endif
+|Lane 2|
+:foo;
+@enduml
+----
+
+
+__[Ref. https://forum.plantuml.net/3689[QA-3689]]__
+
+
+== A example of `+goto+`
+
+The first example of `+goto+` is broken...
+
+[plantuml]
+----
+@startuml
+title Example of QA-1626
+:foo1;
+label lab1
+:foo2;
+if (some test) then
+ :foo3;
+ goto lab1
+else
+ :foo4;
+endif
+stop
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/1626/there-refer-existing-activity-inside-activitydiagram-goto?show=2342#a2342[QA-1626]]__
+
+
+== Overlap of arrow on Switch [fixed on V1.2022.4+]
+
+[plantuml]
+----
+@startuml
+switch (Long long long Long long long condition?)
+case (Long long long long long long long long long case 1)
+ :Action 1;
+case (Arrow Error\nLong long long long long long long long long case 2)
+ :Action 2;
+endswitch
+footer \nObserved on: 1.2022.3b2\n(current version: %version())
+@enduml
+----
+
+or
+
+[plantuml]
+----
+@startuml
+
+switch (Long long long Long long long condition?)
+case (Long long long long long long long long long case 1)
+ :Action 1;
+case (Arrow Error\nLong long long long long long long long long case 2)
+ :Action 2;
+endswitch
+footer \nObserved on: 1.2022.3b2\n(current version: %version())
+@enduml
+----
+
+See:
+* https://forum.plantuml.net/14529/activity-style-allow-style-diamond-internal-label-external[QA-14529]
+
+
diff --git a/plantuml-docs/modules/ROOT/pages/activity-diagram-legacy.adoc b/plantuml-docs/modules/ROOT/pages/activity-diagram-legacy.adoc
new file mode 100644
index 00000000..7c5881df
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/pages/activity-diagram-legacy.adoc
@@ -0,0 +1,380 @@
+== Activity Diagram (legacy)
+
+This is the old **Activity Diagram (legacy)** syntax, to see the new current version see: link::activity-diagram-beta[**Activity Diagram (new)**].
+
+
+== Simple Action
+
+You can use `+(*)+` for the starting point and ending point of
+the activity diagram.
+
+In some occasion, you may want to use `+(*top)+` to force the starting point to be at the top of the diagram.
+
+
+Use `+-->+` for arrows.
+
+[plantuml]
+----
+@startuml
+
+(*) --> "First Action"
+"First Action" --> (*)
+
+@enduml
+----
+
+
+== Label on arrows
+
+
+
+By default, an arrow starts at the last used activity.
+
+You can put a label on an arrow using brackets `+[+` and
+`+]+` just after the arrow definition.
+[plantuml]
+----
+@startuml
+
+(*) --> "First Action"
+-->[You can put also labels] "Second Action"
+--> (*)
+
+@enduml
+----
+
+
+== Changing arrow direction
+
+
+You can use `+->+` for horizontal arrows. It is possible to
+force arrow's direction using the following syntax:
+* `+-down->+` (default arrow)
+* `+-right->+` or `+->+`
+* `+-left->+`
+* `+-up->+`
+
+[plantuml]
+----
+@startuml
+
+(*) -up-> "First Action"
+-right-> "Second Action"
+--> "Third Action"
+-left-> (*)
+
+@enduml
+----
+
+
+== Branches
+
+
+You can use `+if/then/else+` keywords to define branches.
+
+[plantuml]
+----
+@startuml
+(*) --> "Initialization"
+
+if "Some Test" then
+ -->[true] "Some Action"
+ --> "Another Action"
+ -right-> (*)
+else
+ ->[false] "Something else"
+ -->[Ending process] (*)
+endif
+
+@enduml
+----
+
+Unfortunately, you will have to sometimes repeat the same activity in the diagram text:
+[plantuml]
+----
+@startuml
+(*) --> "check input"
+If "input is verbose" then
+--> [Yes] "turn on verbosity"
+--> "run command"
+else
+--> "run command"
+Endif
+-->(*)
+@enduml
+----
+
+
+== More on Branches
+
+
+By default, a branch is connected to the last defined activity, but it
+is possible to override this and to define a link with the `+if+` keywords.
+
+It is also possible to nest branches.
+
+[plantuml]
+----
+@startuml
+
+(*) --> if "Some Test" then
+
+ -->[true] "action 1"
+
+ if "" then
+ -> "action 3" as a3
+ else
+ if "Other test" then
+ -left-> "action 5"
+ else
+ --> "action 6"
+ endif
+ endif
+
+else
+
+ ->[false] "action 2"
+
+endif
+
+a3 --> if "last test" then
+ --> "action 7"
+else
+ -> "action 8"
+endif
+
+@enduml
+----
+
+
+== Synchronization
+
+You can use `+=== code ===+` to display synchronization bars.
+
+[plantuml]
+----
+@startuml
+
+(*) --> ===B1===
+--> "Parallel Action 1"
+--> ===B2===
+
+===B1=== --> "Parallel Action 2"
+--> ===B2===
+
+--> (*)
+
+@enduml
+----
+
+
+== Long action description
+
+
+When you declare activities, you can span on several lines the
+description text. You can also add `+\n+` in the description.
+
+You can also give a short code to the activity with the `+as+`
+keyword.
+This code can be used latter in the diagram description.
+
+[plantuml]
+----
+@startuml
+(*) -left-> "this action
+is verylong2
+and defined on several lines
+that contains many text" as A1
+
+-up-> "Another action\n on several lines"
+
+A1 --> "Short action "
+@enduml
+----
+
+
+== Notes
+
+
+You can add notes on a activity using the commands
+`+note left+`,
+`+note right+`, `+note top+` or `+note bottom+`,
+just after the description of the activity you want to note.
+
+If you want to put a note on the starting point, define the note
+at the very beginning of the diagram description.
+
+You can also have a note on several lines, using the
+`+endnote+` keywords.
+[plantuml]
+----
+@startuml
+
+(*) --> "Some action"
+note right: This action has to be defined
+"Some action" --> (*)
+note left
+ This note is on
+ several lines
+end note
+
+@enduml
+----
+
+
+== Partition
+
+You can define a partition using the `+partition+` keyword, and
+optionally declare a background color for your partition (Using a html
+color code or name)
+
+When you declare activities, they are automatically put in the
+last used partition.
+
+You can close the partition definition using a closing bracket `+}+`.
+[plantuml]
+----
+@startuml
+
+partition Conductor {
+ (*) --> "Climbs on Platform"
+ --> === S1 ===
+ --> Bows
+}
+
+partition Audience #LightSkyBlue {
+ === S1 === --> Applauds
+}
+
+partition Conductor {
+ Bows --> === S2 ===
+ --> WavesArmes
+ Applauds --> === S2 ===
+}
+
+partition Orchestra #CCCCEE {
+ WavesArmes --> Introduction
+ --> "Play music"
+}
+
+@enduml
+----
+
+
+
+== Skinparam
+
+
+You can use the link::skinparam[skinparam]
+command to change colors and fonts for the drawing.
+
+You can use this command :
+* In the diagram definition, like any other commands,
+* In an link::preprocessing[included file],
+* In a configuration file, provided in the link::command-line[command line] or the link::ant-task[ANT task].
+You can define specific color and fonts for stereotyped activities.
+
+[plantuml]
+----
+@startuml
+
+skinparam backgroundColor #AAFFFF
+skinparam activity {
+ StartColor red
+ BarColor SaddleBrown
+ EndColor Silver
+ BackgroundColor Peru
+ BackgroundColor<< Begin >> Olive
+ BorderColor Peru
+ FontName Impact
+}
+
+(*) --> "Climbs on Platform" << Begin >>
+--> === S1 ===
+--> Bows
+--> === S2 ===
+--> WavesArmes
+--> (*)
+
+@enduml
+----
+
+
+
+== Octagon
+
+You can change the shape of activities to octagon using the `+skinparam activityShape octagon+`
+command.
+[plantuml]
+----
+@startuml
+'Default is skinparam activityShape roundBox
+skinparam activityShape octagon
+
+(*) --> "First Action"
+"First Action" --> (*)
+
+@enduml
+----
+
+
+== Complete example
+
+
+[plantuml]
+----
+@startuml
+title Servlet Container
+
+(*) --> "ClickServlet.handleRequest()"
+--> "new Page"
+
+if "Page.onSecurityCheck" then
+ ->[true] "Page.onInit()"
+
+ if "isForward?" then
+ ->[no] "Process controls"
+
+ if "continue processing?" then
+ -->[yes] ===RENDERING===
+ else
+ -->[no] ===REDIRECT_CHECK===
+ endif
+
+ else
+ -->[yes] ===RENDERING===
+ endif
+
+ if "is Post?" then
+ -->[yes] "Page.onPost()"
+ --> "Page.onRender()" as render
+ --> ===REDIRECT_CHECK===
+ else
+ -->[no] "Page.onGet()"
+ --> render
+ endif
+
+else
+ -->[false] ===REDIRECT_CHECK===
+endif
+
+if "Do redirect?" then
+ ->[yes] "redirect request"
+ --> ==BEFORE_DESTROY===
+else
+ if "Do Forward?" then
+ -left->[yes] "Forward request"
+ --> ==BEFORE_DESTROY===
+ else
+ -right->[no] "Render page template"
+ --> ==BEFORE_DESTROY===
+ endif
+endif
+
+--> "Page.onDestroy()"
+-->(*)
+
+@enduml
+----
+
+
diff --git a/plantuml-docs/modules/ROOT/pages/ant-task.adoc b/plantuml-docs/modules/ROOT/pages/ant-task.adoc
new file mode 100644
index 00000000..0ad590a1
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/pages/ant-task.adoc
@@ -0,0 +1,141 @@
+== Writing an Ant Task
+You must have something like this into your https://en.wikipedia.org/wiki/Apache_Ant[**Ant**] `+build.xml+` file:
+
+----
+
+
+
+
+
+
+
+
+
+----
+
+
+The https://en.wikipedia.org/wiki/Apache_Ant[**Ant**] task processes all **.c**, **.h**, **.cpp**, **.tex**, **.html**, **.htm** or **.java** of the provided directory (`+./src+` in this example). It looks for `+@startXYZ+` and generates `+.png+` images.
+
+
+== Output Directory
+You can also specify a output directory for all generated images, using
+`+output+` tag.
+----
+
+
+
+
+----
+
+
+
+== Recurse through directories
+
+You can also use **Ant** standard http://www.163jsp.com/help/antman1.7.1/CoreTypes/fileset.html[fileset]
+or http://www.163jsp.com/help/antman1.7.1/CoreTypes/filelist.html[filelist].
+
+For example, if you want to process all java file in `+c:/src+` and subdirectories, (except files ending by `+Test.java+`), and generate images into `+d:/images+`, you can use:
+----
+
+
+
+
+
+
+----
+
+----
+
+
+== SVG or EPS Support
+
+
+You can also use `+format="svg"+` or `+format="eps"+` in the **Ant** task definition.
+----
+
+
+
+----
+
+
+== Configuration file
+
+
+You can also provide a configuration file which will be included before each diagram.
+
+----
+
+
+
+----
+
+
+
+== Other parameters
+
+|===
+| Parameter | Default | Description
+
+| nbthread
+| 1
+| Number of thread for processing
+
+| graphvizDot
+|
+| Path of the dot executable
+
+| format
+| png
+| Format for image generation: xmi, xmi:argo, xmi:start, eps, svg, txt, utxt
+
+| verbose
+| `+false+`
+| `+true+` for more logs
+
+| config
+|
+| File config to include before all diagrams
+
+| charset
+|
+| Charset to use when reading files
+
+| output
+|
+| Output directory for generated images
+
+| dir
+|
+| Input directory to process (You can use `+/+` instead)
+
+| failonerror
+| `+false+`
+| `+true+` to fail the build if some syntax error occurs
+
+| checkonly
+| `+false+`
+| `+true+` if you want to only check the syntax of files without generating images
+
+| overwrite
+| `+false+`
+| `+true+` if you want overwrite read-only files
+
+| enablestats
+| `+false+`
+| `+true+` to enable statistics
+
+| htmlstats
+| `+false+`
+| `+true+` to output general statistics in file plantuml-stats.html
+
+| xmlstats
+| `+false+`
+| `+true+` to output general statistics in file plantuml-stats.xml
+
+| realtimestats
+| `+false+`
+| `+true+` to generate statistics on the fly rather than at the end
+
+|===
+
+
diff --git a/plantuml-docs/modules/ROOT/pages/api.adoc b/plantuml-docs/modules/ROOT/pages/api.adoc
new file mode 100644
index 00000000..cc4fb395
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/pages/api.adoc
@@ -0,0 +1,58 @@
+== Calling PlantUML from Java
+You can easily integrate **PlantUML** with your own code by adding __plantuml.jar__ in your classpath.
+
+
+
+== PNG generation from a String
+If your diagram description is stored in a `+String+`, you can use the `+SourceStringReader+` class to generate some PNG file.
+
+----
+import net.sourceforge.plantuml.SourceStringReader;
+OutputStream png = ...;
+String source = "@startuml\n";
+source += "Bob -> Alice : hello\n";
+source += "@enduml\n";
+
+SourceStringReader reader = new SourceStringReader(source);
+// Write the first image to "png"
+String desc = reader.outputImage(png).getDescription();
+// Return a null string if no generation
+----
+
+
+== PNG generation from a File
+
+If your diagram description is stored in a `+File+`, you can use the `+SourceFileReader+` class to generate some PNG file.
+
+----
+File source = ...;
+SourceFileReader reader = new SourceFileReader(source);
+List list = reader.getGeneratedImages();
+// Generated files
+File png = list.get(0).getPngFile();
+----
+
+
+
+== SVG generation from a String
+
+If your diagram description is stored in a `+String+`, you can use the `+SourceStringReader+` class to generate some SVG file.
+
+----
+String source = "@startuml\n";
+source += "Bob -> Alice : hello\n";
+source += "@enduml\n";
+
+SourceStringReader reader = new SourceStringReader(source);
+final ByteArrayOutputStream os = new ByteArrayOutputStream();
+// Write the first image to "os"
+String desc = reader.generateImage(os, new FileFormatOption(FileFormat.SVG));
+os.close();
+
+// The XML is stored into svg
+final String svg = new String(os.toByteArray(), Charset.forName("UTF-8"));
+----
+
+
+
+
diff --git a/plantuml-docs/modules/ROOT/pages/archimate-diagram.adoc b/plantuml-docs/modules/ROOT/pages/archimate-diagram.adoc
new file mode 100644
index 00000000..bc0101ea
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/pages/archimate-diagram.adoc
@@ -0,0 +1,320 @@
+== Archimate Diagram
+
++++This is only a proposal and subject to change+++.
+
+You are very welcome http://forum.plantuml.net[to create a new discussion] on this future syntax. Your feedbacks, ideas and suggestions help us to find the right solution.
+
+
+
+== Archimate keyword
+
+You can use the `+archimate+` keyword to define an element. Stereotype can optionally specify an additional icon. Some colors (`+Business+`, `+Application+`, `+Motivation+`, `+Strategy+`, `+Technology+`, `+Physical+`, `+Implementation+`) are also available.
+
+[plantuml]
+----
+@startuml
+archimate #Technology "VPN Server" as vpnServerA <>
+
+rectangle GO #lightgreen
+rectangle STOP #red
+rectangle WAIT #orange
+@enduml
+----
+
+
+
+== Defining Junctions
+
+Using the `+circle+` keyword and the link::preprocessing[preprocessor], you can also create junctions.
+
+[plantuml]
+----
+@startuml
+!define Junction_Or circle #black
+!define Junction_And circle #whitesmoke
+
+Junction_And JunctionAnd
+Junction_Or JunctionOr
+
+archimate #Technology "VPN Server" as vpnServerA <>
+
+rectangle GO #lightgreen
+rectangle STOP #red
+rectangle WAIT #orange
+GO -up-> JunctionOr
+STOP -up-> JunctionOr
+STOP -down-> JunctionAnd
+WAIT -down-> JunctionAnd
+@enduml
+----
+
+
+
+== Example 1
+
+
+[plantuml]
+----
+skinparam rectangle<> {
+ roundCorner 25
+}
+sprite $bProcess jar:archimate/business-process
+sprite $aService jar:archimate/application-service
+sprite $aComponent jar:archimate/application-component
+
+rectangle "Handle claim" as HC <<$bProcess>><> #Business
+rectangle "Capture Information" as CI <<$bProcess>><> #Business
+rectangle "Notify\nAdditional Stakeholders" as NAS <<$bProcess>><> #Business
+rectangle "Validate" as V <<$bProcess>><> #Business
+rectangle "Investigate" as I <<$bProcess>><> #Business
+rectangle "Pay" as P <<$bProcess>><> #Business
+
+HC *-down- CI
+HC *-down- NAS
+HC *-down- V
+HC *-down- I
+HC *-down- P
+
+CI -right->> NAS
+NAS -right->> V
+V -right->> I
+I -right->> P
+
+rectangle "Scanning" as scanning <<$aService>><> #Application
+rectangle "Customer admnistration" as customerAdministration <<$aService>><> #Application
+rectangle "Claims admnistration" as claimsAdministration <<$aService>><> #Application
+rectangle Printing <<$aService>><> #Application
+rectangle Payment <<$aService>><> #Application
+
+scanning -up-> CI
+customerAdministration -up-> CI
+claimsAdministration -up-> NAS
+claimsAdministration -up-> V
+claimsAdministration -up-> I
+Payment -up-> P
+
+Printing -up-> V
+Printing -up-> P
+
+rectangle "Document\nManagement\nSystem" as DMS <<$aComponent>> #Application
+rectangle "General\nCRM\nSystem" as CRM <<$aComponent>> #Application
+rectangle "Home & Away\nPolicy\nAdministration" as HAPA <<$aComponent>> #Application
+rectangle "Home & Away\nFinancial\nAdministration" as HFPA <<$aComponent>> #Application
+
+DMS .up.|> scanning
+DMS .up.|> Printing
+CRM .up.|> customerAdministration
+HAPA .up.|> claimsAdministration
+HFPA .up.|> Payment
+
+legend left
+Example from the "Archisurance case study" (OpenGroup).
+See
+====
+<$bProcess> :business process
+====
+<$aService> : application service
+====
+<$aComponent> : application component
+endlegend
+----
+
+
+== Example 2
+
+[plantuml]
+----
+skinparam roundcorner 25
+rectangle "Capture Information" as CI <<$archimate/business-process>> #Business
+----
+
+
+== List possible sprites
+
+You can list all possible sprites for Archimate using the following diagram:
+
+[plantuml]
+----
+@startuml
+listsprite
+@enduml
+----
+
+
+
+== ArchiMate Macros
+
+=== Archimate Macros and Library
+
+A list of Archimate macros are defined https://github.com/ebbypeter/Archimate-PlantUML[Archimate-PlantUML] here which simplifies the creation of ArchiMate diagrams, and Archimate is natively on the link::stdlib[Standard Library] of PlantUML.
+
+=== Archimate elements
+Using the macros, creation of ArchiMate elements are done using the following format:
+`+Category_ElementName(nameOfTheElement, "description")+`
+
+For example:
+* To define a __Stakeholder__ element, which is part of Motivation category, the syntax will be `+Motivation_Stakeholder(StakeholderElement, "Stakeholder Description")+`:
+[plantuml]
+----
+@startuml
+!include
+Motivation_Stakeholder(StakeholderElement, "Stakeholder Description")
+@enduml
+----
+
+
+* To define a __Business Service__ element, `+Business_Service(BService, "Business Service")+`:
+[plantuml]
+----
+@startuml
+!include
+Business_Service(BService, "Business Service")
+@enduml
+----
+
+=== Archimate relationships
+The ArchiMate relationships are defined with the following pattern:
+`+Rel_RelationType(fromElement, toElement, "description")+`
+and to define the direction/orientation of the two elements:
+`+Rel_RelationType_Direction(fromElement, toElement, "description")+`
+
+The `+RelationTypes+` supported are:
+* Access
+* Aggregation
+* Assignment
+* Association
+* Composition
+* Flow
+* Influence
+* Realization
+* Serving
+* Specialization
+* Triggering
+
+The `+Directions+` supported are:
+* Up
+* Down
+* Left
+* Right
+
+For example:
+* To denote a composition relationship between the __Stakeholder__ and __Business Service__ defined above, the syntax will be
+`+Rel_Composition(StakeholderElement, BService, "Description for the relationship")+`
+[plantuml]
+----
+@startuml
+!include
+Motivation_Stakeholder(StakeholderElement, "Stakeholder Description")
+Business_Service(BService, "Business Service")
+Rel_Composition(StakeholderElement, BService, "Description for the relationship")
+@enduml
+----
+* Unordered List ItemTo orient the two elements in top - down position, the syntax will be
+`+Rel_Composition_Down(StakeholderElement, BService, "Description for the relationship")+`
+[plantuml]
+----
+@startuml
+!include
+Motivation_Stakeholder(StakeholderElement, "Stakeholder Description")
+Business_Service(BService, "Business Service")
+Rel_Composition_Down(StakeholderElement, BService, "Description for the relationship")
+@enduml
+----
+
+=== Appendice: Examples of all Archimate RelationTypes
+[plantuml]
+----
+@startuml
+left to right direction
+skinparam nodesep 4
+!include
+Rel_Triggering(i15, j15, Triggering)
+Rel_Specialization(i14, j14, Specialization)
+Rel_Serving(i13, j13, Serving)
+Rel_Realization(i12, j12, Realization)
+Rel_Influence(i11, j11, Influence)
+Rel_Flow(i10, j10, Flow)
+Rel_Composition(i9, j9, Composition)
+Rel_Association_dir(i8, j8, Association_dir)
+Rel_Association(i7, j7, Association)
+Rel_Assignment(i6, j6, Assignment)
+Rel_Aggregation(i5, j5, Aggregation)
+Rel_Access_w(i4, j4, Access_w)
+Rel_Access_rw(i3, j3, Access_rw)
+Rel_Access_r(i2, j2, Access_r)
+Rel_Access(i1, j1, Access)
+@enduml
+----
+
+[plantuml]
+----
+@startuml
+title ArchiMate Relationships Overview
+skinparam nodesep 5
+
+!include
+left to right direction
+
+rectangle Other {
+() i14
+() j14
+}
+
+
+rectangle Dynamic {
+() i10
+() j10
+() i15
+() j15
+}
+
+rectangle Dependency {
+() i13
+() j13
+() i4
+() j4
+() i11
+() j11
+() i7
+() j7
+}
+
+rectangle Structural {
+() i9
+() j9
+() i5
+() j5
+() i6
+() j6
+() i12
+() j12
+}
+
+Rel_Triggering(i15, j15, Triggering)
+Rel_Specialization(i14, j14, Specialization)
+Rel_Serving(i13, j13, Serving)
+Rel_Realization(i12, j12, Realization)
+Rel_Influence(i11, j11, Influence)
+Rel_Flow(i10, j10, Flow)
+Rel_Composition(i9, j9, Composition)
+Rel_Association_dir(i7, j7, \nAssociation_dir)
+Rel_Association(i7, j7, Association)
+Rel_Assignment(i6, j6, Assignment)
+Rel_Aggregation(i5, j5, Aggregation)
+Rel_Access_w(i4, j4, Access_w)
+Rel_Access_rw(i4, j4, Access_rw)
+Rel_Access_r(i4, j4, Access_r)
+Rel_Access(i4, j4, Access)
+@enduml
+----
+
+__[Adapted from https://github.com/plantuml-stdlib/Archimate-PlantUML/pull/25[Archimate PR#25]]__
+
+
diff --git a/plantuml-docs/modules/ROOT/pages/ascii-art.adoc b/plantuml-docs/modules/ROOT/pages/ascii-art.adoc
new file mode 100644
index 00000000..572cdb38
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/pages/ascii-art.adoc
@@ -0,0 +1,333 @@
+== ASCII Art
+
+It is possible to generate link::sequence-diagram[Sequence Diagrams] using http://en.wikipedia.org/wiki/ASCII_art[ASCII art].
+
+----
+@startuml
+participant Bob
+actor Alice
+
+Bob -> Alice : hello
+Alice -> Bob : Is it ok?
+@enduml
+----
+
+You have to use the `+-txt+` flag in the command line, or the `+format+` tag in the link::ant-task[Ant task] :
+
+----
+
+
+
+----
+
+Generated files use .atxt extension. (__"a" as ASCII art : to NOT overide any existing .txt files!__).
+Here is the result:
+
+----
+ ,-.
+ `-'
+ /|\
+ ,---. |
+ |Bob| / \
+ `-+-' Alice
+ | hello |
+ |-------------->|
+ | |
+ | Is it ok? |
+ |<- - - - - - - |
+ ,-+-. Alice
+ |Bob| ,-.
+ `---' `-'
+ /|\
+ |
+ / \
+----
+You can control the maximum number of characters between participants by using `+skinparam maxAsciiMessageLength+`. This can be helpful if you need to limit the width of your ASCII Art.
+
+For example:
+----
+@startuml
+skinparam maxAsciiMessageLength 8
+participant Bob
+actor Alice
+
+Bob -> Alice : hello
+Alice -> Bob : Is it ok?
+@enduml
+----
+
+Will look like:
+----
+ ,-.
+ `-'
+ /|\
+ ,---. |
+ |Bob| / \
+ `-+-' Alice
+ |hello |
+ |------>|
+ | |
+ Is it ok?
+ |<------|
+ ,-+-. Alice
+ |Bob| ,-.
+ `---' `-'
+ /|\
+ |
+ / \
+----
+
+
+== Unicode
+
+The default `+txt+` format uses only plain ASCII characters. It is possible to use few extended Unicode characters to have a slightly better result. You should use the `+-utxt+` flag in the command line, or the `+utxt+` format in the link::ant-task[Ant task].
+
+----
+ โโโ
+ โ"โ
+ โโฌโ
+ โโผโ
+ โโโโโ โ
+ โBobโ โโดโ
+ โโโฌโโ Alice
+ โ hello โ
+ โโโโโโโโโโโโโโโ>โ
+ โ โ
+ โ Is it ok? โ
+ โ<โ โ โ โ โ โ โ โ
+ โโโดโโ Alice
+ โBobโ โโโ
+ โโโโโ โ"โ
+ โโฌโ
+ โโผโ
+ โ
+ โโดโ
+----
+
+They are two drawbacks of using utxt:
+
+* The result is UTF-8 encoded, and sometimes this is an issue (mail gateway, editors...)
+* The used font must have the used extended characters (like Courier, Courier New...)
+
+
+== Complex Diagram
+
+You can even try complex example if you wish.
+
+----
+@startuml
+'hide footbox
+
+participant "Bob on\nseveral lines" as Bob
+actor Alice
+
+Bob -> Alice : hello
+note right of Alice
+ this is a note
+end note
+
+Alice -> Bob : Is it ok\nwith a message that is\non several lines?
+
+note right
+ This other note
+ should work
+ on several lines
+end note
+
+== This is a separation ==
+
+Bob -> Last : Yes it works!
+Last -> Last : working in progress
+note left : this is\nanother note
+
+Last --> Last : working in progress
+
+Last --> Bob : done
+
+opt dummy comment
+ Bob -> Last : Error\nOn\nSeveral\nLine
+ Last --> Bob : None
+else
+ Last --> Bob : None
+ Last -> Bob : None
+else other
+ Last -> Bob : None
+ note over Alice, Last
+ This is a long note
+ over Alice and Last
+ end note
+ Last -> Bob : None
+ Last -> Bob : None
+end
+@enduml
+----
+
+
+
+== Result
+
+----
+ ,-.
+ `-'
+ ,-------------. /|\
+ |Bob on | | ,----.
+ |several lines| / \ |Last|
+ `------+------' Alice `-+--'
+ | hello | |
+ |---------------------->| |
+ | | |
+ | | ,--------------!.
+ | | |this is a note|_\
+ | | `----------------'
+ |Is it ok | ,----------------!.
+ |with a message that is | |This other note |_\
+ |on several lines? | |should work |
+ |<----------------------| |on several lines |
+ | | `------------------'
+ | | |
+ | ======================== |
+====================================== This is a separation =======================================
+ | ======================== |
+ | | |
+ | Yes it works! |
+ |-------------------------------------->|
+ | | |
+ | ,------------!. |----.
+ | |this is |_\| | working in progress
+ | |another note ||<---'
+ | `--------------'|
+ | | |- - .
+ | | | | working in progress
+ | | |< - '
+ | | |
+ | done | |
+ |<- - - - - - - - - - - - - - - - - - - |
+ | | |
+ ______________________________________________________________________
+ ! OPT / dummy comment | | !
+ !_____/ | | | !
+ ! | | | !
+ ! | Error | | !
+ ! | On | | !
+ ! | Several | | !
+ ! | Line | | !
+ ! |-------------------------------------->| !
+ ! | | | !
+ ! | None | | !
+ ! |<- - - - - - - - - - - - - - - - - - - | !
+ !~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~!
+ ! | | | !
+ ! | None | | !
+ ! |<- - - - - - - - - - - - - - - - - - - | !
+ ! | | | !
+ ! | None | | !
+ ! |<--------------------------------------| !
+ !~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~!
+ ! [other] | | | !
+ ! | None | | !
+ ! |<--------------------------------------| !
+ ! | | | !
+ ! | ,-------------------!. !
+ ! | |This is a long note|_\ !
+ ! | |over Alice and Last | !
+ ! | `---------------------' !
+ ! | None | | !
+ ! |<--------------------------------------| !
+ ! | | | !
+ ! | None | | !
+ ! |<--------------------------------------| !
+ !~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~!
+ ,------+------. Alice ,-+--.
+ |Bob on | ,-. |Last|
+ |several lines| `-' `----'
+ `-------------' /|\
+ |
+ / \
+----
+
+
+
+== Same example using Unicode
+
+----
+ โโโ
+ โ"โ
+ โโฌโ
+ โโโโโโโโโโโโโโโ โโผโ
+ โBob on โ โ โโโโโโ
+ โseveral linesโ โโดโ โLastโ
+ โโโโโโโโฌโโโโโโโ Alice โโโฌโโโ
+ โ hello โ โ
+ โโโโโโโโโโโโโโโโโโโโโโโ>โ โ
+ โ โ โ
+ โ โ โโโโโโโโโโโโโโโงโโโ
+ โ โ โthis is a note โโ
+ โ โ โโโโโโโโโโโโโโโคโโโ
+ โIs it ok โ โโโโโโโโโโโโโโโงโโโโโ
+ โwith a message that is โ โThis other note โโ
+ โon several lines? โ โshould work โ
+ โ<โโโโโโโโโโโโโโโโโโโโโโโ โon several lines โ
+ โ โ โโโโโโโโโโโโโโโคโโโโโ
+ โ โ โ
+ โ โโโโโโโโโโงโโโโโโโโโโโโโโ โ
+โโโโโโโโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโฃ This is a separation โ โโชโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ
+ โ โโโโโโโโโโคโโโโโโโโโโโโโโ โ
+ โ โ โ
+ โ Yes it works! โ
+ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ>โ
+ โ โ โ
+ โ โโโโโโโโโโโโโโโโโโโโโโ
+ โ โthis is โโโ โ working in progress
+ โ โanother note โโ<โโโโ
+ โ โโโโโโโโโโโโโโโโโ
+ โ โ โโ โ โ
+ โ โ โ | working in progress
+ โ โ โ< โ โ
+ โ โ โ
+ โ done โ โ
+ โ<โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ
+ โ โ โ
+ โโโโโโโโคโโโโโโโโโโชโโโโโโโโโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโ
+ โ OPT โ dummy comment โ โ โ
+ โโโโโโโโ โ โ โ โ
+ โ โ โ โ โ
+ โ โ Error โ โ โ
+ โ โ On โ โ โ
+ โ โ Several โ โ โ
+ โ โ Line โ โ โ
+ โ โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ>โ โ
+ โ โ โ โ โ
+ โ โ None โ โ โ
+ โ โ<โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ
+ โ โโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโฃ
+ โ โ โ โ โ
+ โ โ None โ โ โ
+ โ โ<โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ โ
+ โ โ โ โ โ
+ โ โ None โ โ โ
+ โ โ<โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ
+ โ โโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโฃ
+ โ [other] โ โ โ โ
+ โ โ None โ โ โ
+ โ โ<โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ
+ โ โ โ โ โ
+ โ โ โโโโงโโโโโโโโโโโโโโโโงโโโ โ
+ โ โ โThis is a long note โโ โ
+ โ โ โover Alice and Last โ โ
+ โ โ โโโโคโโโโโโโโโโโโโโโโคโโโ โ
+ โ โ None โ โ โ
+ โ โ<โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ
+ โ โ โ โ โ
+ โ โ None โ โ โ
+ โ โ<โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ โ
+ โโโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโโโโชโโโโโโโโโโโโโ
+ โโโโโโโโดโโโโโโโ Alice โโโดโโโ
+ โBob on โ โโโ โLastโ
+ โseveral linesโ โ"โ โโโโโโ
+ โโโโโโโโโโโโโโโ โโฌโ
+ โโผโ
+ โ
+ โโดโ
+----
+
+
diff --git a/plantuml-docs/modules/ROOT/pages/ascii-math.adoc b/plantuml-docs/modules/ROOT/pages/ascii-math.adoc
new file mode 100644
index 00000000..f52be1f4
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/pages/ascii-math.adoc
@@ -0,0 +1,76 @@
+== Maths
+
+Within PlantUML, you can use http://asciimath.org[AsciiMath] notation:
+[plantuml]
+----
+@startuml
+:;
+:;
+note right
+Try also
+
+
+end note
+@enduml
+----
+
+or https://github.com/opencollab/jlatexmath[JLaTeXMath] notation:
+[plantuml]
+----
+@startuml
+:\int_0^1f(x)dx;
+:x^2+y_1+z_{12}^{34};
+note right
+Try also
+\dfrac{d}{dx}f(x)=\lim\limits_{h \to 0}\dfrac{f(x+h)-f(x)}{h}
+P(y|\mathbf{x}) \mbox{ or } f(\mathbf{x})+\epsilon
+end note
+@enduml
+----
+
+Here is another example:
+[plantuml]
+----
+@startuml
+Bob -> Alice : Can you solve:
+Alice --> Bob:
+@enduml
+----
+
+
+== Standalone diagram
+
+You can also use `+@startmath+`/`+@endmath+` to create standalone http://asciimath.org[AsciiMath] formula.
+
+
+[plantuml]
+----
+@startmath
+f(t)=(a_0)/2 + sum_(n=1)^ooa_ncos((npit)/L)+sum_(n=1)^oo b_n\ sin((npit)/L)
+@endmath
+----
+
+
+Or use `+@startlatex+`/`+@endlatex+` to create standalone https://github.com/opencollab/jlatexmath[JLaTeXMath] formula.
+
+[plantuml]
+----
+@startlatex
+\sum_{i=0}^{n-1} (a_i + b_i^2)
+@endlatex
+----
+
+
+== How is this working?
+
+To draw those formulas, PlantUML uses two open source projects:
+
+* https://github.com/asciimath/asciimathml/tree/master/asciimath-based[AsciiMath] that converts AsciiMath notation to LaTeX expression;
+* https://github.com/opencollab/jlatexmath[JLatexMath] that displays mathematical formulas written in LaTeX. JLaTeXMath is the best Java library to display LaTeX code.
+
+https://github.com/asciimath/asciimathml/blob/master/asciimath-based/ASCIIMathTeXImg.js[ASCIIMathTeXImg.js] is small enough to be integrated into PlantUML standard distribution.
+
+
+Since https://github.com/opencollab/jlatexmath[JLatexMath] is bigger, you have to http://beta.plantuml.net/plantuml-jlatexmath.zip[download it] separately, then unzip the 4 jar files (__batik-all-1.7.jar__, __jlatexmath-minimal-1.0.3.jar__, __jlm\_cyrillic.jar__ and __jlm\_greek.jar__) in the same folder as PlantUML.jar.
+
+
diff --git a/plantuml-docs/modules/ROOT/pages/board-diagram.adoc b/plantuml-docs/modules/ROOT/pages/board-diagram.adoc
new file mode 100644
index 00000000..6f4686e6
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/pages/board-diagram.adoc
@@ -0,0 +1,45 @@
+== Board diagram
+
+https://github.com/plantuml/plantuml/issues/423[Incubation of board diagram]
+
+
+== Basic component
+
+[plantuml]
+----
+@startboard
+A1
++U1.1
+++S1 R1
+++S1 R2
++U1.2
+A2
+@endboard
+----
+
+[plantuml]
+----
+@startboard
+Activity 1
++User Task 1a
+++Story 1 Release 1
+++Story 2 Release 1
++User Task 1b
+++Story 3 Release 1
++++Story 4 Release 1
+++++Story 5 Release 2
+
+Activity 2
++User Task 2
++++Story 6 Release 1
++++Story 7 Release 1
++++Story 8 Release 2
+Activity 3
+
++User Task 3
+++++Story 9 Release 2
+++++Story 10 Release 3
+@endboard
+----
+
+
diff --git a/plantuml-docs/modules/ROOT/pages/bpmn.adoc b/plantuml-docs/modules/ROOT/pages/bpmn.adoc
new file mode 100644
index 00000000..332b8103
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/pages/bpmn.adoc
@@ -0,0 +1,126 @@
+== Business Process Model and Notation (BPMN)
+
+This is preliminary works to add https://en.wikipedia.org/wiki/Business_Process_Model_and_Notation[BPMN] support in PlantUML.
+
+Right now, some quick stuff have been done.
+
+The implementation is based on ideas developped in:
+* http://wiki.plantuml.net/_media/site/kitzmann2009a.pdf[kitzmann2009a.pdf]
+* https://www.researchgate.net/publication/221542866_A_Simple_Algorithm_for_Automatic_Layout_of_BPMN_Processes[A Simple Algorithm for Automatic Layout of BPMN Processes]
+
+
+__[Ref. http://wiki.plantuml.net/site/bpmn[Wiki-BPMN]]__
+
+
+== Final examples
+
+[plantuml]
+----
+@startbpm
+:login;
+20:<+>
+:show new message1;
+30:<+>
+resume 20
+:show new task2;
+@endbpm
+----
+
+
+__[Ref. https://forum.plantuml.net/5647[QA-5647]]__
+
+[plantuml]
+----
+@startbpm
+:login;
+new branch
+:show new message1;
+else
+:show new task2;
+end branch
+new branch
+:Accept Task;
+else
+:nothing;
+else
+new branch
+:read message;
+else
+:dummy;
+end branch
+end branch
+:logout;
+@endbpm
+----
+
+__[Ref. http://wiki.plantuml.net/site/bpmn[Wiki-bpmn]]__
+
+
+== Existing diagrams
+
+Please put here pointer existing diagrams that you'd like to have supported in PlantUML.
+
+https://www.tim-zoeller.de/Basics-1.png[Basic processes with User Task, Service Task, Exclusive Gateways, and Parallel Gateways]
+
+Start with simple examples!
+
+This http://www.bpmb.de/images/BPMN2_0_Poster_EN.pdf[PDF] gives a good overview of the BPMN2.0 syntax.
+It basically boils down to boxes, circles and lines plus swimlanes.
+So it is close to an activity diagram.
+
+All shapes can be "decorated" with symbols.
+These add some more detail, but are not necessary to get an overview of the process.
+This fact should be reflected in the syntax - it should first let you design the process and then add the details.
+
+
+== Syntax
+The proposed syntax is probably not very clear.
+
+Here we have to talk about it and propose a better one.
+
+There are rules for good diagrams which might make the syntax easier to create.
+One of these rules is that when you split the process- (token-) flow, it will be merged back together with the same symbol.
+[comment: This is not neccessarily true. It is allowed to merge the flows with a different gateway, again or without any gateway at all. Also, the flows don't need to be merged]
+
+There is also the feature of "closed" swim-lanes - swim-lanes where the content is not shown because the detailed process is not known or you want to focus on other parts of the diagram.
+It should be reflected by the syntax that a swim-lane can be opened and closed with just a switch.
+
+
+
+== Example1
+image::bpm01.png[]
+----
+@startbpm
+XXXX
+@endbpm
+----
+
+
+
+== Example2
+image::bpm02.png[]
+----
+@startbpm
+XXXX
+@endbpm
+----
+
+
+
+== Example3
+image::bpm03.png[]
+----
+@startbpm
+XXXX
+@endbpm
+----
+
+
+
+== Other theorical works
+
+The following https://github.com/MarvinLudwig/bpmn_layouter[BPMN Layouter project ] may be interesting.
+link::jjc-mt.pdf[jjc-mt.pdf]
+
+
+
diff --git a/plantuml-docs/modules/ROOT/pages/class-diagram-issues.adoc b/plantuml-docs/modules/ROOT/pages/class-diagram-issues.adoc
new file mode 100644
index 00000000..96255d33
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/pages/class-diagram-issues.adoc
@@ -0,0 +1,190 @@
+== Class Diagram issues (class-diagram-issues)
+
+This page lists issues on link::class-diagram[Class Diagram].
+
+
+== Wanted features
+
+* https://forum.plantuml.net/13773/style-the-methods-section-of-a-class-diagram[QA-13773/style-the-methods-section-of-a-class-diagram]
+
+Adding, on inline style:
+* fields
+* methods
+
++ on [beta-]style
+
+Proposal syntax:
+----
+@startuml
+class Demo1 #back:lightgreen|yellow;header:blue/red;methods:red\green;fields:pink
+@enduml
+----
+
+
+== Arrow head Groupinheritance bug
+
+* https://forum.plantuml.net/13532/groupinheritance-bug[QA-13532]
+[plantuml]
+----
+@startuml
+skinparam groupInheritance 3
+
+class A1
+
+A1 <|-- B1
+
+A2 <|-- B2
+A2 <|-- C2
+
+A3 <|-- B3
+A3 <|-- C3
+A3 <|-- D3
+
+A4 <|-- B4
+A4 <|-- C4
+A4 <|-- D4
+
+E4 --|> A4 #blue
+E6 --|> A4 #blue
+E5 --|> A4 #blue
+@enduml
+----
+
+Same on element:
+[plantuml]
+----
+@startuml
+skinparam groupInheritance 3
+
+card A1
+
+A1 <|-- B1
+
+A2 <|-- B2
+A2 <|-- C2
+
+A3 <|-- B3 #blue
+A3 <|-- C3 #blue
+A3 <|-- D3 #blue
+
+A4 <|-- B4 #blue
+A4 <|-- C4 #blue
+A4 <|-- D4 #blue
+
+E4 --|> A4
+E6 --|> A4
+E5 --|> A4
+@enduml
+----
+
+
+== Another similar groupInheritance issue
+
+* https://github.com/plantuml/plantuml/issues/729[GH-729]
+
+[plantuml]
+----
+@startuml
+skinparam groupInheritance 2
+
+Parent <|-- Child1
+Parent <|-- Child2
+Composed --* Parent #blue
+Aggregated --o Parent #blue
+Arrow --> Parent #blue
+@enduml
+----
+
+[plantuml]
+----
+@startuml
+skinparam groupInheritance 3
+
+Parent <|-- Child1
+Parent <|-- Child2
+Composed --* Parent
+Aggregated --o Parent
+Arrow --> Parent
+@enduml
+----
+
+
+== Line thickness issue (from ~V1.2022.2) [fixed on 1.2022.6betaX]
+
+[plantuml]
+----
+@startuml
+title Bracketed line thickness
+class foo
+class bar
+bar1 : [thickness=1]
+bar2 : [thickness=2]
+bar3 : [thickness=4]
+bar4 : [thickness=8]
+bar5 : [thickness=16]
+
+foo --> bar : โ
+foo -[thickness=1]-> bar1 : [1]
+foo -[thickness=2]-> bar2 : [2]
+foo -[thickness=4]-> bar3 : [4]
+foo -[thickness=8]-> bar4 : [8]
+foo -[thickness=16]-> bar5 : [16]
+
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/4949[QA-4949]]__
+
+
+== Error on Change class color and style (inline style) [fixed on 1.2022.6betaX]
+
+โ โผโ +++Appeared from version v1.2022.2+++++ [fixed on 1.2022.6betaX]
+
+* Error on `+##[style]color+`: error on style
+
+[plantuml]
+----
+@startuml
+abstract abstract
+annotation annotation ##[bold]red
+note bottom: Why not bold?
+class class ##[dashed]green
+note bottom: Why not dashed?
+interface interface ##[dotted]blue
+note bottom: Why not dotted?
+
+@enduml
+----
+
+
+
+* `+#[color|back:color];header:color;line:color;line.[bold|dashed|dotted];text:color+`
+
+[plantuml]
+----
+@startuml
+abstract abstract
+annotation annotation #line:red;line.bold;text:red
+note bottom: Why not bold?
+class class #line:green;line.dashed;text:green
+note bottom: Why not dashed?
+interface interface #line:blue;line.dotted;text:blue
+note bottom: Why not dotted?
+@enduml
+----
+
+First original example:
+[plantuml]
+----
+@startuml
+class bar #line:green;back:lightblue
+class bar2 #lightblue;line:green
+
+class Foo1 #back:red;line:00FFFF
+class FooDashed #line.dashed:blue
+class FooDotted #line.dotted:blue
+class FooBold #line.bold
+@enduml
+----
+
+
diff --git a/plantuml-docs/modules/ROOT/pages/class-diagram.adoc b/plantuml-docs/modules/ROOT/pages/class-diagram.adoc
new file mode 100644
index 00000000..046b3a34
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/pages/class-diagram.adoc
@@ -0,0 +1,1698 @@
+== Class Diagram
+
+
+
+== Declaring element
+
+[plantuml]
+----
+@startuml
+abstract abstract
+abstract class "abstract class"
+annotation annotation
+circle circle
+() circle_short_form
+class class
+diamond diamond
+<> diamond_short_form
+entity entity
+enum enum
+exception exception
+interface interface
+metaclass metaclass
+protocol protocol
+stereotype stereotype
+struct struct
+@enduml
+----
+
+__[Ref. for `+protocol+` and `+struct+`: https://github.com/plantuml/plantuml/pull/1028[GH-1028], for `+exception+`: https://forum.plantuml.net/16258/adding-exception-keyword-for-class-diagram[QA-16258]]__
+
+
+== Relations between classes
+
+Relations between classes are defined using the following symbols :
+
+|===
+| Type | Symbol | Drawing
+
+| Extension
+| `+<|--+`
+| image::extends01.png[]
+
+| Composition
+| `+*--+`
+| image::sym03.png[]
+
+| Aggregation
+| `+o--+`
+| image::sym01.png[]
+
+|===
+
+It is possible to replace `+--+` by `+..+` to have a dotted
+line.
+
+Knowing those rules, it is possible to draw the following drawings:
+
+
+[plantuml]
+----
+@startuml
+Class01 <|-- Class02
+Class03 *-- Class04
+Class05 o-- Class06
+Class07 .. Class08
+Class09 -- Class10
+@enduml
+----
+
+[plantuml]
+----
+@startuml
+Class11 <|.. Class12
+Class13 --> Class14
+Class15 ..> Class16
+Class17 ..|> Class18
+Class19 <--* Class20
+@enduml
+----
+
+[plantuml]
+----
+@startuml
+Class21 #-- Class22
+Class23 x-- Class24
+Class25 }-- Class26
+Class27 +-- Class28
+Class29 ^-- Class30
+@enduml
+----
+
+
+
+== Label on relations
+
+
+It is possible to add a label on the relation, using `+:+`, followed
+by the text of the label.
+
+For cardinality, you can use double-quotes `+""+` on each side
+of the relation.
+
+
+[plantuml]
+----
+@startuml
+
+Class01 "1" *-- "many" Class02 : contains
+
+Class03 o-- Class04 : aggregation
+
+Class05 --> "1" Class06
+
+@enduml
+----
+
+You can add an extra arrow pointing at one object showing
+which object acts on the other object, using `+<+` or `+>+`
+at the begin or at the end of the label.
+
+
+[plantuml]
+----
+@startuml
+class Car
+
+Driver - Car : drives >
+Car *- Wheel : have 4 >
+Car -- Person : < owns
+
+@enduml
+----
+
+
+== Using non-letters in element names and relation labels
+
+
+If you want to use link::unicode[non-letters] in the class (or enum...) display name, you can either :
+* Use the `+as+` keyword in the class definition to assign an alias
+* Put quotes `+""+` around the class name
+
+[plantuml]
+----
+@startuml
+class "This is my class" as class1
+class class2 as "It works this way too"
+
+class2 *-- "foo/dummy" : use
+@enduml
+----
+
+If an alias is assigned to an element, the rest of the file must refer to the element by the alias instead of the name.
+
+=== Starting names with `+$+`
+Note that names starting with `+$+` cannot be hidden or removed later, because `+hide+` and `+remove+` command will consider the name a `+$tag+` instead of a component name. To later remove such elements they must have an alias or must be tagged.
+[plantuml]
+----
+@startuml
+class $C1
+class $C2 $C2
+class "$C2" as dollarC2
+remove $C1
+remove $C2
+remove dollarC2
+@enduml
+----
+Also note that names starting with `+$+` are valid, but to assign an alias to such element the name must be put between quotes `+""+`.
+
+
+== Adding methods
+
+To declare fields and methods, you can use the symbol
+`+:+` followed by the field's or method's name.
+
+The system checks for parenthesis to choose between methods and fields.
+
+[plantuml]
+----
+@startuml
+Object <|-- ArrayList
+
+Object : equals()
+ArrayList : Object[] elementData
+ArrayList : size()
+
+@enduml
+----
+
+
+It is also possible to group between brackets
+`+{}+` all fields and methods.
+
+Note that the syntax is highly flexible about type/name order.
+
+
+[plantuml]
+----
+@startuml
+class Dummy {
+ String data
+ void methods()
+}
+
+class Flight {
+ flightNumber : Integer
+ departureTime : Date
+}
+@enduml
+----
+
+You can use `+{field}+` and `+{method}+` modifiers to
+override default behaviour of the parser about fields and methods.
+[plantuml]
+----
+@startuml
+class Dummy {
+ {field} A field (despite parentheses)
+ {method} Some method
+}
+
+@enduml
+----
+
+
+
+== Defining visibility
+
+When you define methods or fields, you can use characters to define the
+visibility of the corresponding item:
+
+|===
+| Character | Icon for field | Icon for method | Visibility
+
+| `+-+`
+| image::private-field.png[]
+| image::private-method.png[]
+| `+private+`
+
+| `+#+`
+| image::protected-field.png[]
+| image::protected-method.png[]
+| `+protected+`
+
+| `+~+`
+| image::package-private-field.png[]
+| image::package-private-method.png[]
+| `+package private+`
+
+| `+++`
+| image::public-field.png[]
+| image::public-method.png[]
+| `+public+`
+
+|===
+
+[plantuml]
+----
+@startuml
+
+class Dummy {
+ -field1
+ #field2
+ ~method1()
+ +method2()
+}
+
+@enduml
+----
+
+
+You can turn off this feature using the `+skinparam classAttributeIconSize 0+` command :
+
+
+[plantuml]
+----
+@startuml
+skinparam classAttributeIconSize 0
+class Dummy {
+ -field1
+ #field2
+ ~method1()
+ +method2()
+}
+
+@enduml
+----
+
+Visibility indicators are optional and can be ommitted individualy without turning off the icons globally using `+skinparam classAttributeIconSize 0+`.
+
+[plantuml]
+----
+@startuml
+class Dummy {
+ field1
+ field2
+ method1()
+ method2()
+}
+
+@enduml
+----
+
+In such case if you'd like to use methods or fields that start with `+-+`, `+#+`, `+~+` or `+++` characters such as a destructor in some languages for `+Dummy+` class `+~Dummy()+`, escape the first character with a `+\+` character:
+
+
+[plantuml]
+----
+@startuml
+class Dummy {
+ field1
+ \~Dummy()
+ method1()
+}
+
+@enduml
+----
+
+
+== Abstract and Static
+
+
+
+You can define static or abstract methods or fields using the `+{static}+`
+or `+{abstract}+` modifier.
+
+These modifiers can be used at the start or at the end of the line.
+You can also use `+{classifier}+` instead of `+{static}+`.
+
+[plantuml]
+----
+@startuml
+class Dummy {
+ {static} String id
+ {abstract} void methods()
+}
+@enduml
+----
+
+
+
+== Advanced class body
+
+
+
+By default, methods and fields are automatically regrouped by PlantUML.
+You can use separators to define your own way of ordering fields and methods.
+The following separators are possible : `+--+` `+..+` `+==+` `+__+`.
+
+You can also use titles within the separators:
+
+
+[plantuml]
+----
+@startuml
+class Foo1 {
+ You can use
+ several lines
+ ..
+ as you want
+ and group
+ ==
+ things together.
+ __
+ You can have as many groups
+ as you want
+ --
+ End of class
+}
+
+class User {
+ .. Simple Getter ..
+ + getName()
+ + getAddress()
+ .. Some setter ..
+ + setName()
+ __ private data __
+ int age
+ -- encrypted --
+ String password
+}
+
+@enduml
+----
+
+
+== Notes and stereotypes
+
+Stereotypes are defined with the `+class+` keyword, `+<<+` and `+>>+`.
+
+You can also define notes using `+note left of+` , `+note right of+` , `+note top of+` , `+note bottom of+`
+keywords.
+
+You can also define a note on the last defined class using `+note left+`, `+note right+`,
+`+note top+`, `+note bottom+`.
+
+A note can be also define alone with the `+note+`
+keywords, then linked to other objects using the `+..+` symbol.
+
+[plantuml]
+----
+@startuml
+class Object << general >>
+Object <|--- ArrayList
+
+note top of Object : In java, every class\nextends this one.
+
+note "This is a floating note" as N1
+note "This note is connected\nto several objects." as N2
+Object .. N2
+N2 .. ArrayList
+
+class Foo
+note left: On last defined class
+
+@enduml
+----
+
+
+
+== More on notes
+
+
+It is also possible to use few HTML tags (See link::creole[Creole expression]) like :
+
+* `++`
+* `++`
+* `++`
+* `++`, `++`, `++`
+* `++` or `++`
+* `++` or `++`
+* `++` to change font size
+* `++` or `++`: the file must be accessible by the filesystem
+
+
+You can also have a note on several lines.
+
+You can also define a note on the last defined class using `+note left+`, `+note right+`,
+`+note top+`, `+note bottom+`.
+[plantuml]
+----
+@startuml
+
+class Foo
+note left: On last defined class
+
+note top of Object
+ In java, every class
+ extends
+ this one.
+end note
+
+note as N1
+ This note is also
+ on several
+ words lines
+ And this is hosted by
+end note
+
+@enduml
+----
+
+
+== Note on field (field, attribute, member) or method
+
+
+It is possible to add a note on field (field, attribute, member) or on method.
+
+=== โ Constraint
+* This cannot be used with `+top+` or `+bottom+` __(only `+left+` and `+right+` are implemented)__
+* This cannot be used with namespaceSeparator `+::+`
+
+
+=== Note on field or method
+
+[plantuml]
+----
+@startuml
+class A {
+{static} int counter
++void {abstract} start(int timeout)
+}
+note right of A::counter
+ This member is annotated
+end note
+note right of A::start
+ This method is now explained in a UML note
+end note
+@enduml
+----
+
+
+=== Note on method with the same name
+
+[plantuml]
+----
+@startuml
+class A {
+{static} int counter
++void {abstract} start(int timeoutms)
++void {abstract} start(Duration timeout)
+}
+note left of A::counter
+ This member is annotated
+end note
+note right of A::"start(int timeoutms)"
+ This method with int
+end note
+note right of A::"start(Duration timeout)"
+ This method with Duration
+end note
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/3474[QA-3474] and https://forum.plantuml.net/5835[QA-5835]]__
+
+
+== Note on links
+
+
+It is possible to add a note on a link, just after the link definition, using `+note on link+`.
+
+You can also use `+note left on link+`, `+note right on link+`, `+note top on link+`,
+`+note bottom on link+` if you want to change the relative position of the note with the label.
+
+[plantuml]
+----
+@startuml
+
+class Dummy
+Dummy --> Foo : A link
+note on link #red: note that is red
+
+Dummy --> Foo2 : Another link
+note right on link #blue
+this is my note on right link
+and in blue
+end note
+
+@enduml
+----
+
+
+
+== Abstract class and interface
+
+
+You can declare a class as abstract using `+abstract+` or `+abstract class+` keywords.
+
+The class will be printed in __italic__.
+
+
+You can use the `+interface+`, `+annotation+` and `+enum+` keywords too.
+
+[plantuml]
+----
+@startuml
+
+abstract class AbstractList
+abstract AbstractCollection
+interface List
+interface Collection
+
+List <|-- AbstractList
+Collection <|-- AbstractCollection
+
+Collection <|- List
+AbstractCollection <|- AbstractList
+AbstractList <|-- ArrayList
+
+class ArrayList {
+ Object[] elementData
+ size()
+}
+
+enum TimeUnit {
+ DAYS
+ HOURS
+ MINUTES
+}
+
+annotation SuppressWarnings
+
+annotation Annotation {
+ annotation with members
+ String foo()
+ String bar()
+}
+
+
+@enduml
+----
+
+__[Ref. 'Annotation with members' https://github.com/plantuml/plantuml/issues/458[Issue#458]]__
+
+
+== Hide attributes, methods...
+
+You can parameterize the display of classes using the `+hide/show+`
+command.
+
+The basic command is: `+hide empty members+`. This
+command will hide attributes or methods if they are empty.
+
+Instead of `+empty members+`, you can use:
+* `+empty fields+` or `+empty attributes+` for empty fields,
+* `+empty methods+` for empty methods,
+* `+fields+` or `+attributes+` which will hide fields, even if they are described,
+* `+methods+` which will hide methods, even if they are described,
+* `+members+` which will hide fields +++and+++ methods, even if they are described,
+* `+circle+` for the circled character in front of class name,
+* `+stereotype+` for the stereotype.
+
+You can also provide, just after the `+hide+` or `+show+`
+keyword:
+* `+class+` for all classes,
+* `+interface+` for all interfaces,
+* `+enum+` for all enums,
+* `+<>+` for classes which are stereotyped with __foo1__,
+* an existing class name.
+
+You can use several `+show/hide+` commands to define rules and
+exceptions.
+
+[plantuml]
+----
+@startuml
+
+class Dummy1 {
+ +myMethods()
+}
+
+class Dummy2 {
+ +hiddenMethod()
+}
+
+class Dummy3 <> {
+String name
+}
+
+hide members
+hide <> circle
+show Dummy1 methods
+show <> fields
+
+@enduml
+----
+
+
+
+== Hide classes
+
+You can also use the `+show/hide+` commands to hide classes.
+
+This may be useful if you define a large link::preprocessing[!included file],
+and if you want to hide some classes after link::preprocessing[file inclusion].
+
+[plantuml]
+----
+@startuml
+
+class Foo1
+class Foo2
+
+Foo2 *-- Foo1
+
+hide Foo2
+
+@enduml
+----
+
+
+== Remove classes
+
+You can also use the `+remove+` commands to remove classes.
+
+This may be useful if you define a large link::preprocessing[!included file],
+and if you want to remove some classes after link::preprocessing[file inclusion].
+
+[plantuml]
+----
+@startuml
+
+class Foo1
+class Foo2
+
+Foo2 *-- Foo1
+
+remove Foo2
+
+@enduml
+----
+
+
+== Hide, Remove or Restore tagged element or wildcard
+
+You can put `+$tags+` (using `+$+`) on elements, then remove, hide or restore components either individually or by tags.
+
+By default, all components are displayed:
+[plantuml]
+----
+@startuml
+class C1 $tag13
+enum E1
+interface I1 $tag13
+C1 -- I1
+@enduml
+----
+
+But you can:
+* `+hide $tag13+` components:
+[plantuml]
+----
+@startuml
+class C1 $tag13
+enum E1
+interface I1 $tag13
+C1 -- I1
+
+hide $tag13
+@enduml
+----
+
+* or `+remove $tag13+` components:
+[plantuml]
+----
+@startuml
+class C1 $tag13
+enum E1
+interface I1 $tag13
+C1 -- I1
+
+remove $tag13
+@enduml
+----
+
+* or `+remove $tag13 and restore $tag1+` components:
+[plantuml]
+----
+@startuml
+class C1 $tag13 $tag1
+enum E1
+interface I1 $tag13
+C1 -- I1
+
+remove $tag13
+restore $tag1
+@enduml
+----
+
+* or `+remove * and restore $tag1+` components:
+[plantuml]
+----
+@startuml
+class C1 $tag13 $tag1
+enum E1
+interface I1 $tag13
+C1 -- I1
+
+remove *
+restore $tag1
+@enduml
+----
+
+
+== Hide or Remove unlinked class
+
+By default, all classes are displayed:
+[plantuml]
+----
+@startuml
+class C1
+class C2
+class C3
+C1 -- C2
+@enduml
+----
+
+But you can:
+* `+hide @unlinked+` classes:
+[plantuml]
+----
+@startuml
+class C1
+class C2
+class C3
+C1 -- C2
+
+hide @unlinked
+@enduml
+----
+
+* or `+remove @unlinked+` classes:
+[plantuml]
+----
+@startuml
+class C1
+class C2
+class C3
+C1 -- C2
+
+remove @unlinked
+@enduml
+----
+
+
+__[Adapted from https://forum.plantuml.net/11052[QA-11052]]__
+
+
+== Use generics
+
+
+You can also use bracket `+<+` and `+>+` to define generics usage in a class.
+
+[plantuml]
+----
+@startuml
+
+class Foo extends Element> {
+ int size()
+}
+Foo *- Element
+
+@enduml
+----
+
+It is possible to disable this drawing using `+skinparam genericDisplay old+` command.
+
+
+
+== Specific Spot
+
+Usually, a spotted character (C, I, E or A) is used for classes,
+interface, enum and abstract classes.
+
+But you can define your own spot for a class when you define the stereotype,
+adding a single character and a color, like in this example:
+
+[plantuml]
+----
+@startuml
+
+class System << (S,#FF7700) Singleton >>
+class Date << (D,orchid) >>
+@enduml
+----
+
+
+
+== Packages
+
+You can define a package using the
+`+package+` keyword, and optionally declare a background color
+for your package (Using a html color code or name).
+
+Note that package definitions can be nested.
+
+[plantuml]
+----
+@startuml
+
+package "Classic Collections" #DDDDDD {
+ Object <|-- ArrayList
+}
+
+package net.sourceforge.plantuml {
+ Object <|-- Demo1
+ Demo1 *- Demo2
+}
+
+@enduml
+----
+
+
+
+== Packages style
+
+
+
+There are different styles available for packages.
+
+You can specify them either by setting a default style with the command : `+skinparam packageStyle+`,
+or by using a stereotype on the package:
+
+[plantuml]
+----
+@startuml
+scale 750 width
+package foo1 <> {
+ class Class1
+}
+
+package foo2 <> {
+ class Class2
+}
+
+package foo3 <> {
+ class Class3
+}
+
+package foo4 <> {
+ class Class4
+}
+
+package foo5 <> {
+ class Class5
+}
+
+package foo6 <> {
+ class Class6
+}
+
+@enduml
+----
+
+
+You can also define links between packages, like in the following
+example:
+
+[plantuml]
+----
+@startuml
+
+skinparam packageStyle rectangle
+
+package foo1.foo2 {
+}
+
+package foo1.foo2.foo3 {
+ class Object
+}
+
+foo1.foo2 +-- foo1.foo2.foo3
+
+@enduml
+----
+
+
+
+== Namespaces
+
+In packages, the name of a class is the unique identifier of this class.
+It means that you cannot have two classes with the very same name in
+different packages.
+
+In that case, you should use http://en.wikipedia.org/wiki/Namespace_%28computer_science%29[namespaces]
+instead of packages.
+
+You can refer to classes from other namespaces by fully qualify
+them. Classes from the default namespace are qualified with a starting
+dot.
+
+Note that you don't have to explicitly create namespace : a fully
+qualified class is automatically put in the right namespace.
+
+[plantuml]
+----
+@startuml
+
+class BaseClass
+
+namespace net.dummy #DDDDDD {
+ .BaseClass <|-- Person
+ Meeting o-- Person
+
+ .BaseClass <|- Meeting
+}
+
+namespace net.foo {
+ net.dummy.Person <|- Person
+ .BaseClass <|-- Person
+
+ net.dummy.Meeting o-- Person
+}
+
+BaseClass <|-- net.unused.Person
+
+@enduml
+----
+
+
+
+== Automatic namespace creation
+
+
+
+You can define another separator (other than the dot) using
+the command : `+set namespaceSeparator ???+`.
+
+[plantuml]
+----
+@startuml
+
+set namespaceSeparator ::
+class X1::X2::foo {
+ some info
+}
+
+@enduml
+----
+
+You can disable automatic namespace creation using the command
+`+set namespaceSeparator none+`.
+
+[plantuml]
+----
+@startuml
+
+set namespaceSeparator none
+class X1.X2.foo {
+ some info
+}
+
+@enduml
+----
+
+
+== Lollipop interface
+
+
+You can also define lollipops interface on classes, using the following
+syntax:
+* `+bar ()- foo+`
+* `+bar ()-- foo+`
+* `+foo -() bar+`
+
+[plantuml]
+----
+@startuml
+class foo
+bar ()- foo
+@enduml
+----
+
+
+
+== Changing arrows orientation
+
+By default, links between classes have two dashes `+--+` and are vertically oriented.
+It is possible to use horizontal link by putting a single dash (or dot) like this:
+
+[plantuml]
+----
+@startuml
+Room o- Student
+Room *-- Chair
+@enduml
+----
+
+You can also change directions by reversing the link:
+
+[plantuml]
+----
+@startuml
+Student -o Room
+Chair --* Room
+@enduml
+----
+
+It is also possible to change arrow direction by adding `+left+`, `+right+`, `+up+`
+or `+down+` keywords inside the arrow:
+
+[plantuml]
+----
+@startuml
+foo -left-> dummyLeft
+foo -right-> dummyRight
+foo -up-> dummyUp
+foo -down-> dummyDown
+@enduml
+----
+
+You can shorten the arrow by using only the first character of the direction (for example, `+-d-+` instead of
+`+-down-+`)
+or the two first characters (`+-do-+`).
+
+Please note that you should not abuse this functionality : __Graphviz__ gives usually good results without tweaking.
+
+And with the link::use-case-diagram#d551e48d272b2b07[`+left to right direction+`] parameter:
+[plantuml]
+----
+@startuml
+left to right direction
+foo -left-> dummyLeft
+foo -right-> dummyRight
+foo -up-> dummyUp
+foo -down-> dummyDown
+@enduml
+----
+
+
+== Association classes
+
+You can define __association class__ after that a relation has been
+defined between two classes, like in this example:
+[plantuml]
+----
+@startuml
+class Student {
+ Name
+}
+Student "0..*" - "1..*" Course
+(Student, Course) .. Enrollment
+
+class Enrollment {
+ drop()
+ cancel()
+}
+@enduml
+----
+
+You can define it in another direction:
+
+[plantuml]
+----
+@startuml
+class Student {
+ Name
+}
+Student "0..*" -- "1..*" Course
+(Student, Course) . Enrollment
+
+class Enrollment {
+ drop()
+ cancel()
+}
+@enduml
+----
+
+
+
+== Association on same class
+
+[plantuml]
+----
+@startuml
+class Station {
+ +name: string
+}
+
+class StationCrossing {
+ +cost: TimeInterval
+}
+
+<> diamond
+
+StationCrossing . diamond
+diamond - "from 0..*" Station
+diamond - "to 0..* " Station
+@enduml
+----
+
+__[Ref. http://wiki.plantuml.net/site/incubation#associations[Incubation: Associations]]__
+
+
+== Skinparam
+
+
+
+You can use the link::skinparam[skinparam]
+command to change colors and fonts for the drawing.
+
+You can use this command :
+* In the diagram definition, like any other commands,
+* In an link::preprocessing[included file],
+* In a configuration file, provided in the link::command-line[command line] or the link::ant-task[ANT task].
+
+[plantuml]
+----
+@startuml
+
+skinparam class {
+BackgroundColor PaleGreen
+ArrowColor SeaGreen
+BorderColor SpringGreen
+}
+skinparam stereotypeCBackgroundColor YellowGreen
+
+Class01 "1" *-- "many" Class02 : contains
+
+Class03 o-- Class04 : aggregation
+
+@enduml
+----
+
+
+
+== Skinned Stereotypes
+
+
+You can define specific color and fonts for stereotyped classes.
+
+[plantuml]
+----
+@startuml
+
+skinparam class {
+BackgroundColor PaleGreen
+ArrowColor SeaGreen
+BorderColor SpringGreen
+BackgroundColor<> Wheat
+BorderColor<> Tomato
+}
+skinparam stereotypeCBackgroundColor YellowGreen
+skinparam stereotypeCBackgroundColor<< Foo >> DimGray
+
+Class01 <>
+Class03 <>
+Class01 "1" *-- "many" Class02 : contains
+
+Class03 o-- Class04 : aggregation
+
+@enduml
+----
+
+
+
+== Color gradient
+
+You can declare individual colors for classes, notes etc using the # notation.
+
+You can use standard color names or RGB codes in various notations, see link::color[Colors].
+
+You can also use color gradient for background colors, with the following syntax:
+two colors names separated either by:
+* `+|+`,
+* `+/+`,
+* `+\+`, or
+* `+-+`
+depending on the direction of the gradient.
+
+For example:
+
+[plantuml]
+----
+@startuml
+
+skinparam backgroundcolor AntiqueWhite/Gold
+skinparam classBackgroundColor Wheat|CornflowerBlue
+
+class Foo #red-green
+note left of Foo #blue\9932CC
+ this is my
+ note on this class
+end note
+
+package example #GreenYellow/LightGoldenRodYellow {
+ class Dummy
+}
+
+@enduml
+----
+
+
+== Help on layout
+
+
+Sometimes, the default layout is not perfect...
+
+You can use `+together+` keyword to group some classes together :
+the layout engine will try to group them (as if they were in the same package).
+
+You can also use `+hidden+` links to force the layout.
+[plantuml]
+----
+@startuml
+
+class Bar1
+class Bar2
+together {
+ class Together1
+ class Together2
+ class Together3
+}
+Together1 - Together2
+Together2 - Together3
+Together2 -[hidden]--> Bar1
+Bar1 -[hidden]> Bar2
+
+
+@enduml
+----
+
+
+
+
+
+== Splitting large files
+
+Sometimes, you will get some very large image files.
+
+You can use the `+page (hpages)x(vpages)+` command to split the generated image into several files :
+
+`+hpages+` is a number that indicated the number of horizontal pages,
+and `+vpages+` is a number that indicated the number of vertical pages.
+
+You can also use some specific skinparam settings to put borders on splitted pages (see example).
+
+[plantuml]
+----
+@startuml
+' Split into 4 pages
+page 2x2
+skinparam pageMargin 10
+skinparam pageExternalColor gray
+skinparam pageBorderColor black
+
+class BaseClass
+
+namespace net.dummy #DDDDDD {
+ .BaseClass <|-- Person
+ Meeting o-- Person
+
+ .BaseClass <|- Meeting
+
+}
+
+namespace net.foo {
+ net.dummy.Person <|- Person
+ .BaseClass <|-- Person
+
+ net.dummy.Meeting o-- Person
+}
+
+BaseClass <|-- net.unused.Person
+@enduml
+----
+
+
+
+
+== Extends and implements
+
+It is also possible to use `+extends+` and `+implements+` keywords.
+[plantuml]
+----
+@startuml
+class ArrayList implements List
+class ArrayList extends AbstractList
+@enduml
+----
+
+
+== Bracketed relations (linking or arrow) style
+
+=== Line style
+It's also possible to have explicitly `+bold+`, `+dashed+`, `+dotted+`, `+hidden+` or `+plain+` relation, links or arrows: +
+
+* without label
+
+[plantuml]
+----
+@startuml
+title Bracketed line style without label
+class foo
+class bar
+bar1 : [bold]
+bar2 : [dashed]
+bar3 : [dotted]
+bar4 : [hidden]
+bar5 : [plain]
+
+foo --> bar
+foo -[bold]-> bar1
+foo -[dashed]-> bar2
+foo -[dotted]-> bar3
+foo -[hidden]-> bar4
+foo -[plain]-> bar5
+@enduml
+----
+
+* with label
+
+[plantuml]
+----
+@startuml
+title Bracketed line style with label
+class foo
+class bar
+bar1 : [bold]
+bar2 : [dashed]
+bar3 : [dotted]
+bar4 : [hidden]
+bar5 : [plain]
+
+foo --> bar : โ
+foo -[bold]-> bar1 : [bold]
+foo -[dashed]-> bar2 : [dashed]
+foo -[dotted]-> bar3 : [dotted]
+foo -[hidden]-> bar4 : [hidden]
+foo -[plain]-> bar5 : [plain]
+
+@enduml
+----
+
+__[Adapted from https://forum.plantuml.net/4181/how-change-width-line-in-a-relationship-between-two-classes?show=4232#a4232[QA-4181]]__
+
+=== Line color
+
+[plantuml]
+----
+@startuml
+title Bracketed line color
+class foo
+class bar
+bar1 : [#red]
+bar2 : [#green]
+bar3 : [#blue]
+
+foo --> bar
+foo -[#red]-> bar1 : [#red]
+foo -[#green]-> bar2 : [#green]
+foo -[#blue]-> bar3 : [#blue]
+'foo -[#blue;#yellow;#green]-> bar4
+@enduml
+----
+
+=== Line thickness
+
+[plantuml]
+----
+@startuml
+title Bracketed line thickness
+class foo
+class bar
+bar1 : [thickness=1]
+bar2 : [thickness=2]
+bar3 : [thickness=4]
+bar4 : [thickness=8]
+bar5 : [thickness=16]
+
+foo --> bar : โ
+foo -[thickness=1]-> bar1 : [1]
+foo -[thickness=2]-> bar2 : [2]
+foo -[thickness=4]-> bar3 : [4]
+foo -[thickness=8]-> bar4 : [8]
+foo -[thickness=16]-> bar5 : [16]
+
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/4949[QA-4949]]__
+
+=== Mix
+[plantuml]
+----
+@startuml
+title Bracketed line style mix
+class foo
+class bar
+bar1 : [#red,thickness=1]
+bar2 : [#red,dashed,thickness=2]
+bar3 : [#green,dashed,thickness=4]
+bar4 : [#blue,dotted,thickness=8]
+bar5 : [#blue,plain,thickness=16]
+
+foo --> bar : โ
+foo -[#red,thickness=1]-> bar1 : [#red,1]
+foo -[#red,dashed,thickness=2]-> bar2 : [#red,dashed,2]
+foo -[#green,dashed,thickness=4]-> bar3 : [#green,dashed,4]
+foo -[#blue,dotted,thickness=8]-> bar4 : [blue,dotted,8]
+foo -[#blue,plain,thickness=16]-> bar5 : [blue,plain,16]
+@enduml
+----
+
+
+== Change relation (linking or arrow) color and style (inline style)
+
+You can change the link::color[color] or style of individual relation or arrows using the inline following notation:
+
+* `+#color;line.[bold|dashed|dotted];text:color+`
+
+[plantuml]
+----
+@startuml
+class foo
+foo --> bar : normal
+foo --> bar1 #line:red;line.bold;text:red : red bold
+foo --> bar2 #green;line.dashed;text:green : green dashed
+foo --> bar3 #blue;line.dotted;text:blue : blue dotted
+@enduml
+----
+
+__[See similar feature on link::deployment-diagram#0b2e57c3d4eafdda[deployment]]__
+
+
+== Change class color and style (inline style)
+
+You can change the link::color[color] or style of individual class using the two following notations:
+
+* `+#color ##[style]color+`
+
+With background color first (`+#color+`), then line style and line color (`+##[style]color+` )
+[plantuml]
+----
+@startuml
+abstract abstract
+annotation annotation #pink ##[bold]red
+class class #palegreen ##[dashed]green
+interface interface #aliceblue ##[dotted]blue
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/1487[QA-1487]]__
+
+* `+#[color|back:color];header:color;line:color;line.[bold|dashed|dotted];text:color+`
+
+[plantuml]
+----
+@startuml
+abstract abstract
+annotation annotation #pink;line:red;line.bold;text:red
+class class #palegreen;line:green;line.dashed;text:green
+interface interface #aliceblue;line:blue;line.dotted;text:blue
+@enduml
+----
+
+First original example:
+[plantuml]
+----
+@startuml
+class bar #line:green;back:lightblue
+class bar2 #lightblue;line:green
+
+class Foo1 #back:red;line:00FFFF
+class FooDashed #line.dashed:blue
+class FooDotted #line.dotted:blue
+class FooBold #line.bold
+class Demo1 #back:lightgreen|yellow;header:blue/red
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/3770[QA-3770]]__
+
+
+== Arrows from/to class members
+
+[plantuml]
+----
+@startuml
+class Foo {
++ field1
++ field2
+}
+
+class Bar {
++ field3
++ field4
+}
+
+Foo::field1 --> Bar::field3 : foo
+Foo::field2 --> Bar::field4 : bar
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/3636[QA-3636]]__
+
+
+[plantuml]
+----
+@startuml
+left to right direction
+
+class User {
+ id : INTEGER
+ ..
+ other_id : INTEGER
+}
+
+class Email {
+ id : INTEGER
+ ..
+ user_id : INTEGER
+ address : INTEGER
+}
+
+User::id *-- Email::user_id
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/5261[QA-5261]]__
+
+
+== Grouping inheritance arrow heads
+
+You can merge all arrow heads using the `+skinparam groupInheritance+`, with a threshold as parameter.
+
+=== GroupInheritance 1 (no grouping)
+[plantuml]
+----
+@startuml
+skinparam groupInheritance 1
+
+A1 <|-- B1
+
+A2 <|-- B2
+A2 <|-- C2
+
+A3 <|-- B3
+A3 <|-- C3
+A3 <|-- D3
+
+A4 <|-- B4
+A4 <|-- C4
+A4 <|-- D4
+A4 <|-- E4
+@enduml
+----
+
+=== GroupInheritance 2 (grouping from 2)
+[plantuml]
+----
+@startuml
+skinparam groupInheritance 2
+
+A1 <|-- B1
+
+A2 <|-- B2
+A2 <|-- C2
+
+A3 <|-- B3
+A3 <|-- C3
+A3 <|-- D3
+
+A4 <|-- B4
+A4 <|-- C4
+A4 <|-- D4
+A4 <|-- E4
+@enduml
+----
+
+=== GroupInheritance 3 (grouping only from 3)
+[plantuml]
+----
+@startuml
+skinparam groupInheritance 3
+
+A1 <|-- B1
+
+A2 <|-- B2
+A2 <|-- C2
+
+A3 <|-- B3
+A3 <|-- C3
+A3 <|-- D3
+
+A4 <|-- B4
+A4 <|-- C4
+A4 <|-- D4
+A4 <|-- E4
+@enduml
+----
+
+=== GroupInheritance 4 (grouping only from 4)
+[plantuml]
+----
+@startuml
+skinparam groupInheritance 4
+
+A1 <|-- B1
+
+A2 <|-- B2
+A2 <|-- C2
+
+A3 <|-- B3
+A3 <|-- C3
+A3 <|-- D3
+
+A4 <|-- B4
+A4 <|-- C4
+A4 <|-- D4
+A4 <|-- E4
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/3193/grouping-inheritance-arrow-ends[QA-3193], and Defect https://forum.plantuml.net/13532/groupinheritance-bug[QA-13532]]__
+
+
+== Display JSON Data on Class or Object diagram
+
+=== Simple example
+[plantuml]
+----
+@startuml
+class Class
+object Object
+json JSON {
+ "fruit":"Apple",
+ "size":"Large",
+ "color": ["Red", "Green"]
+}
+@enduml
+----
+
+__[Ref. https://forum.plantuml.net/15481/possible-link-elements-from-two-jsons-with-both-jsons-embeded?show=15567#c15567[QA-15481]]__
+
+For another example, see on link::json#jinnkhaa7d65l0fkhfec[JSON page].
+
+
diff --git a/plantuml-docs/modules/ROOT/pages/code-groovy.adoc b/plantuml-docs/modules/ROOT/pages/code-groovy.adoc
new file mode 100644
index 00000000..0ffa9f35
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/pages/code-groovy.adoc
@@ -0,0 +1,20 @@
+== Groovy API Client Code
+
+Since calling Java from http://groovy.codehaus.org[Groovy] is pretty simple, the only thing to do is to copy http://sourceforge.net/projects/plantuml/files/plantuml.jar/download[PlantUML.jar] file to the http://groovy.codehaus.org/Running#Running-Addingthingstotheclasspath[classpath] (for example, `+../Groovy/Groovy-1.7.6/lib+` directory).
+
+
+The following script print the current PlantUML version, and encode a URL:
+----
+println net.sourceforge.plantuml.version.Version.version() println
+net.sourceforge.plantuml.code.TranscoderUtil.getDefaultTranscoder().encode("Bob->Alice:hello")
+----
+
+If you want to generate an image from a description:
+----
+s = new net.sourceforge.plantuml.SourceStringReader("@startuml\nBob->Alice:hello\n@enduml")
+FileOutputStream file = new FileOutputStream("c:/testGroovy2.png")
+s.generateImage(file);
+file.close()
+----
+
+
diff --git a/plantuml-docs/modules/ROOT/pages/code-javascript-asynchronous.adoc b/plantuml-docs/modules/ROOT/pages/code-javascript-asynchronous.adoc
new file mode 100644
index 00000000..0622927d
--- /dev/null
+++ b/plantuml-docs/modules/ROOT/pages/code-javascript-asynchronous.adoc
@@ -0,0 +1,104 @@
+== Javascript API Client Code
+
+To use PlantUML image generation, a text diagram description have to be :
+
+. Encoded in UTF-8
+. Compressed using http://en.wikipedia.org/wiki/DEFLATE[Deflate] algorithm
+. Reencoded in ASCII using a transformation __close__ to http://en.wikipedia.org/wiki/Base64[base64]
+
+This is exactly what the following `+compress()+` function is doing.
+
+'''
+
+----
+
+
+
+
+