Skip to content

Commit e822067

Browse files
b4rtazb4rtaz
committed
0.33.0.
1 parent a380871 commit e822067

File tree

14 files changed

+63
-29
lines changed

14 files changed

+63
-29
lines changed

‎CHANGELOG.md‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,22 @@
1+
# 0.33.0
2+
3+
This version introduces a new restriction callback: `canUnselectStep`. You can now prevent a step from being unselected based on your custom logic. When an unselection is blocked, the `onStepUnselectionBlocked` event is triggered.
4+
5+
```ts
6+
const configuration = {
7+
steps: {
8+
canUnselectStep: (step, parentSequence) => {
9+
return areChangesSaved() === true;
10+
},
11+
},
12+
// ...
13+
};
14+
15+
designer.onStepUnselectionBlocked((targetStepId) => { /* ... */ });
16+
```
17+
18+
Please note that you should NOT use `window.confirm()` or other blocking functions inside the `canUnselectStep` callback, as this callback may be invoked multiple times during drag operations. To handle this correctly, implement your own UI logic to notify the user about any required actions before unselection can proceed. Please check [this example](https://nocode-js.github.io/sequential-workflow-designer/react-app/#save-required-editor).
19+
120
# 0.32.0
221

322
This introduces internal changes related to the dragged component.

‎README.md‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -106,10 +106,10 @@ Add the below code to your head section in HTML document.
106106
```html
107107
<head>
108108
...
109-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.32.0/css/designer.css" rel="stylesheet">
110-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.32.0/css/designer-light.css" rel="stylesheet">
111-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.32.0/css/designer-dark.css" rel="stylesheet">
112-
<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.32.0/dist/index.umd.js"></script>
109+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.33.0/css/designer.css" rel="stylesheet">
110+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.33.0/css/designer-light.css" rel="stylesheet">
111+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.33.0/css/designer-dark.css" rel="stylesheet">
112+
<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.33.0/dist/index.umd.js"></script>
113113
```
114114

115115
Call the designer by:

‎angular/designer/package.json‎

Lines changed: 2 additions & 2 deletions
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.32.0",
4+
"version": "0.33.0",
55
"author": {
66
"name": "NoCode JS",
77
"url": "https://nocode-js.com/"
@@ -15,7 +15,7 @@
1515
"peerDependencies": {
1616
"@angular/common": "12 - 19",
1717
"@angular/core": "12 - 19",
18-
"sequential-workflow-designer": "^0.32.0"
18+
"sequential-workflow-designer": "^0.33.0"
1919
},
2020
"dependencies": {
2121
"tslib": "^2.3.0"

‎angular/designer/src/designer.component.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -113,6 +113,8 @@ export class DesignerComponent implements AfterViewInit, OnChanges, OnDestroy {
113113
@Output()
114114
public readonly onSelectedStepIdChanged = new EventEmitter<string | null>();
115115
@Output()
116+
public readonly onStepUnselectionBlocked = new EventEmitter<string | null>();
117+
@Output()
116118
public readonly onIsToolboxCollapsedChanged = new EventEmitter<boolean>();
117119
@Output()
118120
public readonly onIsEditorCollapsedChanged = new EventEmitter<boolean>();
@@ -243,6 +245,9 @@ export class DesignerComponent implements AfterViewInit, OnChanges, OnDestroy {
243245
designer.onSelectedStepIdChanged.subscribe(stepId => {
244246
this.ngZone.run(() => this.onSelectedStepIdChanged.emit(stepId));
245247
});
248+
designer.onStepUnselectionBlocked.subscribe(targetStepId => {
249+
this.ngZone.run(() => this.onStepUnselectionBlocked.emit(targetStepId));
250+
});
246251
designer.onIsToolboxCollapsedChanged.subscribe(isCollapsed => {
247252
this.ngZone.run(() => this.onIsToolboxCollapsedChanged.emit(isCollapsed));
248253
});

‎demos/angular-app/package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,8 +26,8 @@
2626
"@angular/platform-browser-dynamic": "^17.3.9",
2727
"@angular/router": "^17.3.9",
2828
"rxjs": "~7.8.0",
29-
"sequential-workflow-designer": "^0.32.0",
30-
"sequential-workflow-designer-angular": "^0.32.0",
29+
"sequential-workflow-designer": "^0.33.0",
30+
"sequential-workflow-designer-angular": "^0.33.0",
3131
"tslib": "^2.3.0",
3232
"zone.js": "~0.14.6"
3333
},

‎demos/react-app/package.json‎

Lines changed: 2 additions & 2 deletions
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.32.0",
10-
"sequential-workflow-designer-react": "^0.32.0"
9+
"sequential-workflow-designer": "^0.33.0",
10+
"sequential-workflow-designer-react": "^0.33.0"
1111
},
1212
"devDependencies": {
1313
"@types/jest": "^29.2.5",

‎demos/react-app/src/saveRequiredEditor/SaveRequiredEditor.tsx‎

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { useMemo, useState } from 'react';
1+
import { useEffect, useMemo, useState } from 'react';
22
import { Definition, Step, StepsConfiguration, Uid } from 'sequential-workflow-designer';
33
import { SequentialWorkflowDesigner, wrapDefinition, WrappedDefinition } from 'sequential-workflow-designer-react';
44
import { StepEditor } from './StepEditor';
@@ -38,6 +38,20 @@ export function SaveRequiredEditor() {
3838
[changeController]
3939
);
4040

41+
useEffect(() => {
42+
if (isUnselectionBlocked) {
43+
let to: ReturnType<typeof setTimeout> | null = setTimeout(() => {
44+
setIsUnselectionBlocked(false);
45+
to = null;
46+
}, 2000);
47+
return () => {
48+
if (to) {
49+
clearTimeout(to);
50+
}
51+
};
52+
}
53+
}, [isUnselectionBlocked]);
54+
4155
function onDefinitionChange(definition: WrappedDefinition) {
4256
setDefinition(definition);
4357
if (changeController.isChanged) {
@@ -48,7 +62,6 @@ export function SaveRequiredEditor() {
4862
function onStepUnselectionBlocked() {
4963
if (!isUnselectionBlocked) {
5064
setIsUnselectionBlocked(true);
51-
setTimeout(() => setIsUnselectionBlocked(false), 2500);
5265
}
5366
}
5467

‎demos/svelte-app/package.json‎

Lines changed: 2 additions & 2 deletions
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.32.0",
20-
"sequential-workflow-designer-svelte": "^0.32.0"
19+
"sequential-workflow-designer": "^0.33.0",
20+
"sequential-workflow-designer-svelte": "^0.33.0"
2121
},
2222
"devDependencies": {
2323
"@sveltejs/adapter-static": "^2.0.3",

‎designer/package.json‎

Lines changed: 1 addition & 1 deletion
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.32.0",
4+
"version": "0.33.0",
55
"type": "module",
66
"main": "./lib/esm/index.js",
77
"types": "./lib/index.d.ts",

‎examples/assets/lib.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ function embedStylesheet(url) {
1313
document.write(`<link href="${url}" rel="stylesheet">`);
1414
}
1515

16-
const baseUrl = isTestEnv() ? '../designer' : '//cdn.jsdelivr.net/npm/sequential-workflow-designer@0.32.0';
16+
const baseUrl = isTestEnv() ? '../designer' : '//cdn.jsdelivr.net/npm/sequential-workflow-designer@0.33.0';
1717

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

0 commit comments

Comments
 (0)