Skip to content

Commit 4241ae9

Browse files
MatthboMatthbo
authored
Merge pull request #57 from frankframework/issue/56-update-angular-to-v21
2 parents b0dcfb6 + 4cdc880 commit 4241ae9

9 files changed

Lines changed: 2005 additions & 1809 deletions

File tree

‎package.json‎

Lines changed: 33 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -13,46 +13,46 @@
1313
},
1414
"private": true,
1515
"dependencies": {
16-
"@angular/animations": "^20.3.14",
17-
"@angular/cdk": "^20.2.14",
18-
"@angular/common": "^20.3.14",
19-
"@angular/compiler": "^20.3.14",
20-
"@angular/core": "^20.3.14",
21-
"@angular/forms": "^20.3.14",
22-
"@angular/platform-browser": "^20.3.14",
23-
"@angular/platform-browser-dynamic": "^20.3.14",
24-
"@angular/router": "^20.3.14",
25-
"@rx-angular/state": "^20.0.0",
26-
"@rx-angular/template": "^20.0.0",
27-
"rxjs": "~7.8.0",
28-
"tslib": "^2.7.0",
29-
"zone.js": "~0.15.0"
16+
"@angular/animations": "^21.0.8",
17+
"@angular/cdk": "^21.0.6",
18+
"@angular/common": "^21.0.8",
19+
"@angular/compiler": "^21.0.8",
20+
"@angular/core": "^21.0.8",
21+
"@angular/forms": "^21.0.8",
22+
"@angular/platform-browser": "^21.0.8",
23+
"@angular/platform-browser-dynamic": "^21.0.8",
24+
"@angular/router": "^21.0.8",
25+
"@rx-angular/state": "^21.0.0",
26+
"@rx-angular/template": "^21.0.0",
27+
"rxjs": "~7.8.2",
28+
"tslib": "^2.8.1",
29+
"zone.js": "~0.16.0"
3030
},
3131
"devDependencies": {
32-
"@angular-eslint/builder": "^20.2.0",
33-
"@angular-eslint/eslint-plugin": "^20.2.0",
34-
"@angular-eslint/eslint-plugin-template": "^20.2.0",
35-
"@angular-eslint/schematics": "^20.2.0",
36-
"@angular-eslint/template-parser": "^20.2.0",
37-
"@angular/build": "^20.3.12",
38-
"@angular/cli": "^20.3.12",
39-
"@angular/compiler-cli": "^20.3.14",
40-
"@types/jasmine": "~5.1.0",
41-
"@typescript-eslint/eslint-plugin": "^8.7.0",
42-
"@typescript-eslint/parser": "^8.7.0",
32+
"@angular-eslint/builder": "^21.1.0",
33+
"@angular-eslint/eslint-plugin": "^21.1.0",
34+
"@angular-eslint/eslint-plugin-template": "^21.1.0",
35+
"@angular-eslint/schematics": "^21.1.0",
36+
"@angular-eslint/template-parser": "^21.1.0",
37+
"@angular/build": "^21.0.5",
38+
"@angular/cli": "^21.0.5",
39+
"@angular/compiler-cli": "^21.0.8",
40+
"@types/jasmine": "~5.1.14",
41+
"@typescript-eslint/eslint-plugin": "^8.52.0",
42+
"@typescript-eslint/parser": "^8.52.0",
4343
"eslint": "^8.57.1",
44-
"eslint-config-prettier": "^9.1.0",
45-
"eslint-plugin-prettier": "^5.1.3",
44+
"eslint-config-prettier": "^9.1.2",
45+
"eslint-plugin-prettier": "^5.5.4",
4646
"eslint-plugin-unicorn": "^55.0.0",
47-
"jasmine-core": "^5.3.0",
47+
"jasmine-core": "^5.13.0",
4848
"karma": "^6.4.4",
4949
"karma-chrome-launcher": "~3.2.0",
50-
"karma-coverage": "~2.2.0",
50+
"karma-coverage": "~2.2.1",
5151
"karma-jasmine": "~5.1.0",
5252
"karma-jasmine-html-reporter": "~2.1.0",
53-
"ng-packagr": "^20.2.0",
54-
"prettier": "^3.2.5",
55-
"typescript": "~5.9.2"
53+
"ng-packagr": "^21.0.1",
54+
"prettier": "^3.7.4",
55+
"typescript": "~5.9.3"
5656
},
57-
"packageManager": "pnpm@10.24.0+sha512.01ff8ae71b4419903b65c60fb2dc9d34cf8bb6e06d03bde112ef38f7a34d6904c424ba66bea5cdcf12890230bf39f9580473140ed9c946fef328b6e5238a345a"
57+
"packageManager": "pnpm@10.28.0+sha512.05df71d1421f21399e053fde567cea34d446fa02c76571441bfc1c7956e98e363088982d940465fd34480d4d90a0668bc12362f8aa88000a64e83d0b0e47be48"
5858
}

