@camunda/linting 0.7.1 → 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/README.md +4 -0
  2. package/assets/linting.css +17 -16
  3. package/lib/modeler/LintingAnnotations.js +13 -4
  4. package/lib/utils/error-messages.js +1 -2
  5. package/package.json +4 -4
package/README.md CHANGED
@@ -47,6 +47,10 @@ modeler.get('linting').setErrors(reports);
47
47
 
48
48
  // show error by selecting element and properties panel entry
49
49
  modeler.get('linting').showError(report);
50
+
51
+ // activate and deactivate errors on canvas
52
+ modeler.get('linting').activate();
53
+ modeler.get('linting').deactivate();
50
54
  ```
51
55
 
52
56
  ## Development
package/assets/linting.css CHANGED
@@ -1,33 +1,34 @@
1
1
  :root {
2
+ --color-grey-225-10-15: hsl(225, 10%, 15%);
3
+
2
4
  --color-red-360-100-45: hsl(360, 100%, 45%);
5
+
3
6
  --color-white: hsl(0, 0%, 100%);
4
7
 
5
- --linting-annotation-background-color: var(--color-red-360-100-45);
6
- --linting-annotation-fill-color: var(--color-white);
7
- }
8
+ --color-yellow-47-88-53: hsl(47, 88%, 53%);
8
9
 
9
- .djs-overlays:not(.selected) .bjs-linting-annotation {
10
- opacity: 0.5;
11
- }
12
-
13
- .djs-overlays.selected .bjs-linting-annotation,
14
- .djs-overlays .bjs-linting-annotation:hover {
15
- opacity: 1;
10
+ --linting-annotation-error-background-color: var(--color-red-360-100-45);
11
+ --linting-annotation-error-fill-color: var(--color-white);
12
+
13
+ --linting-annotation-warning-background-color: var(--color-yellow-47-88-53);
14
+ --linting-annotation-warning-fill-color: var(--color-white);
15
+ --linting-annotation-warning-stroke-color: var(--color-grey-225-10-15);
16
16
  }
17
17
 
18
18
  .bjs-linting-annotation {
19
19
  display: flex;
20
20
  flex-direction: row;
21
21
  align-items: center;
22
- padding: 1px;
22
+ padding: 2px;
23
23
  border-radius: 2px;
24
- background-color: var(--linting-annotation-background-color);
25
24
  cursor: default;
26
25
  z-index: 100000;
27
26
  }
28
27
 
29
- .bjs-linting-annotation > svg {
30
- fill: var(--linting-annotation-fill-color);
31
- width: 18px;
32
- height: 18px;
28
+ .bjs-linting-annotation--error {
29
+ background-color: var(--linting-annotation-error-background-color);
30
+ }
31
+
32
+ .bjs-linting-annotation--warning {
33
+ background-color: var(--linting-annotation-warning-background-color);
33
34
  }
package/lib/modeler/LintingAnnotations.js CHANGED
@@ -3,8 +3,15 @@ import { groupBy } from 'min-dash';
3
3
  import { domify } from 'min-dom';
4
4
 
5
5
  const errorSvg = `
6
- <svg viewBox="2 2 20 20">
7
- <path d="M12,5 C15.8659932,5 19,8.13400675 19,12 C19,15.8659932 15.8659932,19 12,19 C8.13400675,19 5,15.8659932 5,12 C5,8.13400675 8.13400675,5 12,5 Z M9.33333333,8 L8,9.33333333 L10.667,12 L8,14.6666667 L9.33333333,16 L12,13.333 L14.6666667,16 L16,14.6666667 L13.333,12 L16,9.33333333 L14.6666667,8 L12,10.666 L9.33333333,8 Z"></path>
6
+ <svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg">
7
+ <path d="M8 1C4.1 1 1 4.1 1 8s3.1 7 7 7 7-3.1 7-7-3.1-7-7-7Zm2.7 10.5L8 8.8l-2.7 2.7-.8-.8L7.2 8 4.5 5.3l.8-.8L8 7.2l2.7-2.7.8.8L8.8 8l2.7 2.7-.8.8Z" fill="var(--linting-annotation-error-fill-color, white)"/>
8
+ </svg>
9
+ `;
10
+
11
+ const warningSvg = `
12
+ <svg width="16" height="16" fill="none" xmlns="http://www.w3.org/2000/svg">
13
+ <path d="M12 3H4v10h8V3Z" fill="var(--linting-annotation-warning-stroke-color, black)"/>
14
+ <path d="M8 1C4.15 1 1 4.15 1 8s3.15 7 7 7 7-3.15 7-7-3.15-7-7-7Zm-.55 3h1.1v5.5h-1.1V4ZM8 12.5c-.4 0-.75-.35-.75-.75S7.6 11 8 11s.75.35.75.75-.35.75-.75.75Z" fill="var(--linting-annotation-warning-fill-color, white)"/>
8
15
  </svg>
9
16
  `;
10
17
 
@@ -40,9 +47,11 @@ export default class LintingAnnotations {
40
47
  return;
41
48
  }
42
49
 
50
+ const hasErrors = reports.find(({ category }) => category === 'error');
51
+
43
52
  const overlay = domify(`
44
- <div class="bjs-linting-annotation" title="Click to show">
45
- ${ errorSvg }
53
+ <div class="bjs-linting-annotation ${ hasErrors ? 'bjs-linting-annotation--error' : 'bjs-linting-annotation--warning' }" title="Click to show">
54
+ ${ hasErrors ? errorSvg : warningSvg }
46
55
  </div>
47
56
  `);
48
57
 
package/lib/utils/error-messages.js CHANGED
@@ -71,8 +71,7 @@ const executionPlatformLabels = {
71
71
  '1.0': 'Camunda 8 (Zeebe 1.0)',
72
72
  '1.1': 'Camunda 8 (Zeebe 1.1)',
73
73
  '1.2': 'Camunda 8 (Zeebe 1.2)',
74
- '1.3': 'Camunda 8 (Zeebe 1.3)',
75
- '8.0': 'Camunda 8'
74
+ '1.3': 'Camunda 8 (Zeebe 1.3)'
76
75
  }
77
76
  };
78
77
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@camunda/linting",
3
- "version": "0.7.1",
3
+ "version": "0.8.0",
4
4
  "description": "Linting for Camunda Platform",
5
5
  "main": "index.js",
6
6
  "scripts": {
@@ -34,9 +34,9 @@
34
34
  "zeebe-bpmn-moddle": "^0.15.0"
35
35
  },
36
36
  "devDependencies": {
37
- "@bpmn-io/properties-panel": "^0.20.2",
37
+ "@bpmn-io/properties-panel": "^0.23.0",
38
38
  "bpmn-js": "^9.4.0",
39
- "bpmn-js-properties-panel": "^1.6.1",
39
+ "bpmn-js-properties-panel": "^1.10.0",
40
40
  "chai": "^4.3.6",
41
41
  "cross-env": "^7.0.3",
42
42
  "eslint": "^8.23.1",
@@ -57,7 +57,7 @@
57
57
  "webpack": "^5.74.0"
58
58
  },
59
59
  "peerDependencies": {
60
- "bpmn-js-properties-panel": "^1.3.0"
60
+ "bpmn-js-properties-panel": ">= 1.10.0"
61
61
  },
62
62
  "peerDependenciesMeta": {
63
63
  "bpmn-js-properties-panel": {