sequential-workflow-designer 0.19.0 → 0.19.1
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.
- package/README.md +5 -4
- package/dist/index.umd.js +17 -10
- package/lib/cjs/index.cjs +17 -10
- package/lib/esm/index.js +17 -10
- package/lib/index.d.ts +3 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -42,6 +42,7 @@ Pro:
|
|
|
42
42
|
* [🤩 Pro Components](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/pro-components.html)
|
|
43
43
|
* [🍬 Custom Theme Flat](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/custom-theme-flat.html)
|
|
44
44
|
* [🌹 Custom Step Types](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/custom-step-types.html)
|
|
45
|
+
* [📺 Popup Editor](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/popup-editor.html)
|
|
45
46
|
* [👈 Goto](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/goto.html)
|
|
46
47
|
* [📁 Folders](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/folders.html)
|
|
47
48
|
* [⭕ Wheel Mode](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/wheel-mode.html)
|
|
@@ -98,10 +99,10 @@ Add the below code to your head section in HTML document.
|
|
|
98
99
|
```html
|
|
99
100
|
<head>
|
|
100
101
|
...
|
|
101
|
-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.
|
|
102
|
-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.
|
|
103
|
-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.
|
|
104
|
-
<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.
|
|
102
|
+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.1/css/designer.css" rel="stylesheet">
|
|
103
|
+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.1/css/designer-light.css" rel="stylesheet">
|
|
104
|
+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.1/css/designer-dark.css" rel="stylesheet">
|
|
105
|
+
<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.1/dist/index.umd.js"></script>
|
|
105
106
|
```
|
|
106
107
|
|
|
107
108
|
Call the designer by:
|
package/dist/index.umd.js
CHANGED
|
@@ -964,9 +964,10 @@
|
|
|
964
964
|
}
|
|
965
965
|
|
|
966
966
|
class CustomActionController {
|
|
967
|
-
constructor(configuration, state) {
|
|
967
|
+
constructor(configuration, state, stateModifier) {
|
|
968
968
|
this.configuration = configuration;
|
|
969
969
|
this.state = state;
|
|
970
|
+
this.stateModifier = stateModifier;
|
|
970
971
|
}
|
|
971
972
|
trigger(action, step, sequence) {
|
|
972
973
|
const handler = this.configuration.customActionHandler;
|
|
@@ -974,20 +975,26 @@
|
|
|
974
975
|
console.warn(`Custom action handler is not defined (action type: ${action.type})`);
|
|
975
976
|
return;
|
|
976
977
|
}
|
|
977
|
-
const context =
|
|
978
|
-
notifyStepNameChanged: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepNameChanged, stepId),
|
|
979
|
-
notifyStepPropertiesChanged: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepPropertyChanged, stepId),
|
|
980
|
-
notifyStepInserted: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepInserted, stepId),
|
|
981
|
-
notifyStepMoved: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepMoved, stepId),
|
|
982
|
-
notifyStepDeleted: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepDeleted, stepId)
|
|
983
|
-
};
|
|
978
|
+
const context = this.createCustomActionHandlerContext();
|
|
984
979
|
handler(action, step, sequence, context);
|
|
985
980
|
}
|
|
986
|
-
|
|
981
|
+
createCustomActionHandlerContext() {
|
|
982
|
+
return {
|
|
983
|
+
notifyStepNameChanged: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepNameChanged, stepId, false),
|
|
984
|
+
notifyStepPropertiesChanged: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepPropertyChanged, stepId, false),
|
|
985
|
+
notifyStepInserted: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepInserted, stepId, true),
|
|
986
|
+
notifyStepMoved: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepMoved, stepId, true),
|
|
987
|
+
notifyStepDeleted: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepDeleted, stepId, true)
|
|
988
|
+
};
|
|
989
|
+
}
|
|
990
|
+
notifyStepChanged(changeType, stepId, updateDependencies) {
|
|
987
991
|
if (!stepId) {
|
|
988
992
|
throw new Error('Step id is empty');
|
|
989
993
|
}
|
|
990
994
|
this.state.notifyDefinitionChanged(changeType, stepId);
|
|
995
|
+
if (updateDependencies) {
|
|
996
|
+
this.stateModifier.updateDependencies();
|
|
997
|
+
}
|
|
991
998
|
}
|
|
992
999
|
}
|
|
993
1000
|
|
|
@@ -2656,10 +2663,10 @@
|
|
|
2656
2663
|
const state = new DesignerState(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed);
|
|
2657
2664
|
const workspaceController = new WorkspaceControllerWrapper();
|
|
2658
2665
|
const behaviorController = new BehaviorController();
|
|
2659
|
-
const customActionController = new CustomActionController(configuration, state);
|
|
2660
2666
|
const stepExtensionResolver = StepExtensionResolver.create(services);
|
|
2661
2667
|
const definitionWalker = (_c = configuration.definitionWalker) !== null && _c !== void 0 ? _c : new DefinitionWalker();
|
|
2662
2668
|
const stateModifier = StateModifier.create(definitionWalker, state, configuration);
|
|
2669
|
+
const customActionController = new CustomActionController(configuration, state, stateModifier);
|
|
2663
2670
|
let historyController = undefined;
|
|
2664
2671
|
if (configuration.undoStackSize) {
|
|
2665
2672
|
historyController = HistoryController.create(configuration.undoStack, state, stateModifier, configuration);
|
package/lib/cjs/index.cjs
CHANGED
|
@@ -962,9 +962,10 @@ class ComponentContext {
|
|
|
962
962
|
}
|
|
963
963
|
|
|
964
964
|
class CustomActionController {
|
|
965
|
-
constructor(configuration, state) {
|
|
965
|
+
constructor(configuration, state, stateModifier) {
|
|
966
966
|
this.configuration = configuration;
|
|
967
967
|
this.state = state;
|
|
968
|
+
this.stateModifier = stateModifier;
|
|
968
969
|
}
|
|
969
970
|
trigger(action, step, sequence) {
|
|
970
971
|
const handler = this.configuration.customActionHandler;
|
|
@@ -972,20 +973,26 @@ class CustomActionController {
|
|
|
972
973
|
console.warn(`Custom action handler is not defined (action type: ${action.type})`);
|
|
973
974
|
return;
|
|
974
975
|
}
|
|
975
|
-
const context =
|
|
976
|
-
notifyStepNameChanged: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepNameChanged, stepId),
|
|
977
|
-
notifyStepPropertiesChanged: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepPropertyChanged, stepId),
|
|
978
|
-
notifyStepInserted: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepInserted, stepId),
|
|
979
|
-
notifyStepMoved: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepMoved, stepId),
|
|
980
|
-
notifyStepDeleted: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepDeleted, stepId)
|
|
981
|
-
};
|
|
976
|
+
const context = this.createCustomActionHandlerContext();
|
|
982
977
|
handler(action, step, sequence, context);
|
|
983
978
|
}
|
|
984
|
-
|
|
979
|
+
createCustomActionHandlerContext() {
|
|
980
|
+
return {
|
|
981
|
+
notifyStepNameChanged: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepNameChanged, stepId, false),
|
|
982
|
+
notifyStepPropertiesChanged: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepPropertyChanged, stepId, false),
|
|
983
|
+
notifyStepInserted: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepInserted, stepId, true),
|
|
984
|
+
notifyStepMoved: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepMoved, stepId, true),
|
|
985
|
+
notifyStepDeleted: (stepId) => this.notifyStepChanged(exports.DefinitionChangeType.stepDeleted, stepId, true)
|
|
986
|
+
};
|
|
987
|
+
}
|
|
988
|
+
notifyStepChanged(changeType, stepId, updateDependencies) {
|
|
985
989
|
if (!stepId) {
|
|
986
990
|
throw new Error('Step id is empty');
|
|
987
991
|
}
|
|
988
992
|
this.state.notifyDefinitionChanged(changeType, stepId);
|
|
993
|
+
if (updateDependencies) {
|
|
994
|
+
this.stateModifier.updateDependencies();
|
|
995
|
+
}
|
|
989
996
|
}
|
|
990
997
|
}
|
|
991
998
|
|
|
@@ -2471,10 +2478,10 @@ class DesignerContext {
|
|
|
2471
2478
|
const state = new DesignerState(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed);
|
|
2472
2479
|
const workspaceController = new WorkspaceControllerWrapper();
|
|
2473
2480
|
const behaviorController = new BehaviorController();
|
|
2474
|
-
const customActionController = new CustomActionController(configuration, state);
|
|
2475
2481
|
const stepExtensionResolver = StepExtensionResolver.create(services);
|
|
2476
2482
|
const definitionWalker = (_c = configuration.definitionWalker) !== null && _c !== void 0 ? _c : new sequentialWorkflowModel.DefinitionWalker();
|
|
2477
2483
|
const stateModifier = StateModifier.create(definitionWalker, state, configuration);
|
|
2484
|
+
const customActionController = new CustomActionController(configuration, state, stateModifier);
|
|
2478
2485
|
let historyController = undefined;
|
|
2479
2486
|
if (configuration.undoStackSize) {
|
|
2480
2487
|
historyController = HistoryController.create(configuration.undoStack, state, stateModifier, configuration);
|
package/lib/esm/index.js
CHANGED
|
@@ -961,9 +961,10 @@ class ComponentContext {
|
|
|
961
961
|
}
|
|
962
962
|
|
|
963
963
|
class CustomActionController {
|
|
964
|
-
constructor(configuration, state) {
|
|
964
|
+
constructor(configuration, state, stateModifier) {
|
|
965
965
|
this.configuration = configuration;
|
|
966
966
|
this.state = state;
|
|
967
|
+
this.stateModifier = stateModifier;
|
|
967
968
|
}
|
|
968
969
|
trigger(action, step, sequence) {
|
|
969
970
|
const handler = this.configuration.customActionHandler;
|
|
@@ -971,20 +972,26 @@ class CustomActionController {
|
|
|
971
972
|
console.warn(`Custom action handler is not defined (action type: ${action.type})`);
|
|
972
973
|
return;
|
|
973
974
|
}
|
|
974
|
-
const context =
|
|
975
|
-
notifyStepNameChanged: (stepId) => this.notifyStepChanged(DefinitionChangeType.stepNameChanged, stepId),
|
|
976
|
-
notifyStepPropertiesChanged: (stepId) => this.notifyStepChanged(DefinitionChangeType.stepPropertyChanged, stepId),
|
|
977
|
-
notifyStepInserted: (stepId) => this.notifyStepChanged(DefinitionChangeType.stepInserted, stepId),
|
|
978
|
-
notifyStepMoved: (stepId) => this.notifyStepChanged(DefinitionChangeType.stepMoved, stepId),
|
|
979
|
-
notifyStepDeleted: (stepId) => this.notifyStepChanged(DefinitionChangeType.stepDeleted, stepId)
|
|
980
|
-
};
|
|
975
|
+
const context = this.createCustomActionHandlerContext();
|
|
981
976
|
handler(action, step, sequence, context);
|
|
982
977
|
}
|
|
983
|
-
|
|
978
|
+
createCustomActionHandlerContext() {
|
|
979
|
+
return {
|
|
980
|
+
notifyStepNameChanged: (stepId) => this.notifyStepChanged(DefinitionChangeType.stepNameChanged, stepId, false),
|
|
981
|
+
notifyStepPropertiesChanged: (stepId) => this.notifyStepChanged(DefinitionChangeType.stepPropertyChanged, stepId, false),
|
|
982
|
+
notifyStepInserted: (stepId) => this.notifyStepChanged(DefinitionChangeType.stepInserted, stepId, true),
|
|
983
|
+
notifyStepMoved: (stepId) => this.notifyStepChanged(DefinitionChangeType.stepMoved, stepId, true),
|
|
984
|
+
notifyStepDeleted: (stepId) => this.notifyStepChanged(DefinitionChangeType.stepDeleted, stepId, true)
|
|
985
|
+
};
|
|
986
|
+
}
|
|
987
|
+
notifyStepChanged(changeType, stepId, updateDependencies) {
|
|
984
988
|
if (!stepId) {
|
|
985
989
|
throw new Error('Step id is empty');
|
|
986
990
|
}
|
|
987
991
|
this.state.notifyDefinitionChanged(changeType, stepId);
|
|
992
|
+
if (updateDependencies) {
|
|
993
|
+
this.stateModifier.updateDependencies();
|
|
994
|
+
}
|
|
988
995
|
}
|
|
989
996
|
}
|
|
990
997
|
|
|
@@ -2470,10 +2477,10 @@ class DesignerContext {
|
|
|
2470
2477
|
const state = new DesignerState(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed);
|
|
2471
2478
|
const workspaceController = new WorkspaceControllerWrapper();
|
|
2472
2479
|
const behaviorController = new BehaviorController();
|
|
2473
|
-
const customActionController = new CustomActionController(configuration, state);
|
|
2474
2480
|
const stepExtensionResolver = StepExtensionResolver.create(services);
|
|
2475
2481
|
const definitionWalker = (_c = configuration.definitionWalker) !== null && _c !== void 0 ? _c : new DefinitionWalker();
|
|
2476
2482
|
const stateModifier = StateModifier.create(definitionWalker, state, configuration);
|
|
2483
|
+
const customActionController = new CustomActionController(configuration, state, stateModifier);
|
|
2477
2484
|
let historyController = undefined;
|
|
2478
2485
|
if (configuration.undoStackSize) {
|
|
2479
2486
|
historyController = HistoryController.create(configuration.undoStack, state, stateModifier, configuration);
|
package/lib/index.d.ts
CHANGED
|
@@ -280,8 +280,10 @@ declare class ComponentContext {
|
|
|
280
280
|
declare class CustomActionController {
|
|
281
281
|
private readonly configuration;
|
|
282
282
|
private readonly state;
|
|
283
|
-
|
|
283
|
+
private readonly stateModifier;
|
|
284
|
+
constructor(configuration: DesignerConfiguration, state: DesignerState, stateModifier: StateModifier);
|
|
284
285
|
trigger(action: CustomAction, step: Step | null, sequence: Sequence): void;
|
|
286
|
+
private createCustomActionHandlerContext;
|
|
285
287
|
private notifyStepChanged;
|
|
286
288
|
}
|
|
287
289
|
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "sequential-workflow-designer",
|
|
3
3
|
"description": "Customizable no-code component for building flow-based programming applications.",
|
|
4
|
-
"version": "0.19.
|
|
4
|
+
"version": "0.19.1",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./lib/esm/index.js",
|
|
7
7
|
"types": "./lib/index.d.ts",
|