‎pnpm-lock.yaml‎

Lines changed: 1773 additions & 1591 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎projects/frank-config-layout/package.json‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,13 @@
11
{
22
"name": "@frankframework/frank-config-layout",
3-
"version": "1.2.6",
3+
"version": "1.2.7",
44
"description": "Calculate a nice layout for Frank configurations",
55
"main": "master",
6-
"contributors": ["Lenard van der Maas", "Martijn Dirkse", "Vivy Booman"],
6+
"contributors": [
7+
"Lenard van der Maas",
8+
"Martijn Dirkse",
9+
"Vivy Booman"
10+
],
711
"license": "Apache-2.0",
812
"homepage": "",
913
"repository": {
@@ -12,6 +16,6 @@
1216
"directory": "projects/frank-config-layout"
1317
},
1418
"peerDependencies": {
15-
"@angular/core": "^20.2.2"
19+
"@angular/core": "^21.0.8 || ^22.0.0"
1620
}
1721
}

‎src/app/app.config.ts‎

Lines changed: 0 additions & 23 deletions
This file was deleted.

‎src/app/components/flow-chart-editor/flow-chart-editor.component.html‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,11 @@ <h2>Mermaid input</h2>
55
<textarea [(ngModel)]="mermaidText"></textarea>
66
</td>
77
<td>
8-
<button class="loadButton" *ngFor="let alg of layerNumberAlgorithms" (click)="loadMermaid(alg.key)">
9-
Load with {{ alg.value }} algorithm
10-
</button>
8+
@for (alg of layerNumberAlgorithms; track alg) {
9+
<button class="loadButton" (click)="loadMermaid(alg.key)">
10+
Load with {{ alg.value }} algorithm
11+
</button>
12+
}
1113
<button class="loadButton" (click)="resetMermaid()">
1214
Reset
1315
</button>

‎src/app/components/frank-flowchart/frank-flowchart.component.html‎

