Skip to content

Commit 41549b6

Browse files
authored
0.18.0 (#106)
1 parent b1b2846 commit 41549b6

20 files changed

+89
-43
lines changed

CHANGELOG.md

+4
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
1+
## 0.18.0
2+
3+
This version fixes the problem with scrolling [#105](https://github.com/nocode-js/sequential-workflow-designer/issues/105).
4+
15
## 0.17.0
26

37
This version introduces a new argument for editor providers: `isReadonly`. Now when the designer is in the read-only mode, the editor providers can render the read-only version of the editor.

README.md

+4-4
Original file line numberDiff line numberDiff line change
@@ -96,10 +96,10 @@ Add the below code to your head section in HTML document.
9696
```html
9797
<head>
9898
...
99-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.17.0/css/designer.css" rel="stylesheet">
100-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.17.0/css/designer-light.css" rel="stylesheet">
101-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.17.0/css/designer-dark.css" rel="stylesheet">
102-
<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.17.0/dist/index.umd.js"></script>
99+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.18.0/css/designer.css" rel="stylesheet">
100+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.18.0/css/designer-light.css" rel="stylesheet">
101+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.18.0/css/designer-dark.css" rel="stylesheet">
102+
<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.18.0/dist/index.umd.js"></script>
103103
```
104104

105105
Call the designer by:

angular/designer/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "sequential-workflow-designer-angular",
33
"description": "Angular wrapper for Sequential Workflow Designer component.",
4-
"version": "0.17.0",
4+
"version": "0.18.0",
55
"author": {
66
"name": "NoCode JS",
77
"url": "https://nocode-js.com/"
@@ -15,7 +15,7 @@
1515
"peerDependencies": {
1616
"@angular/common": "12 - 16",
1717
"@angular/core": "12 - 16",
18-
"sequential-workflow-designer": "^0.17.0"
18+
"sequential-workflow-designer": "^0.18.0"
1919
},
2020
"dependencies": {
2121
"tslib": "^2.3.0"

demos/angular-app/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -26,8 +26,8 @@
2626
"@angular/platform-browser-dynamic": "^15.2.9",
2727
"@angular/router": "^15.2.9",
2828
"rxjs": "~7.8.0",
29-
"sequential-workflow-designer": "^0.17.0",
30-
"sequential-workflow-designer-angular": "^0.17.0",
29+
"sequential-workflow-designer": "^0.18.0",
30+
"sequential-workflow-designer-angular": "^0.18.0",
3131
"tslib": "^2.3.0",
3232
"zone.js": "~0.13.0"
3333
},

demos/angular-app/yarn.lock

+8-8
Original file line numberDiff line numberDiff line change
@@ -5956,17 +5956,17 @@ send@0.18.0:
59565956
range-parser "~1.2.1"
59575957
statuses "2.0.1"
59585958

5959-
sequential-workflow-designer-angular@^0.17.0:
5960-
version "0.17.0"
5961-
resolved "https://registry.yarnpkg.com/sequential-workflow-designer-angular/-/sequential-workflow-designer-angular-0.17.0.tgz#c16fc5d629180af3f9d609fc654bf2b08ced59bc"
5962-
integrity sha512-Qhs0LQRHwiLp9K4pETnVhmeeaGqe7Kv055ix7arqFi8HYYkNHga/7IWIJLVpjpk2AomM8DIpf4t2r6NrSr4jnQ==
5959+
sequential-workflow-designer-angular@^0.18.0:
5960+
version "0.18.0"
5961+
resolved "https://registry.yarnpkg.com/sequential-workflow-designer-angular/-/sequential-workflow-designer-angular-0.18.0.tgz#2646e33cb50c5854cf29dd92c2838f03449c28ee"
5962+
integrity sha512-gYxRxNP1Y8d+m9C0TmkQ0F9jcDrb1hsZVxQmLtTaJcTYTigxz0Hr0ATzhbZTbxVX1A2Gwr0apXj3oO7hpUMXhw==
59635963
dependencies:
59645964
tslib "^2.3.0"
59655965

5966-
sequential-workflow-designer@^0.17.0:
5967-
version "0.17.0"
5968-
resolved "https://registry.yarnpkg.com/sequential-workflow-designer/-/sequential-workflow-designer-0.17.0.tgz#fb126b4a45fef107ac54b041e116ddaca607e48f"
5969-
integrity sha512-RzKn99irxTqsLn84RkMp7Q6XnvVjufG3xTKUy89uSC9a4CgG0k70jL36zLXxpW7cGEjjzGK/LgIeQ9/kiUOInQ==
5966+
sequential-workflow-designer@^0.18.0:
5967+
version "0.18.0"
5968+
resolved "https://registry.yarnpkg.com/sequential-workflow-designer/-/sequential-workflow-designer-0.18.0.tgz#20833b793103096be31009fca20891d59433020a"
5969+
integrity sha512-B/jdes+Vxkjec+GRSMePQ9AtssJ1Da1yaHT1XKK1wkKbBpmBUXqYEel0C1NBVhp+JliKMMyN2rACiUlbXBHpVA==
59705970
dependencies:
59715971
sequential-workflow-model "^0.2.0"
59725972

demos/react-app/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@
66
"dependencies": {
77
"react": "^18.2.0",
88
"react-dom": "^18.2.0",
9-
"sequential-workflow-designer": "^0.17.0",
10-
"sequential-workflow-designer-react": "^0.17.0"
9+
"sequential-workflow-designer": "^0.18.0",
10+
"sequential-workflow-designer-react": "^0.18.0"
1111
},
1212
"devDependencies": {
1313
"@types/jest": "^29.2.5",

demos/svelte-app/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,8 @@
1616
"eslint": "eslint ./src --ext .ts"
1717
},
1818
"dependencies": {
19-
"sequential-workflow-designer": "^0.17.0",
20-
"sequential-workflow-designer-svelte": "^0.17.0"
19+
"sequential-workflow-designer": "^0.18.0",
20+
"sequential-workflow-designer-svelte": "^0.18.0"
2121
},
2222
"devDependencies": {
2323
"@sveltejs/adapter-static": "^2.0.3",

designer/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "sequential-workflow-designer",
33
"description": "Customizable no-code component for building flow-based programming applications.",
4-
"version": "0.17.0",
4+
"version": "0.18.0",
55
"type": "module",
66
"main": "./lib/esm/index.js",
77
"types": "./lib/index.d.ts",

designer/src/behaviors/drag-step-behavior.ts

+1-2
Original file line numberDiff line numberDiff line change
@@ -49,9 +49,8 @@ export class DragStepBehavior implements Behavior {
4949
this.draggedStepComponent.view.width === this.view.component.width &&
5050
this.draggedStepComponent.view.height === this.view.component.height;
5151
if (hasSameSize) {
52-
const scroll = new Vector(window.scrollX, window.scrollY);
5352
// Mouse cursor will be positioned on the same place as the source component.
54-
const pagePosition = this.draggedStepComponent.view.getClientPosition().add(scroll);
53+
const pagePosition = this.draggedStepComponent.view.getClientPosition();
5554
offset = position.subtract(pagePosition);
5655
}
5756
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
import { getAbsolutePosition } from './get-absolute-position';
2+
3+
describe('getAbsolutePosition', () => {
4+
it('returns correct position', () => {
5+
const el = document.createElement('div');
6+
el.style.position = 'absolute';
7+
el.style.left = '10px';
8+
el.style.top = '20px';
9+
10+
document.body.appendChild(el);
11+
12+
const position = getAbsolutePosition(el);
13+
14+
expect(position.x).toBe(10);
15+
expect(position.y).toBe(20);
16+
17+
document.body.removeChild(el);
18+
});
19+
});
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { Vector } from './vector';
2+
3+
export function getAbsolutePosition(element: Element): Vector {
4+
const rect = element.getBoundingClientRect();
5+
return new Vector(rect.x + window.scrollX, rect.y + window.scrollY);
6+
}

designer/src/core/index.ts

+1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
export * from './icons';
22
export * from './object-cloner';
33
export * from './dom';
4+
export * from './get-absolute-position';
45
export * from './vector';
56
export * from './uid';
67
export * from './simple-event';

designer/src/workspace/common-views/region-view.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { Dom } from '../../core/dom';
2+
import { getAbsolutePosition } from '../../core/get-absolute-position';
23
import { Vector } from '../../core/vector';
34
import { ClickDetails } from '../component';
45

@@ -25,8 +26,7 @@ export class RegionView {
2526
public constructor(private readonly lines: SVGLineElement[], private readonly width: number, private readonly height: number) {}
2627

2728
public getClientPosition(): Vector {
28-
const rect = this.lines[0].getBoundingClientRect();
29-
return new Vector(rect.x, rect.y);
29+
return getAbsolutePosition(this.lines[0]);
3030
}
3131

3232
public resolveClick(click: ClickDetails): boolean {

designer/src/workspace/task-step/task-step-component-view.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { Dom } from '../../core/dom';
2+
import { getAbsolutePosition } from '../../core/get-absolute-position';
23
import { Vector } from '../../core/vector';
34
import { Step } from '../../definition';
45
import { StepComponentViewContext, StepComponentViewFactory, StepContext } from '../../designer-extension';
@@ -76,8 +77,7 @@ export const createTaskStepComponentViewFactory =
7677
return !!outputView;
7778
},
7879
getClientPosition(): Vector {
79-
const r = rect.getBoundingClientRect();
80-
return new Vector(r.x, r.y);
80+
return getAbsolutePosition(rect);
8181
},
8282
resolveClick(click: ClickDetails): true | null {
8383
return g.contains(click.element) ? true : null;

designer/src/workspace/workspace-view.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { Sequence } from '../definition';
55
import { Grid, SequencePlaceIndicator } from '../designer-extension';
66
import { ComponentContext } from '../component-context';
77
import { Component } from './component';
8+
import { getAbsolutePosition } from '../core/get-absolute-position';
89

910
let lastGridPatternId = 0;
1011

@@ -90,8 +91,7 @@ export class WorkspaceView {
9091
}
9192

9293
public getCanvasPosition(): Vector {
93-
const rect = this.canvas.getBoundingClientRect();
94-
return new Vector(rect.x + window.scrollX, rect.y + window.scrollY);
94+
return getAbsolutePosition(this.canvas);
9595
}
9696

9797
public getCanvasSize(): Vector {

examples/assets/lib.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ function embedStylesheet(url) {
1919

2020
const baseUrl = isTestEnv()
2121
? '../designer'
22-
: '//cdn.jsdelivr.net/npm/sequential-workflow-designer@0.17.0';
22+
: '//cdn.jsdelivr.net/npm/sequential-workflow-designer@0.18.0';
2323

2424
embedScript(`${baseUrl}/dist/index.umd.js`);
2525
embedStylesheet(`${baseUrl}/css/designer.css`);

examples/assets/scrollable-page.js

+23-6
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,31 @@
11
/* global window, document, sequentialWorkflowDesigner */
22

3-
function createStep(name) {
3+
const uid = sequentialWorkflowDesigner.Uid.next;
4+
5+
function createTaskStep(name) {
46
return {
5-
id: sequentialWorkflowDesigner.Uid.next(),
7+
id: uid(),
68
componentType: 'task',
79
type: 'task',
810
name,
911
properties: {}
1012
};
1113
}
1214

15+
function createSwitchStep(name) {
16+
return {
17+
id: uid(),
18+
componentType: 'switch',
19+
type: 'switch',
20+
name,
21+
properties: {},
22+
branches: {
23+
true: [],
24+
false: [],
25+
}
26+
};
27+
}
28+
1329
function createEditor(text) {
1430
const editor = document.createElement('div');
1531
editor.innerText = text;
@@ -18,9 +34,10 @@ function createEditor(text) {
1834

1935
const definition = {
2036
sequence: [
21-
createStep('Save e-mail'),
22-
createStep('Read file'),
23-
createStep('Delete file'),
37+
createTaskStep('Save e-mail'),
38+
createTaskStep('Read file'),
39+
createTaskStep('Delete file'),
40+
createSwitchStep('Condition')
2441
],
2542
properties: {}
2643
};
@@ -29,7 +46,7 @@ const configuration = {
2946
groups: [
3047
{
3148
name: 'Test',
32-
steps: Array(20).fill(null).map((_, i) => createStep(`Task ${i}`))
49+
steps: Array(20).fill(null).map((_, i) => createTaskStep(`Task ${i}`))
3350
}
3451
]
3552
},

package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
"eslint": "yarn workspaces run eslint",
77
"prettier": "yarn workspaces run prettier",
88
"prettier:fix": "yarn workspaces run prettier:fix",
9-
"serve": "http-server -c-1 ./",
9+
"serve": "http-server -c-1 -a 127.0.0.1 ./",
1010
"ci": "bash .github/workflows/main.sh"
1111
},
1212
"workspaces": [

react/package.json

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "sequential-workflow-designer-react",
33
"description": "React wrapper for Sequential Workflow Designer component.",
4-
"version": "0.17.0",
4+
"version": "0.18.0",
55
"type": "module",
66
"main": "./lib/esm/index.js",
77
"types": "./lib/index.d.ts",
@@ -47,7 +47,7 @@
4747
"peerDependencies": {
4848
"react": "^18.2.0",
4949
"react-dom": "^18.2.0",
50-
"sequential-workflow-designer": "^0.17.0"
50+
"sequential-workflow-designer": "^0.18.0"
5151
},
5252
"devDependencies": {
5353
"@rollup/plugin-node-resolve": "^15.0.1",
@@ -63,7 +63,7 @@
6363
"prettier": "^2.8.2",
6464
"react": "^18.2.0",
6565
"react-dom": "^18.2.0",
66-
"sequential-workflow-designer": "^0.17.0",
66+
"sequential-workflow-designer": "^0.18.0",
6767
"rollup": "^3.18.0",
6868
"rollup-plugin-dts": "^5.2.0",
6969
"rollup-plugin-typescript2": "^0.34.1",

svelte/package.json

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
22
"name": "sequential-workflow-designer-svelte",
33
"description": "Svelte wrapper for Sequential Workflow Designer component.",
4-
"version": "0.17.0",
4+
"version": "0.18.0",
55
"license": "MIT",
66
"scripts": {
77
"prepare": "cp ../LICENSE LICENSE",
@@ -28,10 +28,10 @@
2828
],
2929
"peerDependencies": {
3030
"svelte": "^4.0.0",
31-
"sequential-workflow-designer": "^0.17.0"
31+
"sequential-workflow-designer": "^0.18.0"
3232
},
3333
"devDependencies": {
34-
"sequential-workflow-designer": "^0.17.0",
34+
"sequential-workflow-designer": "^0.18.0",
3535
"@sveltejs/adapter-static": "^2.0.3",
3636
"@sveltejs/kit": "^1.20.4",
3737
"@sveltejs/package": "^2.0.0",

0 commit comments

Comments
 (0)