Skip to content

Commit f2b6cf8

Browse files
authored
Merge pull request #22 from nocode-js/develop
0.6.0.
2 parents 6f89839 + 6978c15 commit f2b6cf8

File tree

69 files changed

+1209
-1169
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

69 files changed

+1209
-1169
lines changed

CHANGELOG.md

+8
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,11 @@
1+
## 0.6.0
2+
3+
Fixed support for touchpad.
4+
5+
#### Breaking Changes
6+
7+
* Redesigned the `DesignerExtension` interface. This change increases the extensibility of the designer.
8+
19
## 0.5.4
210

311
This version introduces the first release of the [Sequential Workflow Designer for Angular](./angular/designer/) package.

README.md

+5-4
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@ Pro:
3535
* [🤩 Pro Components](https://nocode-js.github.io/sequential-workflow-designer-pro-demo/examples/webpack/public/pro-components.html)
3636
* [👈 Goto](https://nocode-js.github.io/sequential-workflow-designer-pro-demo/examples/webpack/public/goto.html)
3737
* [📁 Folders](https://nocode-js.github.io/sequential-workflow-designer-pro-demo/examples/webpack/public/folders.html)
38+
* [⭕ Wheel Mode](https://nocode-js.github.io/sequential-workflow-designer-pro-demo/examples/webpack/public/wheel-mode.html)
3839

3940
## 🚀 Installation
4041

@@ -74,10 +75,10 @@ Add the below code to your head section in HTML document.
7475
```html
7576
<head>
7677
...
77-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.5.4/css/designer.css" rel="stylesheet">
78-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.5.4/css/designer-light.css" rel="stylesheet">
79-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.5.4/css/designer-dark.css" rel="stylesheet">
80-
<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.5.4/dist/index.umd.js"></script>
78+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.6.0/css/designer.css" rel="stylesheet">
79+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.6.0/css/designer-light.css" rel="stylesheet">
80+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.6.0/css/designer-dark.css" rel="stylesheet">
81+
<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.6.0/dist/index.umd.js"></script>
8182
```
8283

8384
Call the designer by:

angular/designer/package.json

+3-3
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.5.4",
4+
"version": "0.6.0",
55
"author": "N4NO.com",
66
"license": "MIT",
77
"repository": {
@@ -11,7 +11,7 @@
1111
"peerDependencies": {
1212
"@angular/common": "^15.1.0",
1313
"@angular/core": "^15.1.0",
14-
"sequential-workflow-designer": "^0.5.4"
14+
"sequential-workflow-designer": "^0.6.0"
1515
},
1616
"dependencies": {
1717
"tslib": "^2.3.0"
@@ -27,4 +27,4 @@
2727
"angular",
2828
"angularjs"
2929
]
30-
}
30+
}

demos/angular-app/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -25,8 +25,8 @@
2525
"rxjs": "~7.8.0",
2626
"tslib": "^2.3.0",
2727
"zone.js": "~0.12.0",
28-
"sequential-workflow-designer": "^0.5.4",
29-
"sequential-workflow-designer-angular": "^0.5.4"
28+
"sequential-workflow-designer": "^0.6.0",
29+
"sequential-workflow-designer-angular": "^0.6.0"
3030
},
3131
"devDependencies": {
3232
"@angular-devkit/build-angular": "^15.1.1",

demos/angular-app/yarn.lock

+8-8
Original file line numberDiff line numberDiff line change
@@ -5090,17 +5090,17 @@ send@0.18.0:
50905090
range-parser "~1.2.1"
50915091
statuses "2.0.1"
50925092

5093-
sequential-workflow-designer-angular@^0.5.4:
5094-
version "0.5.4"
5095-
resolved "https://registry.yarnpkg.com/sequential-workflow-designer-angular/-/sequential-workflow-designer-angular-0.5.4.tgz#42373d29fc6b9c08668c38703d85a50ab41b4dbf"
5096-
integrity sha512-NKPwyiAc2sdiusqLJy+oaqbPTljouNOVEuTGmDb+lMAseLx92V0Im9HXLLoZ/TmJr9IlOFvcwhjqYuYWE5sH/Q==
5093+
sequential-workflow-designer-angular@^0.6.0:
5094+
version "0.6.0"
5095+
resolved "https://registry.yarnpkg.com/sequential-workflow-designer-angular/-/sequential-workflow-designer-angular-0.6.0.tgz#c8dd201c2da3291e70db1c0b8aae8668ee2ad5bc"
5096+
integrity sha512-b1pCvkcu+whjqDf3RDcwGgZLSTrgsQNvSDKGTQOEha2IRFU+txT0RjxtA3NrMZUYezQ+LWQwjJ0zkh04G0pyVQ==
50975097
dependencies:
50985098
tslib "^2.3.0"
50995099

5100-
sequential-workflow-designer@^0.5.4:
5101-
version "0.5.4"
5102-
resolved "https://registry.yarnpkg.com/sequential-workflow-designer/-/sequential-workflow-designer-0.5.4.tgz#0c72fcf4c2952144563070d2b1a5d250b4cfc998"
5103-
integrity sha512-tDYyV30z5XUWpBbYeVVe+UX96NcPbWMkjCJXpjPs1DIVnEi/LzdPhhGNehRFXUMLuTkTjLgvJpVs9mXa0DrcDw==
5100+
sequential-workflow-designer@^0.6.0:
5101+
version "0.6.0"
5102+
resolved "https://registry.yarnpkg.com/sequential-workflow-designer/-/sequential-workflow-designer-0.6.0.tgz#6043156611a5620ee93edccacc1f4848ba10e1b8"
5103+
integrity sha512-SvAsEUo1JejAOqAi55bNnn7SbTfksq3W3tIg806BtS+T9TlHCQwlXDQgn9CLfv8LtpOH7IvN9dAPUlbFWObtEw==
51045104

51055105
serialize-javascript@^6.0.0:
51065106
version "6.0.1"

demos/react-app/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@
55
"dependencies": {
66
"react": "^18.2.0",
77
"react-dom": "^18.2.0",
8-
"sequential-workflow-designer": "^0.5.4",
9-
"sequential-workflow-designer-react": "^0.5.4"
8+
"sequential-workflow-designer": "^0.6.0",
9+
"sequential-workflow-designer-react": "^0.6.0"
1010
},
1111
"devDependencies": {
1212
"@types/jest": "^29.2.5",

demos/react-app/yarn.lock

+8-8
Original file line numberDiff line numberDiff line change
@@ -7824,18 +7824,18 @@ send@0.18.0:
78247824
range-parser "~1.2.1"
78257825
statuses "2.0.1"
78267826

7827-
sequential-workflow-designer-react@^0.5.4:
7828-
version "0.5.4"
7829-
resolved "https://registry.yarnpkg.com/sequential-workflow-designer-react/-/sequential-workflow-designer-react-0.5.4.tgz#b54ce9bb74878e9001ac12f2cc9574cde27ee8af"
7830-
integrity sha512-xMfaZvULDvxGWCsJzcG5AsHneGyJgOSZG+CS7ncmydlKaetgPeS+3XXXdmliesBw66uPXQafS0HLdv4JO4CozA==
7827+
sequential-workflow-designer-react@^0.6.0:
7828+
version "0.6.0"
7829+
resolved "https://registry.yarnpkg.com/sequential-workflow-designer-react/-/sequential-workflow-designer-react-0.6.0.tgz#b2d166e0ddf24cd87032e039b9c2fe80fdc6001d"
7830+
integrity sha512-M0JaslaUOXlxsOUJKKBQLiKmypF59QkLFsYJ19icnneBeK7PnyrOFDfZkbK8sEC8PbqBz1ZhBrMspMjE4LQH8A==
78317831
dependencies:
78327832
react "^18.2.0"
78337833
react-dom "^18.2.0"
78347834

7835-
sequential-workflow-designer@^0.5.4:
7836-
version "0.5.4"
7837-
resolved "https://registry.yarnpkg.com/sequential-workflow-designer/-/sequential-workflow-designer-0.5.4.tgz#0c72fcf4c2952144563070d2b1a5d250b4cfc998"
7838-
integrity sha512-tDYyV30z5XUWpBbYeVVe+UX96NcPbWMkjCJXpjPs1DIVnEi/LzdPhhGNehRFXUMLuTkTjLgvJpVs9mXa0DrcDw==
7835+
sequential-workflow-designer@^0.6.0:
7836+
version "0.6.0"
7837+
resolved "https://registry.yarnpkg.com/sequential-workflow-designer/-/sequential-workflow-designer-0.6.0.tgz#6043156611a5620ee93edccacc1f4848ba10e1b8"
7838+
integrity sha512-SvAsEUo1JejAOqAi55bNnn7SbTfksq3W3tIg806BtS+T9TlHCQwlXDQgn9CLfv8LtpOH7IvN9dAPUlbFWObtEw==
78397839

78407840
serialize-javascript@^4.0.0:
78417841
version "4.0.0"

designer/css/designer-dark.css

-19
Original file line numberDiff line numberDiff line change
@@ -49,25 +49,6 @@
4949
background: #D3D3D3;
5050
}
5151

52-
/* dark > .sqd-path-bar */
53-
54-
.sqd-theme-dark .sqd-path-bar {
55-
background: #3F3F3F;
56-
color: #FFF;
57-
}
58-
.sqd-theme-dark .sqd-path-bar-item:hover {
59-
border-color: #D3D3D3;
60-
}
61-
.sqd-theme-dark .sqd-path-bar-reset-button {
62-
border: 1px solid transparent;
63-
}
64-
.sqd-theme-dark .sqd-path-bar-reset-button .sqd-icon-path {
65-
fill: #FFF;
66-
}
67-
.sqd-theme-dark .sqd-path-bar-reset-button:hover {
68-
border-color: #D3D3D3;
69-
}
70-
7152
/* dark > .sqd-workspace */
7253

7354
.sqd-theme-dark .sqd-grid-path {

designer/css/designer-light.css

-19
Original file line numberDiff line numberDiff line change
@@ -47,25 +47,6 @@
4747
fill: #E01A24;
4848
}
4949

50-
/* light > .sqd-path-bar */
51-
52-
.sqd-theme-light .sqd-path-bar {
53-
background: #FFF;
54-
box-shadow: 0 0 8px rgba(0, 0, 0, .15), 0 2px 4px rgba(0, 0, 0, .15);
55-
}
56-
.sqd-theme-light .sqd-path-bar-item:hover {
57-
border-color: #939393;
58-
}
59-
.sqd-theme-light .sqd-path-bar-separator {
60-
color: #D0D0D0;
61-
}
62-
.sqd-theme-light .sqd-path-bar-reset-button {
63-
border: 1px solid transparent;
64-
}
65-
.sqd-theme-light .sqd-path-bar-reset-button:hover {
66-
border-color: #939393;
67-
}
68-
6950
/* light > .sqd-workspace */
7051

7152
.sqd-theme-light .sqd-grid-path {

designer/css/designer.css

-40
Original file line numberDiff line numberDiff line change
@@ -145,46 +145,6 @@
145145
opacity: .2;
146146
}
147147

148-
/* .sqd-path-bar */
149-
150-
.sqd-path-bar {
151-
position: absolute;
152-
bottom: 68px;
153-
padding: 4px;
154-
left: 10px;
155-
z-index: 20;
156-
border-radius: 10px;
157-
}
158-
.sqd-path-bar-reset-button {
159-
display: inline-block;
160-
vertical-align: middle;
161-
width: 26px;
162-
height: 26px;
163-
border-radius: 5px;
164-
cursor: pointer;
165-
}
166-
.sqd-path-bar-reset-button-icon {
167-
width: 20px;
168-
height: 20px;
169-
margin: 3px 0 0 3px;
170-
}
171-
.sqd-path-bar-items {
172-
margin-left: 2px;
173-
display: inline-block;
174-
vertical-align: middle;
175-
}
176-
.sqd-path-bar-item {
177-
display: inline-block;
178-
padding: 6px;
179-
border-radius: 5px;
180-
cursor: pointer;
181-
border: 1px solid transparent;
182-
}
183-
.sqd-path-bar-separator {
184-
display: inline-block;
185-
padding: 0 2px;
186-
}
187-
188148
/* .sqd-workspace */
189149

190150
.sqd-workspace {

designer/package.json

+5-5
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.5.4",
4+
"version": "0.6.0",
55
"main": "./lib/index.mjs",
66
"types": "./lib/index.d.ts",
77
"repository": {
@@ -41,10 +41,10 @@
4141
"karma-spec-reporter": "^0.0.36",
4242
"karma-typescript": "^5.5.3",
4343
"prettier": "^2.8.2",
44-
"rollup": "^3.7.5",
45-
"rollup-plugin-dts": "^5.0.0",
44+
"rollup": "^3.13.0",
45+
"rollup-plugin-dts": "^5.1.1",
4646
"rollup-plugin-typescript2": "^0.34.1",
47-
"typescript": "^4.9.4"
47+
"typescript": "^4.9.5"
4848
},
4949
"keywords": [
5050
"workflow",
@@ -54,4 +54,4 @@
5454
"lowcode",
5555
"flow"
5656
]
57-
}
57+
}

designer/src/behaviors/click-behavior-resolver.ts

+3-7
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,14 @@
11
import { Vector } from '../core';
22
import { DesignerContext } from '../designer-context';
33
import { DesignerState } from '../designer-state';
4-
import { ClickBehaviorType, ClickDetails, Component, ComponentContext } from '../workspace';
4+
import { ClickBehaviorType, ClickDetails, Component } from '../workspace';
55
import { Behavior } from './behavior';
66
import { MoveViewPortBehavior } from './move-view-port-behavior';
77
import { OpenFolderBehavior } from './open-folder-behavior';
88
import { SelectStepBehavior } from './select-step-behavior';
99

1010
export class ClickBehaviorResolver {
11-
public constructor(
12-
private readonly designerContext: DesignerContext,
13-
private readonly componentContext: ComponentContext,
14-
private readonly state: DesignerState
15-
) {}
11+
public constructor(private readonly designerContext: DesignerContext, private readonly state: DesignerState) {}
1612

1713
public resolve(rootComponent: Component, element: Element, position: Vector, forceDisableDrag: boolean): Behavior {
1814
const click: ClickDetails = {
@@ -29,7 +25,7 @@ export class ClickBehaviorResolver {
2925
switch (result.action.type) {
3026
case ClickBehaviorType.selectStep: {
3127
const isDragDisabled = forceDisableDrag || this.state.isDragDisabled;
32-
return SelectStepBehavior.create(result.component, isDragDisabled, this.designerContext, this.componentContext);
28+
return SelectStepBehavior.create(result.component, isDragDisabled, this.designerContext);
3329
}
3430

3531
case ClickBehaviorType.openFolder:

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

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { createComponentContextStub, createDesignerConfigurationStub, createStepStub } from '../test-tools/stubs';
1+
import { createDesignerConfigurationStub, createComponentContextStub, createStepStub } from '../test-tools/stubs';
22
import { DragStepView } from './drag-step-behavior-view';
33

44
describe('DragStepView', () => {

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

+2-8
Original file line numberDiff line numberDiff line change
@@ -8,16 +8,10 @@ import { PlaceholderFinder } from './placeholder-finder';
88
import { DesignerState } from '../designer-state';
99
import { DefinitionModifier } from '../definition-modifier';
1010
import { WorkspaceController } from '../workspace/workspace-controller';
11-
import { ComponentContext } from '../workspace/component-context';
1211

1312
export class DragStepBehavior implements Behavior {
14-
public static create(
15-
designerContext: DesignerContext,
16-
componentContext: ComponentContext,
17-
step: Step,
18-
draggedStepComponent?: StepComponent
19-
): DragStepBehavior {
20-
const view = DragStepView.create(step, designerContext.configuration, componentContext);
13+
public static create(designerContext: DesignerContext, step: Step, draggedStepComponent?: StepComponent): DragStepBehavior {
14+
const view = DragStepView.create(step, designerContext.configuration, designerContext.componentContext);
2115
return new DragStepBehavior(
2216
view,
2317
designerContext.workspaceController,

designer/src/behaviors/move-view-port-behavior.ts

+1-2
Original file line numberDiff line numberDiff line change
@@ -21,9 +21,8 @@ export class MoveViewPortBehavior implements Behavior {
2121
}
2222

2323
public onMove(delta: Vector) {
24-
const newPosition = this.startPosition.subtract(delta);
2524
this.state.setViewPort({
26-
position: newPosition,
25+
position: this.startPosition.subtract(delta),
2726
scale: this.state.viewPort.scale
2827
});
2928
}

designer/src/behaviors/select-step-behavior.spec.ts

+2-3
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { createComponentContextStub, createDesignerContextStub, createStepStub } from '../test-tools/stubs';
1+
import { createDesignerContextStub, createStepStub } from '../test-tools/stubs';
22
import { StepComponent } from '../workspace/component';
33
import { SelectStepBehavior } from './select-step-behavior';
44

@@ -11,10 +11,9 @@ describe('SelectStepBehavior', () => {
1111
step
1212
});
1313
const designerContext = createDesignerContextStub();
14-
const componentContext = createComponentContextStub();
1514
designerContext.state.onSelectedStepIdChanged.subscribe(s => (selectedStepId = s));
1615

17-
const behavior = SelectStepBehavior.create(stepComponent, false, designerContext, componentContext);
16+
const behavior = SelectStepBehavior.create(stepComponent, false, designerContext);
1817

1918
behavior.onStart();
2019
behavior.onEnd(false);

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

+3-11
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import { Vector } from '../core/vector';
22
import { DesignerContext } from '../designer-context';
33
import { DesignerState } from '../designer-state';
44
import { StepComponent } from '../workspace/component';
5-
import { ComponentContext } from '../workspace/component-context';
65
import { Behavior } from './behavior';
76
import { DragStepBehavior } from './drag-step-behavior';
87
import { MoveViewPortBehavior } from './move-view-port-behavior';
@@ -11,17 +10,15 @@ export class SelectStepBehavior implements Behavior {
1110
public static create(
1211
pressedStepComponent: StepComponent,
1312
isDragDisabled: boolean,
14-
designerContext: DesignerContext,
15-
componentContext: ComponentContext
13+
designerContext: DesignerContext
1614
): SelectStepBehavior {
17-
return new SelectStepBehavior(pressedStepComponent, isDragDisabled, designerContext, componentContext, designerContext.state);
15+
return new SelectStepBehavior(pressedStepComponent, isDragDisabled, designerContext, designerContext.state);
1816
}
1917

2018
private constructor(
2119
private readonly pressedStepComponent: StepComponent,
2220
private readonly isDragDisabled: boolean,
2321
private readonly designerContext: DesignerContext,
24-
private readonly componentContext: ComponentContext,
2522
private readonly state: DesignerState
2623
) {}
2724

@@ -34,12 +31,7 @@ export class SelectStepBehavior implements Behavior {
3431
const canDrag = !this.state.isReadonly && !this.isDragDisabled;
3532
if (canDrag) {
3633
this.state.setSelectedStepId(null);
37-
return DragStepBehavior.create(
38-
this.designerContext,
39-
this.componentContext,
40-
this.pressedStepComponent.step,
41-
this.pressedStepComponent
42-
);
34+
return DragStepBehavior.create(this.designerContext, this.pressedStepComponent.step, this.pressedStepComponent);
4335
} else {
4436
return MoveViewPortBehavior.create(this.state, false);
4537
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import { ControlBarExtension } from './control-bar-extension';
2+
3+
describe('ControlBarExtension', () => {
4+
it('can create an instance', () => {
5+
const extension = new ControlBarExtension();
6+
expect(extension).toBeDefined();
7+
});
8+
});

0 commit comments

Comments
 (0)