Lines changed: 75 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -1,72 +1,80 @@
11
<div class="wrapper">
22
<div id="scale-overlay">{{scale}}%</div>
3-
<svg *ngIf="drawing !== null" class="svg" xmlns="http://www.w3.org/2000/svg"
3+
@if (drawing !== null) {
4+
<svg class="svg" xmlns="http://www.w3.org/2000/svg"
45
appSvgZoomPan (newScale)="newScale($event)" preserveAspectRatio="none"
56
[attr.width]="drawing.width" [attr.height]="drawing.height" >
6-
<defs>
7-
<!-- A marker to be used as an arrowhead -->
8-
<marker
9-
id="arrow"
10-
viewBox="0 0 4 4"
11-
refX="4"
12-
refY="2"
13-
markerWidth="4"
14-
markerHeight="4"
15-
orient="auto-start-reverse">
16-
<path d="M 0 0 L 4 2 L 0 4 z" />
17-
</marker>
18-
</defs>
19-
<g *ngFor="let rectangle of drawing.rectangles" (click)="handleShapeClicked(rectangle.id)">
20-
<rect class="rectangle"
21-
[class.errorOutline]="rectangle.errorStatus === ERROR_STATUS_ERROR"
22-
[attr.x]="rectangle.x"
23-
[attr.y]="rectangle.y"
24-
[attr.width]="rectangle.width"
25-
[attr.height]="rectangle.height"
26-
id="rectangle.id"
27-
rx="5">
28-
</rect>
29-
<foreignObject
30-
[attr.x]="rectangle.x"
31-
[attr.y]="rectangle.y"
32-
[attr.width]="rectangle.width"
33-
[attr.height]="rectangle.height">
34-
<div xmlns="http://www.w3.org/1999/xhtml" class="rect-text-wrapper">
35-
<div class="rect-text-box" [innerHTML]="rectangle.text">
36-
</div>
37-
</div>
38-
</foreignObject>
39-
<rect class="rect-hover-padding"
40-
[attr.x]="rectangle.x - 5"
41-
[attr.y]="rectangle.y - 5"
42-
[attr.width]="rectangle.width + 10"
43-
[attr.height]="rectangle.height + 10"
44-
[class.selected]="rectangle.selected"
45-
rx="10">
46-
</rect>
47-
</g>
48-
<g *ngFor="let line of drawing.lines" (click)="handleShapeClicked(line.id)">
49-
<polyline class="line"
50-
attr.points="{{line.x1}},{{line.y1}} {{line.x2}},{{line.y2}}"
51-
[attr.marker-end]="line.arrow ? 'url(#arrow)' : null"
52-
id="{{line.id}}"
53-
[class.error]="line.errorStatus === ERROR_STATUS_ERROR"
54-
[class.mixed]="line.errorStatus === ERROR_STATUS_MIXED"/>
55-
<polyline class="line-hover-padding"
56-
attr.points="{{line.x1}},{{line.y1}} {{line.x2}},{{line.y2}}"
57-
[class.selected]="line.selected"/>
58-
</g>
59-
<g *ngFor="let label of drawing.edgeLabels"
60-
attr.transform="translate({{label.horizontalBox.minValue}}, {{label.verticalBox.minValue}})">
61-
<foreignObject
62-
attr.width="{{label.horizontalBox.size}}"
63-
attr.height="{{label.verticalBox.size}}">
64-
<div xmlns="http://www.w3.org/1999/xhtml" class="label-text-wrapper"
65-
[ngStyle]="{'font-size': drawing.edgeLabelFontSize + 'px'}">
66-
<div class="label-text-box" [innerHTML]="label.text.html">
67-
</div>
68-
</div>
69-
</foreignObject>
70-
</g>
71-
</svg>
7+
<defs>
8+
<!-- A marker to be used as an arrowhead -->
9+
<marker
10+
id="arrow"
11+
viewBox="0 0 4 4"
12+
refX="4"
13+
refY="2"
14+
markerWidth="4"
15+
markerHeight="4"
16+
orient="auto-start-reverse">
17+
<path d="M 0 0 L 4 2 L 0 4 z" />
18+
</marker>
19+
</defs>
20+
@for (rectangle of drawing.rectangles; track rectangle) {
21+
<g (click)="handleShapeClicked(rectangle.id)">
22+
<rect class="rectangle"
23+
[class.errorOutline]="rectangle.errorStatus === ERROR_STATUS_ERROR"
24+
[attr.x]="rectangle.x"
25+
[attr.y]="rectangle.y"
26+
[attr.width]="rectangle.width"
27+
[attr.height]="rectangle.height"
28+
id="rectangle.id"
29+
rx="5">
30+
</rect>
31+
<foreignObject
32+
[attr.x]="rectangle.x"
33+
[attr.y]="rectangle.y"
34+
[attr.width]="rectangle.width"
35+
[attr.height]="rectangle.height">
36+
<div xmlns="http://www.w3.org/1999/xhtml" class="rect-text-wrapper">
37+
<div class="rect-text-box" [innerHTML]="rectangle.text">
38+
</div>
39+
</div>
40+
</foreignObject>
41+
<rect class="rect-hover-padding"
42+
[attr.x]="rectangle.x - 5"
43+
[attr.y]="rectangle.y - 5"
44+
[attr.width]="rectangle.width + 10"
45+
[attr.height]="rectangle.height + 10"
46+
[class.selected]="rectangle.selected"
47+
rx="10">
48+
</rect>
49+
</g>
50+
}
51+
@for (line of drawing.lines; track line) {
52+
<g (click)="handleShapeClicked(line.id)">
53+
<polyline class="line"
54+
attr.points="{{line.x1}},{{line.y1}} {{line.x2}},{{line.y2}}"
55+
[attr.marker-end]="line.arrow ? 'url(#arrow)' : null"
56+
id="{{line.id}}"
57+
[class.error]="line.errorStatus === ERROR_STATUS_ERROR"
58+
[class.mixed]="line.errorStatus === ERROR_STATUS_MIXED"/>
59+
<polyline class="line-hover-padding"
60+
attr.points="{{line.x1}},{{line.y1}} {{line.x2}},{{line.y2}}"
61+
[class.selected]="line.selected"/>
62+
</g>
63+
}
64+
@for (label of drawing.edgeLabels; track label) {
65+
<g
66+
attr.transform="translate({{label.horizontalBox.minValue}}, {{label.verticalBox.minValue}})">
67+
<foreignObject
68+
attr.width="{{label.horizontalBox.size}}"
69+
attr.height="{{label.verticalBox.size}}">
70+
<div xmlns="http://www.w3.org/1999/xhtml" class="label-text-wrapper"
71+
[ngStyle]="{'font-size': drawing.edgeLabelFontSize + 'px'}">
72+
<div class="label-text-box" [innerHTML]="label.text.html">
73+
</div>
74+
</div>
75+
</foreignObject>
76+
</g>
77+
}
78+
</svg>
79+
}
7280
</div>

0 commit comments

Comments
 (0)