@zenuml/core 2.0.16 → 2.0.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.eslintrc.json +0 -0
- package/README.md +0 -1
- package/README_CN.md +0 -2
- package/antlr/antlr-4.11.1-complete.jar +0 -0
- package/dist/CNAME.txt +1 -0
- package/dist/cy/defect-406-alt-under-creation.html +37 -0
- package/dist/cy/smoke-creation.html +23 -0
- package/dist/cy/smoke-fragment-issue.html +35 -0
- package/dist/cy/smoke-fragment.html +39 -0
- package/dist/cy/smoke-interaction.html +32 -0
- package/dist/cy/smoke-return.html +36 -0
- package/dist/cy/smoke.html +40 -0
- package/dist/embed-container-demo.html +50 -0
- package/dist/embed.html +173 -0
- package/dist/favicon.ico +0 -0
- package/dist/style.css +1 -0
- package/dist/zenuml-core.mjs +30592 -0
- package/dist/zenuml-core.umd.js +562 -0
- package/docs/asciidoc/contributor.adoc +17 -0
- package/docs/divider-parser-allow-spaces.md +38 -0
- package/index.html +84 -0
- package/package.json +38 -39
- package/pnpm-lock.yaml +9559 -0
- package/tailwind.config.js +1 -1
- package/types/svg.d.ts +4 -0
- package/vite.config.js +23 -0
- package/vue.config.spec.js +3 -48
- package/vue.temp.config.js +76 -0
- package/.nvmrc +0 -1
- package/antlr/antlr-4.8-complete.jar +0 -0
- package/dist/zenuml/core.common.js +0 -45985
- package/dist/zenuml/core.common.js.map +0 -1
- package/dist/zenuml/core.css +0 -5
- package/dist/zenuml/core.umd.js +0 -45996
- package/dist/zenuml/core.umd.js.map +0 -1
- package/dist/zenuml/core.umd.min.js +0 -18
- package/dist/zenuml/core.umd.min.js.map +0 -1
|
@@ -75,5 +75,22 @@ A.method
|
|
|
75
75
|
The entry point of the demo pages is `src/main.ts`. It will find all the `pre` elements with
|
|
76
76
|
class `zenuml` and render the ZenUML DSL code in it.
|
|
77
77
|
|
|
78
|
+
== Parser
|
|
78
79
|
|
|
80
|
+
We use antlr4 to parse the ZenUML DSL code. The grammar files are:
|
|
81
|
+
|
|
82
|
+
1. Parser: `./src/g4/sequenceParser.g4`
|
|
83
|
+
2. Lexer: `./src/g4/sequenceLexer.g4`
|
|
84
|
+
|
|
85
|
+
=== How to generate the parser and lexer
|
|
86
|
+
|
|
87
|
+
Run `yarn antlr4` to generate the parser and lexer.
|
|
88
|
+
|
|
89
|
+
=== Setup local development environment
|
|
90
|
+
|
|
91
|
+
Run `yarn antlr:setup` (`python3 -m pip install antlr4-tools`) to install the antlr4 command and the runtime.
|
|
92
|
+
|
|
93
|
+
To test the setup, go to `src/g4-unit/hello-world` folder, and run:
|
|
94
|
+
|
|
95
|
+
1.
|
|
79
96
|
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
This document describe the design of parsing rules for the `divider` statement.
|
|
2
|
+
|
|
3
|
+
## Typical use case
|
|
4
|
+
|
|
5
|
+
The `divider` statement is used to separate the sequence of statements into logical
|
|
6
|
+
groups.
|
|
7
|
+
|
|
8
|
+
For example, a HTTPS sequence can be separated into three logical groups:
|
|
9
|
+
1. Connect establishment
|
|
10
|
+
2. TLS handshake
|
|
11
|
+
3. HTTP request/response
|
|
12
|
+
|
|
13
|
+
```
|
|
14
|
+
Client->Server: TCP SYNC
|
|
15
|
+
Server->Client: TCP SYN+ACK
|
|
16
|
+
Client->Server: TCP ACK
|
|
17
|
+
== Connection Established ==
|
|
18
|
+
Client->Server: TLS Client Hello
|
|
19
|
+
Server->Client: TLS Server Hello
|
|
20
|
+
Server->Client: TLS Certificate
|
|
21
|
+
Server->Client: TLS Server Hello Done
|
|
22
|
+
== Certificate Check ==
|
|
23
|
+
Client->Server: TLS Client Key Exchange
|
|
24
|
+
Client->Server: TLS Change Cipher Spec
|
|
25
|
+
Client->Server: TLS Finished
|
|
26
|
+
Server->Client: TLS Change Cipher Spec
|
|
27
|
+
Server->Client: TLS Finished
|
|
28
|
+
== Key Exchange, Handshake Completed ==
|
|
29
|
+
Client->Server: HTTP Request
|
|
30
|
+
Server->Client: HTTP Response
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
## The Lexer
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
## `divider` is a statement
|
|
37
|
+
|
|
38
|
+
`divider` is treated as a statement as any other messages.
|
package/index.html
ADDED
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html>
|
|
3
|
+
<head>
|
|
4
|
+
<link rel='preconnect' href='https://fonts.gstatic.com' crossorigin>
|
|
5
|
+
<link rel='preload stylesheet' as='style' href='https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@300;400;500;700&display=swap'>
|
|
6
|
+
<!-- <link rel='stylesheet' href='https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@300;400;500;700&display=swap'>-->
|
|
7
|
+
<style id="zenumlstyle">/* Prefix your CSS rules with `#diagram` */
|
|
8
|
+
/*@import url('https://fonts.googleapis.com/css2?family=Kalam:wght@300;400;700&display=swap');*/
|
|
9
|
+
/*!*@import url("https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@300;400;500;700&display=swap");*!*/
|
|
10
|
+
|
|
11
|
+
/*#diagram1 .sequence-diagram {*/
|
|
12
|
+
/* font-family: "Kalam", serif;*/
|
|
13
|
+
/*}*/
|
|
14
|
+
|
|
15
|
+
</style>
|
|
16
|
+
<meta charset="utf-8">
|
|
17
|
+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
18
|
+
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
|
19
|
+
<link rel="stylesheet"
|
|
20
|
+
href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.1.1/styles/default.min.css" crossOrigin="anonymous">
|
|
21
|
+
<script src="https://cdn.jsdelivr.net/npm/codemirror@5.65.1/lib/codemirror.min.js"></script>
|
|
22
|
+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.1/codemirror.min.css" crossOrigin="anonymous" integrity="sha512-uf06llspW44/LZpHzHT6qBOIVODjWtv4MxCricRxkzvopAlSWnTf6hpZTFxuuZcuNE9CBQhqE0Seu1CoRk84nQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
|
23
|
+
<title>ZenUML Core Demo</title>
|
|
24
|
+
<style>
|
|
25
|
+
.zenuml .CodeMirror {
|
|
26
|
+
/* Set height, width, borders, and global font properties here */
|
|
27
|
+
font-family: monospace;
|
|
28
|
+
font-size: 13px;
|
|
29
|
+
height: 800px;
|
|
30
|
+
}
|
|
31
|
+
</style>
|
|
32
|
+
</head>
|
|
33
|
+
<!-- .zenuml will enable "important" feature of tailwindcss. This class is also added to
|
|
34
|
+
DiagramFrame so the diagram itself always works fine. This .zenuml is to make sure the
|
|
35
|
+
editor and other layouts work properly.-->
|
|
36
|
+
<body class="zenuml">
|
|
37
|
+
<noscript>
|
|
38
|
+
<strong>We're sorry but vue-sequence doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
|
|
39
|
+
</noscript>
|
|
40
|
+
<div class="m-1 grid grid-cols-6" id="diagram1">
|
|
41
|
+
<div class="col-span-2">
|
|
42
|
+
<textarea id="text" class="col-span-1 m-1 border-2" cols="30" rows="200" oninput="updateCode(this.value)"></textarea>
|
|
43
|
+
</div>
|
|
44
|
+
<div class="col-span-4">
|
|
45
|
+
<pre class="zenuml">
|
|
46
|
+
|
|
47
|
+
</pre>
|
|
48
|
+
</div>
|
|
49
|
+
</div>
|
|
50
|
+
<script>
|
|
51
|
+
const editor = CodeMirror.fromTextArea(document.getElementById("text"), {
|
|
52
|
+
lineNumbers: true,
|
|
53
|
+
singleCursorHeightPerLine: false,
|
|
54
|
+
});
|
|
55
|
+
|
|
56
|
+
// implement a waitUntil function
|
|
57
|
+
function waitUntil(condition, callback) {
|
|
58
|
+
if (condition()) {
|
|
59
|
+
callback();
|
|
60
|
+
} else {
|
|
61
|
+
setTimeout(function () {
|
|
62
|
+
waitUntil(condition, callback);
|
|
63
|
+
}, 100);
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
editor.on("change", function(cm) {
|
|
68
|
+
waitUntil( () => {return window.zenUml}, () => {
|
|
69
|
+
window.zenUml.render(cm.getValue(), 'theme-default').then(r => {
|
|
70
|
+
window.parentLogger.child({module: 'index.html'}).debug('render resolved', r);
|
|
71
|
+
});
|
|
72
|
+
});
|
|
73
|
+
// write cm.getValue() to localStorage
|
|
74
|
+
localStorage.setItem('zenuml-cm-code', cm.getValue());
|
|
75
|
+
});
|
|
76
|
+
// read localStorage and set to code mirror
|
|
77
|
+
const code = localStorage.getItem('zenuml-cm-code');
|
|
78
|
+
if (code) {
|
|
79
|
+
editor.setValue(code);
|
|
80
|
+
}
|
|
81
|
+
</script>
|
|
82
|
+
<script type="module" src="src/main.ts"></script>
|
|
83
|
+
</body>
|
|
84
|
+
</html>
|
package/package.json
CHANGED
|
@@ -1,22 +1,29 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zenuml/core",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.18",
|
|
4
4
|
"private": false,
|
|
5
5
|
"repository": {
|
|
6
6
|
"url": "https://github.com/ZenUml/core.git"
|
|
7
7
|
},
|
|
8
8
|
"scripts": {
|
|
9
|
+
"dev": "vite",
|
|
9
10
|
"build:site": "vue-cli-service build",
|
|
10
|
-
"build": "
|
|
11
|
+
"build": "vite build",
|
|
11
12
|
"build:report": "vue-cli-service build --report --target lib --inline-vue --name zenuml/core ./src/core.ts",
|
|
12
|
-
"test:unit": "
|
|
13
|
-
"test
|
|
13
|
+
"test:unit": "jest",
|
|
14
|
+
"test": "vitest",
|
|
15
|
+
"test:unit:watch": "pnpm run antlr && vue-cli-service test:unit --watch",
|
|
14
16
|
"cy": "cypress run",
|
|
17
|
+
"cy:open": "cypress open",
|
|
15
18
|
"lint": "vue-cli-service lint",
|
|
16
|
-
"antlr": "
|
|
19
|
+
"antlr:setup": "python3 -m pip install antlr4-tools",
|
|
20
|
+
"antlr:generate": "pwd && cd ./src/g4-units/hello-world && antlr4 Hello.g4",
|
|
21
|
+
"antlr:javac": "pwd && cd ./src/g4-units/hello-world && CLASSPATH=\"../../../antlr/antlr-4.11.1-complete.jar:$CLASSPATH\" javac *.java",
|
|
22
|
+
"antlr:grun": "pwd && cd ./src/g4-units/hello-world && grun Hello r -tokens",
|
|
23
|
+
"antlr": "pnpm run antlr:lexer && pnpm run antlr:parser",
|
|
17
24
|
"antlr:clear": "rm -rf src/generated-parser/*",
|
|
18
|
-
"antlr:lexer": "java -Duser.dir=$(pwd)/src/g4 -cp $(pwd)/antlr/antlr-4.
|
|
19
|
-
"antlr:parser": "java -Duser.dir=$(pwd)/src/g4 -cp $(pwd)/antlr/antlr-4.
|
|
25
|
+
"antlr:lexer": "java -Duser.dir=$(pwd)/src/g4 -cp $(pwd)/antlr/antlr-4.11.1-complete.jar org.antlr.v4.Tool -o ./src/generated-parser -Dlanguage=JavaScript sequenceLexer.g4",
|
|
26
|
+
"antlr:parser": "java -Duser.dir=$(pwd)/src/g4 -cp $(pwd)/antlr/antlr-4.11.1-complete.jar org.antlr.v4.Tool -o ./src/generated-parser -Dlanguage=JavaScript sequenceParser.g4",
|
|
20
27
|
"build-crx": "vue-cli-service build --mode production --target lib --name zenuml/core ./src/index.js",
|
|
21
28
|
"start": "vue-cli-service serve",
|
|
22
29
|
"git:branch:clean:gone": "git fetch -p && git branch -vv | awk '/: gone]/{print $1}' | xargs git branch -d",
|
|
@@ -30,7 +37,7 @@
|
|
|
30
37
|
"dependencies": {
|
|
31
38
|
"@types/assert": "^1.5.4",
|
|
32
39
|
"@types/ramda": "^0.28.0",
|
|
33
|
-
"antlr4": "
|
|
40
|
+
"antlr4": "^4.11.0",
|
|
34
41
|
"color-string": "1.5.2",
|
|
35
42
|
"dom-to-image-more": "^2.9.5",
|
|
36
43
|
"file-saver": "^2.0.5",
|
|
@@ -42,53 +49,44 @@
|
|
|
42
49
|
"postcss": "^8.4.19",
|
|
43
50
|
"ramda": "^0.28.0",
|
|
44
51
|
"tailwindcss": "^3.2.4",
|
|
45
|
-
"vue": "2.
|
|
52
|
+
"vue": "2.7.14",
|
|
46
53
|
"vue-gtag": "^1.16.1",
|
|
47
|
-
"vue-template-compiler": "2.6.12",
|
|
48
54
|
"vuex": "^3.6.2"
|
|
49
55
|
},
|
|
50
56
|
"devDependencies": {
|
|
51
|
-
"@babel/
|
|
52
|
-
"@babel/
|
|
53
|
-
"@
|
|
54
|
-
"@babel/plugin-transform-arrow-functions": "^7.10.1",
|
|
55
|
-
"@babel/plugin-transform-modules-commonjs": "^7.10.1",
|
|
56
|
-
"@babel/polyfill": "^7.10.1",
|
|
57
|
-
"@babel/preset-env": "^7.13.5",
|
|
58
|
-
"@babel/runtime-corejs2": "^7.12.13",
|
|
57
|
+
"@babel/eslint-parser": "^7.19.1",
|
|
58
|
+
"@babel/preset-env": "^7.20.2",
|
|
59
|
+
"@types/antlr4": "^4.11.2",
|
|
59
60
|
"@types/color-string": "^1.5.2",
|
|
60
|
-
"@types/jest": "^
|
|
61
|
+
"@types/jest": "^27.5.2",
|
|
61
62
|
"@types/lodash": "^4.14.168",
|
|
62
63
|
"@types/node": "latest",
|
|
63
|
-
"@typescript-eslint/eslint-plugin": "^
|
|
64
|
-
"@typescript-eslint/parser": "^
|
|
65
|
-
"@vue/
|
|
66
|
-
"@vue/
|
|
67
|
-
"@vue/
|
|
68
|
-
"@vue/cli-plugin-typescript": "~5.0.8",
|
|
69
|
-
"@vue/cli-plugin-unit-jest": "~5.0.8",
|
|
70
|
-
"@vue/cli-service": "~5.0.8",
|
|
71
|
-
"@vue/eslint-config-typescript": "^5.0.2",
|
|
72
|
-
"@vue/test-utils": "^1.1.3",
|
|
73
|
-
"@vue/vue2-jest": "^29.1.1",
|
|
64
|
+
"@typescript-eslint/eslint-plugin": "^5.46.1",
|
|
65
|
+
"@typescript-eslint/parser": "^5.46.1",
|
|
66
|
+
"@vue/eslint-config-typescript": "^8.0.0",
|
|
67
|
+
"@vue/test-utils": "1.3.3",
|
|
68
|
+
"@vue/vue2-jest": "^27.0.0",
|
|
74
69
|
"autoprefixer": "^10.4.13",
|
|
75
70
|
"babel-eslint": "^10.1.0",
|
|
76
|
-
"
|
|
71
|
+
"babel-jest": "^27.5.1",
|
|
77
72
|
"cypress": "^9.4.1",
|
|
78
73
|
"cypress-plugin-snapshots": "^1.4.4",
|
|
79
|
-
"eslint": "
|
|
80
|
-
"eslint-plugin-vue": "^7.
|
|
74
|
+
"eslint": "^8.30.0",
|
|
75
|
+
"eslint-plugin-vue": "^8.7.1",
|
|
81
76
|
"global-jsdom": "^8.6.0",
|
|
82
|
-
"jest": "^27.1
|
|
77
|
+
"jest": "^27.5.1",
|
|
83
78
|
"jsdom": "^20.0.2",
|
|
84
|
-
"node-sass": "^
|
|
79
|
+
"node-sass": "^6.0.0",
|
|
85
80
|
"regenerator-runtime": "^0.13.7",
|
|
86
|
-
"sass
|
|
81
|
+
"sass": "^1.26.5",
|
|
87
82
|
"svg-url-loader": "^6.0.0",
|
|
88
83
|
"terser-webpack-plugin": "^3.0.6",
|
|
89
|
-
"ts-jest": "^27.
|
|
84
|
+
"ts-jest": "^27.1.5",
|
|
90
85
|
"typescript": "^4.7.4",
|
|
91
|
-
"
|
|
86
|
+
"vite": "^4.0.1",
|
|
87
|
+
"vite-plugin-vue2": "^2.0.2",
|
|
88
|
+
"vitest": "^0.26.1",
|
|
89
|
+
"vue-template-compiler": "^2.7.14"
|
|
92
90
|
},
|
|
93
91
|
"eslintConfig": {
|
|
94
92
|
"root": true,
|
|
@@ -125,10 +123,11 @@
|
|
|
125
123
|
"browserslist": [
|
|
126
124
|
"last 2 years"
|
|
127
125
|
],
|
|
126
|
+
"packageManager": "pnpm@7.18.1",
|
|
128
127
|
"engines": {
|
|
129
128
|
"node": ">=12.0.0"
|
|
130
129
|
},
|
|
131
130
|
"volta": {
|
|
132
|
-
"node": "
|
|
131
|
+
"node": "18.12.1"
|
|
133
132
|
}
|
|
134
133
|
}
|