sequential-workflow-designer 0.36.0 → 0.37.0
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 +65 -64
- package/dist/index.umd.js +61 -34
- package/lib/cjs/index.cjs +61 -34
- package/lib/esm/index.js +61 -34
- package/lib/index.d.ts +29 -9
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -4,16 +4,16 @@
|
|
|
4
4
|
|
|
5
5
|
[](https://actions-badge.atrox.dev/b4rtaz/sequential-workflow-designer/goto?ref=main) [](/LICENSE) [](https://npmjs.org/package/sequential-workflow-designer)
|
|
6
6
|
|
|
7
|
-
Sequential workflow designer with
|
|
7
|
+
Sequential workflow designer with no external dependencies for web applications. It is written in pure TypeScript and uses SVG for rendering. This designer is not associated with any workflow engine, it is fully generic. You can use it to create any kind of application, from graphical programming languages to workflow builders.
|
|
8
8
|
|
|
9
9
|
Features:
|
|
10
10
|
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
11
|
+
- No external dependencies
|
|
12
|
+
- Fully generic and configurable
|
|
13
|
+
- Supports light, dark, and soft themes, with easy customization
|
|
14
|
+
- Compatible with modern browsers and mobile devices
|
|
15
|
+
- Definitions are stored as JSON
|
|
16
|
+
- Supports [Angular](./angular/designer/), [React](./react/) and [Svelte](./svelte/).
|
|
17
17
|
|
|
18
18
|
📝 Check the [documentation](https://nocode-js.com/docs/category/sequential-workflow-designer) for more details.
|
|
19
19
|
|
|
@@ -21,51 +21,51 @@ Features:
|
|
|
21
21
|
|
|
22
22
|
## 👀 Examples
|
|
23
23
|
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
24
|
+
- [⏩ Live Testing](https://nocode-js.github.io/sequential-workflow-designer/examples/live-testing.html)
|
|
25
|
+
- [💥 Triggers](https://nocode-js.github.io/sequential-workflow-designer/examples/triggers.html)
|
|
26
|
+
- [❎ Fullscreen](https://nocode-js.github.io/sequential-workflow-designer/examples/fullscreen.html)
|
|
27
|
+
- [🌅 Image Filter](https://nocode-js.github.io/sequential-workflow-designer/examples/image-filter.html)
|
|
28
|
+
- [🔴 Particles](https://nocode-js.github.io/sequential-workflow-designer/examples/particles.html)
|
|
29
|
+
- [🌍 Internationalization](https://nocode-js.github.io/sequential-workflow-designer/examples/i18n.html)
|
|
30
|
+
- [⛅ Light Dark](https://nocode-js.github.io/sequential-workflow-designer/examples/light-dark.html)
|
|
31
|
+
- [🤖 Code Generator](https://nocode-js.github.io/sequential-workflow-designer/examples/code-generator.html)
|
|
32
|
+
- [🌻 Rendering Test](https://nocode-js.github.io/sequential-workflow-designer/examples/rendering-test.html)
|
|
33
|
+
- [🚄 Stress Test](https://nocode-js.github.io/sequential-workflow-designer/examples/stress-test.html)
|
|
34
|
+
- [🚪 Editing Restrictions](https://nocode-js.github.io/sequential-workflow-designer/examples/editing-restrictions.html)
|
|
35
|
+
- [📜 Scrollable Page](https://nocode-js.github.io/sequential-workflow-designer/examples/scrollable-page.html)
|
|
36
|
+
- [🌵 Multi-Conditional Switch](https://nocode-js.github.io/sequential-workflow-designer/examples/multi-conditional-switch.html)
|
|
37
|
+
- [🌀 Auto-Select](https://nocode-js.github.io/sequential-workflow-designer/examples/auto-select.html)
|
|
38
|
+
- [Angular Demo](https://nocode-js.github.io/sequential-workflow-designer/angular-app/)
|
|
39
|
+
- [React Demo](https://nocode-js.github.io/sequential-workflow-designer/react-app/)
|
|
40
|
+
- [Svelte Demo](https://nocode-js.github.io/sequential-workflow-designer/svelte-app/)
|
|
41
41
|
|
|
42
42
|
Pro:
|
|
43
43
|
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
44
|
+
- [🤩 Pro Components](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/pro-components.html)
|
|
45
|
+
- [🍬 Custom Theme Flat](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/custom-theme-flat.html)
|
|
46
|
+
- [🌹 Custom Step Types](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/custom-step-types.html)
|
|
47
|
+
- [📺 Popup Editor](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/popup-editor.html)
|
|
48
|
+
- [🔽 Collapsible Region](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/collapsible-region.html)
|
|
49
|
+
- [💼 Copy Paste](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/copy-paste.html)
|
|
50
|
+
- [👈 Goto](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/goto.html)
|
|
51
|
+
- [📁 Folders](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/folders.html)
|
|
52
|
+
- [⭕ Wheel Mode](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/wheel-mode.html)
|
|
53
|
+
- [💠 Grid](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/grid.html)
|
|
54
|
+
- [🐭 Minimal Root Component](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/minimal-root-component.html)
|
|
55
|
+
- [🦁 External UI Components](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/external-ui-components.html)
|
|
56
|
+
- [👋 Custom Dragged Component](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/custom-dragged-component.html)
|
|
57
|
+
- [🔰 Badges](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/badges.html)
|
|
58
|
+
- [🎩 Custom Viewport](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/custom-viewport.html)
|
|
59
|
+
- [👊 Double Click](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/double-click.html)
|
|
60
|
+
- [🛎 Clickable Placeholder](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/clickable-placeholder.html)
|
|
61
|
+
- [📮 Conditional Placeholders](https://nocode-js.com/examples/sequential-workflow-designer-pro/webpack-pro-app/public/conditional-placeholders.html)
|
|
62
|
+
- [React Pro Demo](https://nocode-js.com/examples/sequential-workflow-designer-pro/react-pro-app/build/index.html)
|
|
63
|
+
- [Angular Pro Demo](https://nocode-js.com/examples/sequential-workflow-designer-pro/angular-pro-app/angular-app/index.html)
|
|
64
64
|
|
|
65
65
|
## 👩💻 Integrations
|
|
66
66
|
|
|
67
|
-
|
|
68
|
-
|
|
67
|
+
- [⛽ Sequential Workflow Editor](https://github.com/nocode-js/sequential-workflow-editor) - Powerful step editor builder. Don't write step editors manually, build them.
|
|
68
|
+
- [🚚 Sequential Workflow Machine](https://github.com/nocode-js/sequential-workflow-machine) - Workflow engine for browser and NodeJS apps, powered by the xstate library.
|
|
69
69
|
|
|
70
70
|
## 🚀 Installation
|
|
71
71
|
|
|
@@ -105,11 +105,12 @@ Add the below code to your head section in HTML document.
|
|
|
105
105
|
|
|
106
106
|
```html
|
|
107
107
|
<head>
|
|
108
|
-
...
|
|
109
|
-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.
|
|
110
|
-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.
|
|
111
|
-
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.
|
|
112
|
-
<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.
|
|
108
|
+
...
|
|
109
|
+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.37.0/css/designer.css" rel="stylesheet" />
|
|
110
|
+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.37.0/css/designer-light.css" rel="stylesheet" />
|
|
111
|
+
<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.37.0/css/designer-dark.css" rel="stylesheet" />
|
|
112
|
+
<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.37.0/dist/index.umd.js"></script>
|
|
113
|
+
</head>
|
|
113
114
|
```
|
|
114
115
|
|
|
115
116
|
Call the designer by:
|
|
@@ -129,12 +130,12 @@ const placeholder = document.getElementById('placeholder');
|
|
|
129
130
|
|
|
130
131
|
const definition = {
|
|
131
132
|
properties: {
|
|
132
|
-
|
|
133
|
+
myProperty: 'my-value',
|
|
133
134
|
// root properties...
|
|
134
135
|
},
|
|
135
136
|
sequence: [
|
|
136
137
|
// steps...
|
|
137
|
-
]
|
|
138
|
+
],
|
|
138
139
|
};
|
|
139
140
|
|
|
140
141
|
const configuration = {
|
|
@@ -156,7 +157,7 @@ const configuration = {
|
|
|
156
157
|
return step.properties['isDeletable'];
|
|
157
158
|
},
|
|
158
159
|
isDuplicable: (step, parentSequence) => {
|
|
159
|
-
|
|
160
|
+
return true;
|
|
160
161
|
},
|
|
161
162
|
canInsertStep: (step, targetSequence, targetIndex) => {
|
|
162
163
|
return targetSequence.length < 5;
|
|
@@ -166,7 +167,7 @@ const configuration = {
|
|
|
166
167
|
},
|
|
167
168
|
canDeleteStep: (step, parentSequence) => {
|
|
168
169
|
return step.name !== 'x';
|
|
169
|
-
}
|
|
170
|
+
},
|
|
170
171
|
},
|
|
171
172
|
|
|
172
173
|
validator: {
|
|
@@ -175,9 +176,9 @@ const configuration = {
|
|
|
175
176
|
step: (step, parentSequence, definition) => {
|
|
176
177
|
return /^[a-z]+$/.test(step.name);
|
|
177
178
|
},
|
|
178
|
-
root:
|
|
179
|
+
root: definition => {
|
|
179
180
|
return definition.properties['memory'] > 256;
|
|
180
|
-
}
|
|
181
|
+
},
|
|
181
182
|
},
|
|
182
183
|
|
|
183
184
|
toolbox: {
|
|
@@ -187,15 +188,15 @@ const configuration = {
|
|
|
187
188
|
name: 'Files',
|
|
188
189
|
steps: [
|
|
189
190
|
// steps for the toolbox's group
|
|
190
|
-
]
|
|
191
|
+
],
|
|
191
192
|
},
|
|
192
193
|
{
|
|
193
194
|
name: 'Notification',
|
|
194
195
|
steps: [
|
|
195
196
|
// steps for the toolbox's group
|
|
196
|
-
]
|
|
197
|
-
}
|
|
198
|
-
]
|
|
197
|
+
],
|
|
198
|
+
},
|
|
199
|
+
],
|
|
199
200
|
},
|
|
200
201
|
|
|
201
202
|
editors: {
|
|
@@ -209,7 +210,7 @@ const configuration = {
|
|
|
209
210
|
const editor = document.createElement('div');
|
|
210
211
|
// ...
|
|
211
212
|
return editor;
|
|
212
|
-
}
|
|
213
|
+
},
|
|
213
214
|
},
|
|
214
215
|
|
|
215
216
|
controlBar: true,
|
|
@@ -217,7 +218,7 @@ const configuration = {
|
|
|
217
218
|
};
|
|
218
219
|
|
|
219
220
|
const designer = Designer.create(placeholder, definition, configuration);
|
|
220
|
-
designer.onDefinitionChanged.subscribe(
|
|
221
|
+
designer.onDefinitionChanged.subscribe(event => {
|
|
221
222
|
// ...
|
|
222
223
|
});
|
|
223
224
|
```
|
|
@@ -231,7 +232,7 @@ const configuration = {
|
|
|
231
232
|
controlBar: false,
|
|
232
233
|
contextMenu: false,
|
|
233
234
|
// ...
|
|
234
|
-
}
|
|
235
|
+
};
|
|
235
236
|
```
|
|
236
237
|
|
|
237
238
|
## 💡 License
|
package/dist/index.umd.js
CHANGED
|
@@ -154,7 +154,7 @@
|
|
|
154
154
|
count() {
|
|
155
155
|
return this.listeners.length;
|
|
156
156
|
}
|
|
157
|
-
|
|
157
|
+
once() {
|
|
158
158
|
return new Promise(resolve => {
|
|
159
159
|
const handler = (value) => {
|
|
160
160
|
this.unsubscribe(handler);
|
|
@@ -1519,7 +1519,7 @@
|
|
|
1519
1519
|
exports.ClickCommandType = void 0;
|
|
1520
1520
|
(function (ClickCommandType) {
|
|
1521
1521
|
ClickCommandType[ClickCommandType["selectStep"] = 1] = "selectStep";
|
|
1522
|
-
ClickCommandType[ClickCommandType["
|
|
1522
|
+
ClickCommandType[ClickCommandType["changePreferences"] = 2] = "changePreferences";
|
|
1523
1523
|
ClickCommandType[ClickCommandType["openFolder"] = 3] = "openFolder";
|
|
1524
1524
|
ClickCommandType[ClickCommandType["triggerCustomAction"] = 4] = "triggerCustomAction";
|
|
1525
1525
|
})(exports.ClickCommandType || (exports.ClickCommandType = {}));
|
|
@@ -2736,7 +2736,12 @@
|
|
|
2736
2736
|
createPlaceholderForGap: componentContext.services.placeholder.createForGap.bind(componentContext.services.placeholder),
|
|
2737
2737
|
createPlaceholderForArea: componentContext.services.placeholder.createForArea.bind(componentContext.services.placeholder),
|
|
2738
2738
|
getPreference: (key) => componentContext.preferenceStorage.getItem(preferenceKeyPrefix + key),
|
|
2739
|
-
|
|
2739
|
+
createPreferenceChange: (key, value) => {
|
|
2740
|
+
return {
|
|
2741
|
+
key: preferenceKeyPrefix + key,
|
|
2742
|
+
value
|
|
2743
|
+
};
|
|
2744
|
+
}
|
|
2740
2745
|
};
|
|
2741
2746
|
}
|
|
2742
2747
|
}
|
|
@@ -3242,11 +3247,12 @@
|
|
|
3242
3247
|
}
|
|
3243
3248
|
|
|
3244
3249
|
class DesignerState {
|
|
3245
|
-
constructor(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed) {
|
|
3250
|
+
constructor(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed, preferenceStorage) {
|
|
3246
3251
|
this.definition = definition;
|
|
3247
3252
|
this.isReadonly = isReadonly;
|
|
3248
3253
|
this.isToolboxCollapsed = isToolboxCollapsed;
|
|
3249
3254
|
this.isEditorCollapsed = isEditorCollapsed;
|
|
3255
|
+
this.preferenceStorage = preferenceStorage;
|
|
3250
3256
|
this.onViewportChanged = new SimpleEvent();
|
|
3251
3257
|
this.onSelectedStepIdChanged = new SimpleEvent();
|
|
3252
3258
|
this.onStepUnselectionBlocked = new SimpleEvent();
|
|
@@ -3257,6 +3263,7 @@
|
|
|
3257
3263
|
this.onDefinitionChanged = new SimpleEvent();
|
|
3258
3264
|
this.onIsToolboxCollapsedChanged = new SimpleEvent();
|
|
3259
3265
|
this.onIsEditorCollapsedChanged = new SimpleEvent();
|
|
3266
|
+
this.onPreferencesChanged = new SimpleEvent();
|
|
3260
3267
|
this.viewport = {
|
|
3261
3268
|
position: new Vector(0, 0),
|
|
3262
3269
|
scale: 1
|
|
@@ -3335,6 +3342,15 @@
|
|
|
3335
3342
|
this.onIsEditorCollapsedChanged.forward(isCollapsed);
|
|
3336
3343
|
}
|
|
3337
3344
|
}
|
|
3345
|
+
setPreferences(changes, stepId) {
|
|
3346
|
+
for (const change of changes) {
|
|
3347
|
+
this.preferenceStorage.setItem(change.key, change.value);
|
|
3348
|
+
}
|
|
3349
|
+
this.onPreferencesChanged.forward({ changes, stepId });
|
|
3350
|
+
}
|
|
3351
|
+
getPreference(key) {
|
|
3352
|
+
return this.preferenceStorage.getItem(key);
|
|
3353
|
+
}
|
|
3338
3354
|
}
|
|
3339
3355
|
|
|
3340
3356
|
class HistoryController {
|
|
@@ -3488,22 +3504,22 @@
|
|
|
3488
3504
|
const isReadonly = Boolean(configuration.isReadonly);
|
|
3489
3505
|
const isToolboxCollapsed = configuration.toolbox ? (_a = configuration.toolbox.isCollapsed) !== null && _a !== void 0 ? _a : layoutController.isMobile() : false;
|
|
3490
3506
|
const isEditorCollapsed = configuration.editors ? (_b = configuration.editors.isCollapsed) !== null && _b !== void 0 ? _b : layoutController.isMobile() : false;
|
|
3507
|
+
const preferenceStorage = (_c = configuration.preferenceStorage) !== null && _c !== void 0 ? _c : new MemoryPreferenceStorage();
|
|
3491
3508
|
const theme = configuration.theme || 'light';
|
|
3492
|
-
const state = new DesignerState(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed);
|
|
3509
|
+
const state = new DesignerState(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed, preferenceStorage);
|
|
3493
3510
|
const workspaceController = new WorkspaceControllerWrapper();
|
|
3494
3511
|
const behaviorController = BehaviorController.create(configuration.shadowRoot);
|
|
3495
3512
|
const stepExtensionResolver = StepExtensionResolver.create(services);
|
|
3496
3513
|
const placeholderController = PlaceholderController.create(state, configuration.placeholder);
|
|
3497
|
-
const definitionWalker = (
|
|
3498
|
-
const i18n = (
|
|
3499
|
-
const uidGenerator = (
|
|
3514
|
+
const definitionWalker = (_d = configuration.definitionWalker) !== null && _d !== void 0 ? _d : new DefinitionWalker();
|
|
3515
|
+
const i18n = (_e = configuration.i18n) !== null && _e !== void 0 ? _e : ((_, defaultValue) => defaultValue);
|
|
3516
|
+
const uidGenerator = (_f = configuration.uidGenerator) !== null && _f !== void 0 ? _f : Uid.next;
|
|
3500
3517
|
const stateModifier = StateModifier.create(definitionWalker, uidGenerator, state, configuration.steps);
|
|
3501
3518
|
const customActionController = new CustomActionController(configuration, state, stateModifier);
|
|
3502
3519
|
let historyController = undefined;
|
|
3503
3520
|
if (configuration.undoStackSize) {
|
|
3504
3521
|
historyController = HistoryController.create(configuration.undoStack, state, stateModifier, configuration);
|
|
3505
3522
|
}
|
|
3506
|
-
const preferenceStorage = (_f = configuration.preferenceStorage) !== null && _f !== void 0 ? _f : new MemoryPreferenceStorage();
|
|
3507
3523
|
const componentContext = ComponentContext.create(configuration, state, stepExtensionResolver, placeholderController, definitionWalker, preferenceStorage, i18n, services);
|
|
3508
3524
|
return new DesignerContext(theme, state, configuration, services, componentContext, definitionWalker, i18n, uidGenerator, stateModifier, layoutController, workspaceController, placeholderController, behaviorController, customActionController, historyController);
|
|
3509
3525
|
}
|
|
@@ -3777,16 +3793,13 @@
|
|
|
3777
3793
|
}
|
|
3778
3794
|
}
|
|
3779
3795
|
|
|
3780
|
-
class
|
|
3796
|
+
class ChangePreferencesBehaviorHandler {
|
|
3781
3797
|
constructor(command, designerContext) {
|
|
3782
3798
|
this.command = command;
|
|
3783
3799
|
this.designerContext = designerContext;
|
|
3784
3800
|
}
|
|
3785
3801
|
handle() {
|
|
3786
|
-
|
|
3787
|
-
this.command.beforeCallback();
|
|
3788
|
-
}
|
|
3789
|
-
this.designerContext.workspaceController.updateRootComponent();
|
|
3802
|
+
this.designerContext.state.setPreferences(this.command.changes, this.command.step.id);
|
|
3790
3803
|
}
|
|
3791
3804
|
}
|
|
3792
3805
|
|
|
@@ -3822,8 +3835,8 @@
|
|
|
3822
3835
|
switch (commandOrNull.type) {
|
|
3823
3836
|
case exports.ClickCommandType.selectStep:
|
|
3824
3837
|
return SelectStepBehavior.create(commandOrNull.component, forceMove, this.context);
|
|
3825
|
-
case exports.ClickCommandType.
|
|
3826
|
-
return PressingBehavior.create(element, new
|
|
3838
|
+
case exports.ClickCommandType.changePreferences:
|
|
3839
|
+
return PressingBehavior.create(element, new ChangePreferencesBehaviorHandler(commandOrNull, this.context));
|
|
3827
3840
|
case exports.ClickCommandType.openFolder:
|
|
3828
3841
|
return PressingBehavior.create(element, new OpenFolderPressingBehaviorHandler(commandOrNull, this.context));
|
|
3829
3842
|
case exports.ClickCommandType.triggerCustomAction:
|
|
@@ -4134,6 +4147,7 @@
|
|
|
4134
4147
|
const workspace = new Workspace(view, designerContext.state, designerContext.behaviorController, wheelController, pinchToZoomController, contextMenuController, clickBehaviorResolver, clickBehaviorWrapper, api.viewport, api.workspace, designerContext.services);
|
|
4135
4148
|
designerContext.setWorkspaceController(workspace);
|
|
4136
4149
|
designerContext.state.onViewportChanged.subscribe(workspace.onViewportChanged);
|
|
4150
|
+
designerContext.state.onPreferencesChanged.subscribe(workspace.onPreferencesChanged);
|
|
4137
4151
|
race(0, designerContext.state.onDefinitionChanged, designerContext.state.onSelectedStepIdChanged, designerContext.state.onFolderPathChanged).subscribe(r => {
|
|
4138
4152
|
workspace.onStateChanged(r[0], r[1], r[2]);
|
|
4139
4153
|
});
|
|
@@ -4156,11 +4170,25 @@
|
|
|
4156
4170
|
this.viewportApi = viewportApi;
|
|
4157
4171
|
this.workspaceApi = workspaceApi;
|
|
4158
4172
|
this.services = services;
|
|
4159
|
-
this.
|
|
4173
|
+
this.onRootComponentUpdated = new SimpleEvent();
|
|
4160
4174
|
this.isValid = false;
|
|
4161
4175
|
this.initTimeout = null;
|
|
4162
4176
|
this.selectedStepComponent = null;
|
|
4163
4177
|
this.validationErrorBadgeIndex = null;
|
|
4178
|
+
this.updateRootComponent = () => {
|
|
4179
|
+
this.selectedStepComponent = null;
|
|
4180
|
+
const rootSequence = this.workspaceApi.getRootSequence();
|
|
4181
|
+
const parentPlaceIndicator = rootSequence.parentStep
|
|
4182
|
+
? {
|
|
4183
|
+
sequence: rootSequence.parentStep.parentSequence,
|
|
4184
|
+
index: rootSequence.parentStep.index
|
|
4185
|
+
}
|
|
4186
|
+
: null;
|
|
4187
|
+
this.view.render(rootSequence.sequence, parentPlaceIndicator);
|
|
4188
|
+
this.trySelectStepComponent(this.state.selectedStepId);
|
|
4189
|
+
this.updateBadges();
|
|
4190
|
+
this.onRootComponentUpdated.forward();
|
|
4191
|
+
};
|
|
4164
4192
|
this.onClick = (position, target, buttonIndex, altKey) => {
|
|
4165
4193
|
const isPrimaryButton = buttonIndex === 0;
|
|
4166
4194
|
const isMiddleButton = buttonIndex === 1;
|
|
@@ -4187,6 +4215,9 @@
|
|
|
4187
4215
|
this.onViewportChanged = (viewport) => {
|
|
4188
4216
|
this.view.setPositionAndScale(viewport.position, viewport.scale);
|
|
4189
4217
|
};
|
|
4218
|
+
this.onPreferencesChanged = () => {
|
|
4219
|
+
this.updateRootComponent();
|
|
4220
|
+
};
|
|
4190
4221
|
}
|
|
4191
4222
|
scheduleInit() {
|
|
4192
4223
|
this.initTimeout = setTimeout(() => {
|
|
@@ -4195,20 +4226,6 @@
|
|
|
4195
4226
|
this.viewportApi.resetViewport();
|
|
4196
4227
|
});
|
|
4197
4228
|
}
|
|
4198
|
-
updateRootComponent() {
|
|
4199
|
-
this.selectedStepComponent = null;
|
|
4200
|
-
const rootSequence = this.workspaceApi.getRootSequence();
|
|
4201
|
-
const parentPlaceIndicator = rootSequence.parentStep
|
|
4202
|
-
? {
|
|
4203
|
-
sequence: rootSequence.parentStep.parentSequence,
|
|
4204
|
-
index: rootSequence.parentStep.index
|
|
4205
|
-
}
|
|
4206
|
-
: null;
|
|
4207
|
-
this.view.render(rootSequence.sequence, parentPlaceIndicator);
|
|
4208
|
-
this.trySelectStepComponent(this.state.selectedStepId);
|
|
4209
|
-
this.updateBadges();
|
|
4210
|
-
this.onRendered.forward();
|
|
4211
|
-
}
|
|
4212
4229
|
updateBadges() {
|
|
4213
4230
|
const result = BadgesResultFactory.create(this.services);
|
|
4214
4231
|
this.getRootComponent().updateBadges(result);
|
|
@@ -5238,7 +5255,8 @@
|
|
|
5238
5255
|
const designerApi = DesignerApi.create(designerContext);
|
|
5239
5256
|
const view = DesignerView.create(placeholder, designerContext, designerApi);
|
|
5240
5257
|
const designer = new Designer(view, designerContext.state, designerContext.definitionWalker, designerContext.historyController, designerApi);
|
|
5241
|
-
view.workspace.
|
|
5258
|
+
view.workspace.onRootComponentUpdated.subscribe(designer.onRootComponentUpdated.forward);
|
|
5259
|
+
view.workspace.onRootComponentUpdated.once().then(designer.onReady.forward);
|
|
5242
5260
|
race(0, designerContext.state.onDefinitionChanged, designerContext.state.onSelectedStepIdChanged).subscribe(([definition, selectedStepId]) => {
|
|
5243
5261
|
if (definition !== undefined) {
|
|
5244
5262
|
designer.onDefinitionChanged.forward(definition);
|
|
@@ -5251,6 +5269,7 @@
|
|
|
5251
5269
|
designerContext.state.onIsToolboxCollapsedChanged.subscribe(designer.onIsToolboxCollapsedChanged.forward);
|
|
5252
5270
|
designerContext.state.onIsEditorCollapsedChanged.subscribe(designer.onIsEditorCollapsedChanged.forward);
|
|
5253
5271
|
designerContext.state.onStepUnselectionBlocked.subscribe(designer.onStepUnselectionBlocked.forward);
|
|
5272
|
+
designerContext.state.onPreferencesChanged.subscribe(designer.onPreferencesChanged.forward);
|
|
5254
5273
|
return designer;
|
|
5255
5274
|
}
|
|
5256
5275
|
constructor(view, state, walker, historyController, api) {
|
|
@@ -5287,6 +5306,14 @@
|
|
|
5287
5306
|
* @description Fires when the editor is collapsed or expanded.
|
|
5288
5307
|
*/
|
|
5289
5308
|
this.onIsEditorCollapsedChanged = new SimpleEvent();
|
|
5309
|
+
/**
|
|
5310
|
+
* @description Fires when the root component and all its children are rerendered.
|
|
5311
|
+
*/
|
|
5312
|
+
this.onRootComponentUpdated = new SimpleEvent();
|
|
5313
|
+
/**
|
|
5314
|
+
* @description Fires when any of the designer preferences has changed.
|
|
5315
|
+
*/
|
|
5316
|
+
this.onPreferencesChanged = new SimpleEvent();
|
|
5290
5317
|
}
|
|
5291
5318
|
/**
|
|
5292
5319
|
* @returns the current definition of the workflow.
|
|
@@ -5412,8 +5439,8 @@
|
|
|
5412
5439
|
return __awaiter(this, void 0, void 0, function* () {
|
|
5413
5440
|
this.getHistoryController().replaceDefinition(definition);
|
|
5414
5441
|
yield Promise.all([
|
|
5415
|
-
this.view.workspace.
|
|
5416
|
-
this.onDefinitionChanged.
|
|
5442
|
+
this.view.workspace.onRootComponentUpdated.once(),
|
|
5443
|
+
this.onDefinitionChanged.once()
|
|
5417
5444
|
]);
|
|
5418
5445
|
});
|
|
5419
5446
|
}
|
package/lib/cjs/index.cjs
CHANGED
|
@@ -152,7 +152,7 @@ class SimpleEvent {
|
|
|
152
152
|
count() {
|
|
153
153
|
return this.listeners.length;
|
|
154
154
|
}
|
|
155
|
-
|
|
155
|
+
once() {
|
|
156
156
|
return new Promise(resolve => {
|
|
157
157
|
const handler = (value) => {
|
|
158
158
|
this.unsubscribe(handler);
|
|
@@ -1334,7 +1334,7 @@ class DefaultSequenceComponent {
|
|
|
1334
1334
|
exports.ClickCommandType = void 0;
|
|
1335
1335
|
(function (ClickCommandType) {
|
|
1336
1336
|
ClickCommandType[ClickCommandType["selectStep"] = 1] = "selectStep";
|
|
1337
|
-
ClickCommandType[ClickCommandType["
|
|
1337
|
+
ClickCommandType[ClickCommandType["changePreferences"] = 2] = "changePreferences";
|
|
1338
1338
|
ClickCommandType[ClickCommandType["openFolder"] = 3] = "openFolder";
|
|
1339
1339
|
ClickCommandType[ClickCommandType["triggerCustomAction"] = 4] = "triggerCustomAction";
|
|
1340
1340
|
})(exports.ClickCommandType || (exports.ClickCommandType = {}));
|
|
@@ -2551,7 +2551,12 @@ class StepComponentViewContextFactory {
|
|
|
2551
2551
|
createPlaceholderForGap: componentContext.services.placeholder.createForGap.bind(componentContext.services.placeholder),
|
|
2552
2552
|
createPlaceholderForArea: componentContext.services.placeholder.createForArea.bind(componentContext.services.placeholder),
|
|
2553
2553
|
getPreference: (key) => componentContext.preferenceStorage.getItem(preferenceKeyPrefix + key),
|
|
2554
|
-
|
|
2554
|
+
createPreferenceChange: (key, value) => {
|
|
2555
|
+
return {
|
|
2556
|
+
key: preferenceKeyPrefix + key,
|
|
2557
|
+
value
|
|
2558
|
+
};
|
|
2559
|
+
}
|
|
2555
2560
|
};
|
|
2556
2561
|
}
|
|
2557
2562
|
}
|
|
@@ -3057,11 +3062,12 @@ class StateModifier {
|
|
|
3057
3062
|
}
|
|
3058
3063
|
|
|
3059
3064
|
class DesignerState {
|
|
3060
|
-
constructor(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed) {
|
|
3065
|
+
constructor(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed, preferenceStorage) {
|
|
3061
3066
|
this.definition = definition;
|
|
3062
3067
|
this.isReadonly = isReadonly;
|
|
3063
3068
|
this.isToolboxCollapsed = isToolboxCollapsed;
|
|
3064
3069
|
this.isEditorCollapsed = isEditorCollapsed;
|
|
3070
|
+
this.preferenceStorage = preferenceStorage;
|
|
3065
3071
|
this.onViewportChanged = new SimpleEvent();
|
|
3066
3072
|
this.onSelectedStepIdChanged = new SimpleEvent();
|
|
3067
3073
|
this.onStepUnselectionBlocked = new SimpleEvent();
|
|
@@ -3072,6 +3078,7 @@ class DesignerState {
|
|
|
3072
3078
|
this.onDefinitionChanged = new SimpleEvent();
|
|
3073
3079
|
this.onIsToolboxCollapsedChanged = new SimpleEvent();
|
|
3074
3080
|
this.onIsEditorCollapsedChanged = new SimpleEvent();
|
|
3081
|
+
this.onPreferencesChanged = new SimpleEvent();
|
|
3075
3082
|
this.viewport = {
|
|
3076
3083
|
position: new Vector(0, 0),
|
|
3077
3084
|
scale: 1
|
|
@@ -3150,6 +3157,15 @@ class DesignerState {
|
|
|
3150
3157
|
this.onIsEditorCollapsedChanged.forward(isCollapsed);
|
|
3151
3158
|
}
|
|
3152
3159
|
}
|
|
3160
|
+
setPreferences(changes, stepId) {
|
|
3161
|
+
for (const change of changes) {
|
|
3162
|
+
this.preferenceStorage.setItem(change.key, change.value);
|
|
3163
|
+
}
|
|
3164
|
+
this.onPreferencesChanged.forward({ changes, stepId });
|
|
3165
|
+
}
|
|
3166
|
+
getPreference(key) {
|
|
3167
|
+
return this.preferenceStorage.getItem(key);
|
|
3168
|
+
}
|
|
3153
3169
|
}
|
|
3154
3170
|
|
|
3155
3171
|
class HistoryController {
|
|
@@ -3303,22 +3319,22 @@ class DesignerContext {
|
|
|
3303
3319
|
const isReadonly = Boolean(configuration.isReadonly);
|
|
3304
3320
|
const isToolboxCollapsed = configuration.toolbox ? (_a = configuration.toolbox.isCollapsed) !== null && _a !== void 0 ? _a : layoutController.isMobile() : false;
|
|
3305
3321
|
const isEditorCollapsed = configuration.editors ? (_b = configuration.editors.isCollapsed) !== null && _b !== void 0 ? _b : layoutController.isMobile() : false;
|
|
3322
|
+
const preferenceStorage = (_c = configuration.preferenceStorage) !== null && _c !== void 0 ? _c : new MemoryPreferenceStorage();
|
|
3306
3323
|
const theme = configuration.theme || 'light';
|
|
3307
|
-
const state = new DesignerState(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed);
|
|
3324
|
+
const state = new DesignerState(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed, preferenceStorage);
|
|
3308
3325
|
const workspaceController = new WorkspaceControllerWrapper();
|
|
3309
3326
|
const behaviorController = BehaviorController.create(configuration.shadowRoot);
|
|
3310
3327
|
const stepExtensionResolver = StepExtensionResolver.create(services);
|
|
3311
3328
|
const placeholderController = PlaceholderController.create(state, configuration.placeholder);
|
|
3312
|
-
const definitionWalker = (
|
|
3313
|
-
const i18n = (
|
|
3314
|
-
const uidGenerator = (
|
|
3329
|
+
const definitionWalker = (_d = configuration.definitionWalker) !== null && _d !== void 0 ? _d : new sequentialWorkflowModel.DefinitionWalker();
|
|
3330
|
+
const i18n = (_e = configuration.i18n) !== null && _e !== void 0 ? _e : ((_, defaultValue) => defaultValue);
|
|
3331
|
+
const uidGenerator = (_f = configuration.uidGenerator) !== null && _f !== void 0 ? _f : Uid.next;
|
|
3315
3332
|
const stateModifier = StateModifier.create(definitionWalker, uidGenerator, state, configuration.steps);
|
|
3316
3333
|
const customActionController = new CustomActionController(configuration, state, stateModifier);
|
|
3317
3334
|
let historyController = undefined;
|
|
3318
3335
|
if (configuration.undoStackSize) {
|
|
3319
3336
|
historyController = HistoryController.create(configuration.undoStack, state, stateModifier, configuration);
|
|
3320
3337
|
}
|
|
3321
|
-
const preferenceStorage = (_f = configuration.preferenceStorage) !== null && _f !== void 0 ? _f : new MemoryPreferenceStorage();
|
|
3322
3338
|
const componentContext = ComponentContext.create(configuration, state, stepExtensionResolver, placeholderController, definitionWalker, preferenceStorage, i18n, services);
|
|
3323
3339
|
return new DesignerContext(theme, state, configuration, services, componentContext, definitionWalker, i18n, uidGenerator, stateModifier, layoutController, workspaceController, placeholderController, behaviorController, customActionController, historyController);
|
|
3324
3340
|
}
|
|
@@ -3592,16 +3608,13 @@ class PressingBehavior {
|
|
|
3592
3608
|
}
|
|
3593
3609
|
}
|
|
3594
3610
|
|
|
3595
|
-
class
|
|
3611
|
+
class ChangePreferencesBehaviorHandler {
|
|
3596
3612
|
constructor(command, designerContext) {
|
|
3597
3613
|
this.command = command;
|
|
3598
3614
|
this.designerContext = designerContext;
|
|
3599
3615
|
}
|
|
3600
3616
|
handle() {
|
|
3601
|
-
|
|
3602
|
-
this.command.beforeCallback();
|
|
3603
|
-
}
|
|
3604
|
-
this.designerContext.workspaceController.updateRootComponent();
|
|
3617
|
+
this.designerContext.state.setPreferences(this.command.changes, this.command.step.id);
|
|
3605
3618
|
}
|
|
3606
3619
|
}
|
|
3607
3620
|
|
|
@@ -3637,8 +3650,8 @@ class ClickBehaviorResolver {
|
|
|
3637
3650
|
switch (commandOrNull.type) {
|
|
3638
3651
|
case exports.ClickCommandType.selectStep:
|
|
3639
3652
|
return SelectStepBehavior.create(commandOrNull.component, forceMove, this.context);
|
|
3640
|
-
case exports.ClickCommandType.
|
|
3641
|
-
return PressingBehavior.create(element, new
|
|
3653
|
+
case exports.ClickCommandType.changePreferences:
|
|
3654
|
+
return PressingBehavior.create(element, new ChangePreferencesBehaviorHandler(commandOrNull, this.context));
|
|
3642
3655
|
case exports.ClickCommandType.openFolder:
|
|
3643
3656
|
return PressingBehavior.create(element, new OpenFolderPressingBehaviorHandler(commandOrNull, this.context));
|
|
3644
3657
|
case exports.ClickCommandType.triggerCustomAction:
|
|
@@ -3949,6 +3962,7 @@ class Workspace {
|
|
|
3949
3962
|
const workspace = new Workspace(view, designerContext.state, designerContext.behaviorController, wheelController, pinchToZoomController, contextMenuController, clickBehaviorResolver, clickBehaviorWrapper, api.viewport, api.workspace, designerContext.services);
|
|
3950
3963
|
designerContext.setWorkspaceController(workspace);
|
|
3951
3964
|
designerContext.state.onViewportChanged.subscribe(workspace.onViewportChanged);
|
|
3965
|
+
designerContext.state.onPreferencesChanged.subscribe(workspace.onPreferencesChanged);
|
|
3952
3966
|
race(0, designerContext.state.onDefinitionChanged, designerContext.state.onSelectedStepIdChanged, designerContext.state.onFolderPathChanged).subscribe(r => {
|
|
3953
3967
|
workspace.onStateChanged(r[0], r[1], r[2]);
|
|
3954
3968
|
});
|
|
@@ -3971,11 +3985,25 @@ class Workspace {
|
|
|
3971
3985
|
this.viewportApi = viewportApi;
|
|
3972
3986
|
this.workspaceApi = workspaceApi;
|
|
3973
3987
|
this.services = services;
|
|
3974
|
-
this.
|
|
3988
|
+
this.onRootComponentUpdated = new SimpleEvent();
|
|
3975
3989
|
this.isValid = false;
|
|
3976
3990
|
this.initTimeout = null;
|
|
3977
3991
|
this.selectedStepComponent = null;
|
|
3978
3992
|
this.validationErrorBadgeIndex = null;
|
|
3993
|
+
this.updateRootComponent = () => {
|
|
3994
|
+
this.selectedStepComponent = null;
|
|
3995
|
+
const rootSequence = this.workspaceApi.getRootSequence();
|
|
3996
|
+
const parentPlaceIndicator = rootSequence.parentStep
|
|
3997
|
+
? {
|
|
3998
|
+
sequence: rootSequence.parentStep.parentSequence,
|
|
3999
|
+
index: rootSequence.parentStep.index
|
|
4000
|
+
}
|
|
4001
|
+
: null;
|
|
4002
|
+
this.view.render(rootSequence.sequence, parentPlaceIndicator);
|
|
4003
|
+
this.trySelectStepComponent(this.state.selectedStepId);
|
|
4004
|
+
this.updateBadges();
|
|
4005
|
+
this.onRootComponentUpdated.forward();
|
|
4006
|
+
};
|
|
3979
4007
|
this.onClick = (position, target, buttonIndex, altKey) => {
|
|
3980
4008
|
const isPrimaryButton = buttonIndex === 0;
|
|
3981
4009
|
const isMiddleButton = buttonIndex === 1;
|
|
@@ -4002,6 +4030,9 @@ class Workspace {
|
|
|
4002
4030
|
this.onViewportChanged = (viewport) => {
|
|
4003
4031
|
this.view.setPositionAndScale(viewport.position, viewport.scale);
|
|
4004
4032
|
};
|
|
4033
|
+
this.onPreferencesChanged = () => {
|
|
4034
|
+
this.updateRootComponent();
|
|
4035
|
+
};
|
|
4005
4036
|
}
|
|
4006
4037
|
scheduleInit() {
|
|
4007
4038
|
this.initTimeout = setTimeout(() => {
|
|
@@ -4010,20 +4041,6 @@ class Workspace {
|
|
|
4010
4041
|
this.viewportApi.resetViewport();
|
|
4011
4042
|
});
|
|
4012
4043
|
}
|
|
4013
|
-
updateRootComponent() {
|
|
4014
|
-
this.selectedStepComponent = null;
|
|
4015
|
-
const rootSequence = this.workspaceApi.getRootSequence();
|
|
4016
|
-
const parentPlaceIndicator = rootSequence.parentStep
|
|
4017
|
-
? {
|
|
4018
|
-
sequence: rootSequence.parentStep.parentSequence,
|
|
4019
|
-
index: rootSequence.parentStep.index
|
|
4020
|
-
}
|
|
4021
|
-
: null;
|
|
4022
|
-
this.view.render(rootSequence.sequence, parentPlaceIndicator);
|
|
4023
|
-
this.trySelectStepComponent(this.state.selectedStepId);
|
|
4024
|
-
this.updateBadges();
|
|
4025
|
-
this.onRendered.forward();
|
|
4026
|
-
}
|
|
4027
4044
|
updateBadges() {
|
|
4028
4045
|
const result = BadgesResultFactory.create(this.services);
|
|
4029
4046
|
this.getRootComponent().updateBadges(result);
|
|
@@ -5053,7 +5070,8 @@ class Designer {
|
|
|
5053
5070
|
const designerApi = DesignerApi.create(designerContext);
|
|
5054
5071
|
const view = DesignerView.create(placeholder, designerContext, designerApi);
|
|
5055
5072
|
const designer = new Designer(view, designerContext.state, designerContext.definitionWalker, designerContext.historyController, designerApi);
|
|
5056
|
-
view.workspace.
|
|
5073
|
+
view.workspace.onRootComponentUpdated.subscribe(designer.onRootComponentUpdated.forward);
|
|
5074
|
+
view.workspace.onRootComponentUpdated.once().then(designer.onReady.forward);
|
|
5057
5075
|
race(0, designerContext.state.onDefinitionChanged, designerContext.state.onSelectedStepIdChanged).subscribe(([definition, selectedStepId]) => {
|
|
5058
5076
|
if (definition !== undefined) {
|
|
5059
5077
|
designer.onDefinitionChanged.forward(definition);
|
|
@@ -5066,6 +5084,7 @@ class Designer {
|
|
|
5066
5084
|
designerContext.state.onIsToolboxCollapsedChanged.subscribe(designer.onIsToolboxCollapsedChanged.forward);
|
|
5067
5085
|
designerContext.state.onIsEditorCollapsedChanged.subscribe(designer.onIsEditorCollapsedChanged.forward);
|
|
5068
5086
|
designerContext.state.onStepUnselectionBlocked.subscribe(designer.onStepUnselectionBlocked.forward);
|
|
5087
|
+
designerContext.state.onPreferencesChanged.subscribe(designer.onPreferencesChanged.forward);
|
|
5069
5088
|
return designer;
|
|
5070
5089
|
}
|
|
5071
5090
|
constructor(view, state, walker, historyController, api) {
|
|
@@ -5102,6 +5121,14 @@ class Designer {
|
|
|
5102
5121
|
* @description Fires when the editor is collapsed or expanded.
|
|
5103
5122
|
*/
|
|
5104
5123
|
this.onIsEditorCollapsedChanged = new SimpleEvent();
|
|
5124
|
+
/**
|
|
5125
|
+
* @description Fires when the root component and all its children are rerendered.
|
|
5126
|
+
*/
|
|
5127
|
+
this.onRootComponentUpdated = new SimpleEvent();
|
|
5128
|
+
/**
|
|
5129
|
+
* @description Fires when any of the designer preferences has changed.
|
|
5130
|
+
*/
|
|
5131
|
+
this.onPreferencesChanged = new SimpleEvent();
|
|
5105
5132
|
}
|
|
5106
5133
|
/**
|
|
5107
5134
|
* @returns the current definition of the workflow.
|
|
@@ -5227,8 +5254,8 @@ class Designer {
|
|
|
5227
5254
|
return __awaiter(this, void 0, void 0, function* () {
|
|
5228
5255
|
this.getHistoryController().replaceDefinition(definition);
|
|
5229
5256
|
yield Promise.all([
|
|
5230
|
-
this.view.workspace.
|
|
5231
|
-
this.onDefinitionChanged.
|
|
5257
|
+
this.view.workspace.onRootComponentUpdated.once(),
|
|
5258
|
+
this.onDefinitionChanged.once()
|
|
5232
5259
|
]);
|
|
5233
5260
|
});
|
|
5234
5261
|
}
|
package/lib/esm/index.js
CHANGED
|
@@ -151,7 +151,7 @@ class SimpleEvent {
|
|
|
151
151
|
count() {
|
|
152
152
|
return this.listeners.length;
|
|
153
153
|
}
|
|
154
|
-
|
|
154
|
+
once() {
|
|
155
155
|
return new Promise(resolve => {
|
|
156
156
|
const handler = (value) => {
|
|
157
157
|
this.unsubscribe(handler);
|
|
@@ -1333,7 +1333,7 @@ class DefaultSequenceComponent {
|
|
|
1333
1333
|
var ClickCommandType;
|
|
1334
1334
|
(function (ClickCommandType) {
|
|
1335
1335
|
ClickCommandType[ClickCommandType["selectStep"] = 1] = "selectStep";
|
|
1336
|
-
ClickCommandType[ClickCommandType["
|
|
1336
|
+
ClickCommandType[ClickCommandType["changePreferences"] = 2] = "changePreferences";
|
|
1337
1337
|
ClickCommandType[ClickCommandType["openFolder"] = 3] = "openFolder";
|
|
1338
1338
|
ClickCommandType[ClickCommandType["triggerCustomAction"] = 4] = "triggerCustomAction";
|
|
1339
1339
|
})(ClickCommandType || (ClickCommandType = {}));
|
|
@@ -2550,7 +2550,12 @@ class StepComponentViewContextFactory {
|
|
|
2550
2550
|
createPlaceholderForGap: componentContext.services.placeholder.createForGap.bind(componentContext.services.placeholder),
|
|
2551
2551
|
createPlaceholderForArea: componentContext.services.placeholder.createForArea.bind(componentContext.services.placeholder),
|
|
2552
2552
|
getPreference: (key) => componentContext.preferenceStorage.getItem(preferenceKeyPrefix + key),
|
|
2553
|
-
|
|
2553
|
+
createPreferenceChange: (key, value) => {
|
|
2554
|
+
return {
|
|
2555
|
+
key: preferenceKeyPrefix + key,
|
|
2556
|
+
value
|
|
2557
|
+
};
|
|
2558
|
+
}
|
|
2554
2559
|
};
|
|
2555
2560
|
}
|
|
2556
2561
|
}
|
|
@@ -3056,11 +3061,12 @@ class StateModifier {
|
|
|
3056
3061
|
}
|
|
3057
3062
|
|
|
3058
3063
|
class DesignerState {
|
|
3059
|
-
constructor(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed) {
|
|
3064
|
+
constructor(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed, preferenceStorage) {
|
|
3060
3065
|
this.definition = definition;
|
|
3061
3066
|
this.isReadonly = isReadonly;
|
|
3062
3067
|
this.isToolboxCollapsed = isToolboxCollapsed;
|
|
3063
3068
|
this.isEditorCollapsed = isEditorCollapsed;
|
|
3069
|
+
this.preferenceStorage = preferenceStorage;
|
|
3064
3070
|
this.onViewportChanged = new SimpleEvent();
|
|
3065
3071
|
this.onSelectedStepIdChanged = new SimpleEvent();
|
|
3066
3072
|
this.onStepUnselectionBlocked = new SimpleEvent();
|
|
@@ -3071,6 +3077,7 @@ class DesignerState {
|
|
|
3071
3077
|
this.onDefinitionChanged = new SimpleEvent();
|
|
3072
3078
|
this.onIsToolboxCollapsedChanged = new SimpleEvent();
|
|
3073
3079
|
this.onIsEditorCollapsedChanged = new SimpleEvent();
|
|
3080
|
+
this.onPreferencesChanged = new SimpleEvent();
|
|
3074
3081
|
this.viewport = {
|
|
3075
3082
|
position: new Vector(0, 0),
|
|
3076
3083
|
scale: 1
|
|
@@ -3149,6 +3156,15 @@ class DesignerState {
|
|
|
3149
3156
|
this.onIsEditorCollapsedChanged.forward(isCollapsed);
|
|
3150
3157
|
}
|
|
3151
3158
|
}
|
|
3159
|
+
setPreferences(changes, stepId) {
|
|
3160
|
+
for (const change of changes) {
|
|
3161
|
+
this.preferenceStorage.setItem(change.key, change.value);
|
|
3162
|
+
}
|
|
3163
|
+
this.onPreferencesChanged.forward({ changes, stepId });
|
|
3164
|
+
}
|
|
3165
|
+
getPreference(key) {
|
|
3166
|
+
return this.preferenceStorage.getItem(key);
|
|
3167
|
+
}
|
|
3152
3168
|
}
|
|
3153
3169
|
|
|
3154
3170
|
class HistoryController {
|
|
@@ -3302,22 +3318,22 @@ class DesignerContext {
|
|
|
3302
3318
|
const isReadonly = Boolean(configuration.isReadonly);
|
|
3303
3319
|
const isToolboxCollapsed = configuration.toolbox ? (_a = configuration.toolbox.isCollapsed) !== null && _a !== void 0 ? _a : layoutController.isMobile() : false;
|
|
3304
3320
|
const isEditorCollapsed = configuration.editors ? (_b = configuration.editors.isCollapsed) !== null && _b !== void 0 ? _b : layoutController.isMobile() : false;
|
|
3321
|
+
const preferenceStorage = (_c = configuration.preferenceStorage) !== null && _c !== void 0 ? _c : new MemoryPreferenceStorage();
|
|
3305
3322
|
const theme = configuration.theme || 'light';
|
|
3306
|
-
const state = new DesignerState(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed);
|
|
3323
|
+
const state = new DesignerState(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed, preferenceStorage);
|
|
3307
3324
|
const workspaceController = new WorkspaceControllerWrapper();
|
|
3308
3325
|
const behaviorController = BehaviorController.create(configuration.shadowRoot);
|
|
3309
3326
|
const stepExtensionResolver = StepExtensionResolver.create(services);
|
|
3310
3327
|
const placeholderController = PlaceholderController.create(state, configuration.placeholder);
|
|
3311
|
-
const definitionWalker = (
|
|
3312
|
-
const i18n = (
|
|
3313
|
-
const uidGenerator = (
|
|
3328
|
+
const definitionWalker = (_d = configuration.definitionWalker) !== null && _d !== void 0 ? _d : new DefinitionWalker();
|
|
3329
|
+
const i18n = (_e = configuration.i18n) !== null && _e !== void 0 ? _e : ((_, defaultValue) => defaultValue);
|
|
3330
|
+
const uidGenerator = (_f = configuration.uidGenerator) !== null && _f !== void 0 ? _f : Uid.next;
|
|
3314
3331
|
const stateModifier = StateModifier.create(definitionWalker, uidGenerator, state, configuration.steps);
|
|
3315
3332
|
const customActionController = new CustomActionController(configuration, state, stateModifier);
|
|
3316
3333
|
let historyController = undefined;
|
|
3317
3334
|
if (configuration.undoStackSize) {
|
|
3318
3335
|
historyController = HistoryController.create(configuration.undoStack, state, stateModifier, configuration);
|
|
3319
3336
|
}
|
|
3320
|
-
const preferenceStorage = (_f = configuration.preferenceStorage) !== null && _f !== void 0 ? _f : new MemoryPreferenceStorage();
|
|
3321
3337
|
const componentContext = ComponentContext.create(configuration, state, stepExtensionResolver, placeholderController, definitionWalker, preferenceStorage, i18n, services);
|
|
3322
3338
|
return new DesignerContext(theme, state, configuration, services, componentContext, definitionWalker, i18n, uidGenerator, stateModifier, layoutController, workspaceController, placeholderController, behaviorController, customActionController, historyController);
|
|
3323
3339
|
}
|
|
@@ -3591,16 +3607,13 @@ class PressingBehavior {
|
|
|
3591
3607
|
}
|
|
3592
3608
|
}
|
|
3593
3609
|
|
|
3594
|
-
class
|
|
3610
|
+
class ChangePreferencesBehaviorHandler {
|
|
3595
3611
|
constructor(command, designerContext) {
|
|
3596
3612
|
this.command = command;
|
|
3597
3613
|
this.designerContext = designerContext;
|
|
3598
3614
|
}
|
|
3599
3615
|
handle() {
|
|
3600
|
-
|
|
3601
|
-
this.command.beforeCallback();
|
|
3602
|
-
}
|
|
3603
|
-
this.designerContext.workspaceController.updateRootComponent();
|
|
3616
|
+
this.designerContext.state.setPreferences(this.command.changes, this.command.step.id);
|
|
3604
3617
|
}
|
|
3605
3618
|
}
|
|
3606
3619
|
|
|
@@ -3636,8 +3649,8 @@ class ClickBehaviorResolver {
|
|
|
3636
3649
|
switch (commandOrNull.type) {
|
|
3637
3650
|
case ClickCommandType.selectStep:
|
|
3638
3651
|
return SelectStepBehavior.create(commandOrNull.component, forceMove, this.context);
|
|
3639
|
-
case ClickCommandType.
|
|
3640
|
-
return PressingBehavior.create(element, new
|
|
3652
|
+
case ClickCommandType.changePreferences:
|
|
3653
|
+
return PressingBehavior.create(element, new ChangePreferencesBehaviorHandler(commandOrNull, this.context));
|
|
3641
3654
|
case ClickCommandType.openFolder:
|
|
3642
3655
|
return PressingBehavior.create(element, new OpenFolderPressingBehaviorHandler(commandOrNull, this.context));
|
|
3643
3656
|
case ClickCommandType.triggerCustomAction:
|
|
@@ -3948,6 +3961,7 @@ class Workspace {
|
|
|
3948
3961
|
const workspace = new Workspace(view, designerContext.state, designerContext.behaviorController, wheelController, pinchToZoomController, contextMenuController, clickBehaviorResolver, clickBehaviorWrapper, api.viewport, api.workspace, designerContext.services);
|
|
3949
3962
|
designerContext.setWorkspaceController(workspace);
|
|
3950
3963
|
designerContext.state.onViewportChanged.subscribe(workspace.onViewportChanged);
|
|
3964
|
+
designerContext.state.onPreferencesChanged.subscribe(workspace.onPreferencesChanged);
|
|
3951
3965
|
race(0, designerContext.state.onDefinitionChanged, designerContext.state.onSelectedStepIdChanged, designerContext.state.onFolderPathChanged).subscribe(r => {
|
|
3952
3966
|
workspace.onStateChanged(r[0], r[1], r[2]);
|
|
3953
3967
|
});
|
|
@@ -3970,11 +3984,25 @@ class Workspace {
|
|
|
3970
3984
|
this.viewportApi = viewportApi;
|
|
3971
3985
|
this.workspaceApi = workspaceApi;
|
|
3972
3986
|
this.services = services;
|
|
3973
|
-
this.
|
|
3987
|
+
this.onRootComponentUpdated = new SimpleEvent();
|
|
3974
3988
|
this.isValid = false;
|
|
3975
3989
|
this.initTimeout = null;
|
|
3976
3990
|
this.selectedStepComponent = null;
|
|
3977
3991
|
this.validationErrorBadgeIndex = null;
|
|
3992
|
+
this.updateRootComponent = () => {
|
|
3993
|
+
this.selectedStepComponent = null;
|
|
3994
|
+
const rootSequence = this.workspaceApi.getRootSequence();
|
|
3995
|
+
const parentPlaceIndicator = rootSequence.parentStep
|
|
3996
|
+
? {
|
|
3997
|
+
sequence: rootSequence.parentStep.parentSequence,
|
|
3998
|
+
index: rootSequence.parentStep.index
|
|
3999
|
+
}
|
|
4000
|
+
: null;
|
|
4001
|
+
this.view.render(rootSequence.sequence, parentPlaceIndicator);
|
|
4002
|
+
this.trySelectStepComponent(this.state.selectedStepId);
|
|
4003
|
+
this.updateBadges();
|
|
4004
|
+
this.onRootComponentUpdated.forward();
|
|
4005
|
+
};
|
|
3978
4006
|
this.onClick = (position, target, buttonIndex, altKey) => {
|
|
3979
4007
|
const isPrimaryButton = buttonIndex === 0;
|
|
3980
4008
|
const isMiddleButton = buttonIndex === 1;
|
|
@@ -4001,6 +4029,9 @@ class Workspace {
|
|
|
4001
4029
|
this.onViewportChanged = (viewport) => {
|
|
4002
4030
|
this.view.setPositionAndScale(viewport.position, viewport.scale);
|
|
4003
4031
|
};
|
|
4032
|
+
this.onPreferencesChanged = () => {
|
|
4033
|
+
this.updateRootComponent();
|
|
4034
|
+
};
|
|
4004
4035
|
}
|
|
4005
4036
|
scheduleInit() {
|
|
4006
4037
|
this.initTimeout = setTimeout(() => {
|
|
@@ -4009,20 +4040,6 @@ class Workspace {
|
|
|
4009
4040
|
this.viewportApi.resetViewport();
|
|
4010
4041
|
});
|
|
4011
4042
|
}
|
|
4012
|
-
updateRootComponent() {
|
|
4013
|
-
this.selectedStepComponent = null;
|
|
4014
|
-
const rootSequence = this.workspaceApi.getRootSequence();
|
|
4015
|
-
const parentPlaceIndicator = rootSequence.parentStep
|
|
4016
|
-
? {
|
|
4017
|
-
sequence: rootSequence.parentStep.parentSequence,
|
|
4018
|
-
index: rootSequence.parentStep.index
|
|
4019
|
-
}
|
|
4020
|
-
: null;
|
|
4021
|
-
this.view.render(rootSequence.sequence, parentPlaceIndicator);
|
|
4022
|
-
this.trySelectStepComponent(this.state.selectedStepId);
|
|
4023
|
-
this.updateBadges();
|
|
4024
|
-
this.onRendered.forward();
|
|
4025
|
-
}
|
|
4026
4043
|
updateBadges() {
|
|
4027
4044
|
const result = BadgesResultFactory.create(this.services);
|
|
4028
4045
|
this.getRootComponent().updateBadges(result);
|
|
@@ -5052,7 +5069,8 @@ class Designer {
|
|
|
5052
5069
|
const designerApi = DesignerApi.create(designerContext);
|
|
5053
5070
|
const view = DesignerView.create(placeholder, designerContext, designerApi);
|
|
5054
5071
|
const designer = new Designer(view, designerContext.state, designerContext.definitionWalker, designerContext.historyController, designerApi);
|
|
5055
|
-
view.workspace.
|
|
5072
|
+
view.workspace.onRootComponentUpdated.subscribe(designer.onRootComponentUpdated.forward);
|
|
5073
|
+
view.workspace.onRootComponentUpdated.once().then(designer.onReady.forward);
|
|
5056
5074
|
race(0, designerContext.state.onDefinitionChanged, designerContext.state.onSelectedStepIdChanged).subscribe(([definition, selectedStepId]) => {
|
|
5057
5075
|
if (definition !== undefined) {
|
|
5058
5076
|
designer.onDefinitionChanged.forward(definition);
|
|
@@ -5065,6 +5083,7 @@ class Designer {
|
|
|
5065
5083
|
designerContext.state.onIsToolboxCollapsedChanged.subscribe(designer.onIsToolboxCollapsedChanged.forward);
|
|
5066
5084
|
designerContext.state.onIsEditorCollapsedChanged.subscribe(designer.onIsEditorCollapsedChanged.forward);
|
|
5067
5085
|
designerContext.state.onStepUnselectionBlocked.subscribe(designer.onStepUnselectionBlocked.forward);
|
|
5086
|
+
designerContext.state.onPreferencesChanged.subscribe(designer.onPreferencesChanged.forward);
|
|
5068
5087
|
return designer;
|
|
5069
5088
|
}
|
|
5070
5089
|
constructor(view, state, walker, historyController, api) {
|
|
@@ -5101,6 +5120,14 @@ class Designer {
|
|
|
5101
5120
|
* @description Fires when the editor is collapsed or expanded.
|
|
5102
5121
|
*/
|
|
5103
5122
|
this.onIsEditorCollapsedChanged = new SimpleEvent();
|
|
5123
|
+
/**
|
|
5124
|
+
* @description Fires when the root component and all its children are rerendered.
|
|
5125
|
+
*/
|
|
5126
|
+
this.onRootComponentUpdated = new SimpleEvent();
|
|
5127
|
+
/**
|
|
5128
|
+
* @description Fires when any of the designer preferences has changed.
|
|
5129
|
+
*/
|
|
5130
|
+
this.onPreferencesChanged = new SimpleEvent();
|
|
5104
5131
|
}
|
|
5105
5132
|
/**
|
|
5106
5133
|
* @returns the current definition of the workflow.
|
|
@@ -5226,8 +5253,8 @@ class Designer {
|
|
|
5226
5253
|
return __awaiter(this, void 0, void 0, function* () {
|
|
5227
5254
|
this.getHistoryController().replaceDefinition(definition);
|
|
5228
5255
|
yield Promise.all([
|
|
5229
|
-
this.view.workspace.
|
|
5230
|
-
this.onDefinitionChanged.
|
|
5256
|
+
this.view.workspace.onRootComponentUpdated.once(),
|
|
5257
|
+
this.onDefinitionChanged.once()
|
|
5231
5258
|
]);
|
|
5232
5259
|
});
|
|
5233
5260
|
}
|
package/lib/index.d.ts
CHANGED
|
@@ -63,7 +63,7 @@ declare class SimpleEvent<T> {
|
|
|
63
63
|
unsubscribe(listener: SimpleEventListener<T>): void;
|
|
64
64
|
readonly forward: (value: T) => void;
|
|
65
65
|
count(): number;
|
|
66
|
-
|
|
66
|
+
once(): Promise<T>;
|
|
67
67
|
}
|
|
68
68
|
type SimpleEventListener<T> = (value: T) => void;
|
|
69
69
|
|
|
@@ -103,6 +103,7 @@ declare class DesignerState {
|
|
|
103
103
|
isReadonly: boolean;
|
|
104
104
|
isToolboxCollapsed: boolean;
|
|
105
105
|
isEditorCollapsed: boolean;
|
|
106
|
+
private readonly preferenceStorage;
|
|
106
107
|
readonly onViewportChanged: SimpleEvent<Viewport>;
|
|
107
108
|
readonly onSelectedStepIdChanged: SimpleEvent<string | null>;
|
|
108
109
|
readonly onStepUnselectionBlocked: SimpleEvent<string | null>;
|
|
@@ -113,12 +114,13 @@ declare class DesignerState {
|
|
|
113
114
|
readonly onDefinitionChanged: SimpleEvent<DefinitionChangedEvent<Definition>>;
|
|
114
115
|
readonly onIsToolboxCollapsedChanged: SimpleEvent<boolean>;
|
|
115
116
|
readonly onIsEditorCollapsedChanged: SimpleEvent<boolean>;
|
|
117
|
+
readonly onPreferencesChanged: SimpleEvent<PreferencesChangedEvent>;
|
|
116
118
|
viewport: Viewport;
|
|
117
119
|
selectedStepId: string | null;
|
|
118
120
|
folderPath: string[];
|
|
119
121
|
isDragging: boolean;
|
|
120
122
|
isDragDisabled: boolean;
|
|
121
|
-
constructor(definition: Definition, isReadonly: boolean, isToolboxCollapsed: boolean, isEditorCollapsed: boolean);
|
|
123
|
+
constructor(definition: Definition, isReadonly: boolean, isToolboxCollapsed: boolean, isEditorCollapsed: boolean, preferenceStorage: PreferenceStorage);
|
|
122
124
|
setSelectedStepId(stepId: string | null): void;
|
|
123
125
|
pushStepIdToFolderPath(stepId: string): void;
|
|
124
126
|
setFolderPath(path: string[]): void;
|
|
@@ -132,6 +134,8 @@ declare class DesignerState {
|
|
|
132
134
|
setIsDragDisabled(isDragDisabled: boolean): void;
|
|
133
135
|
setIsToolboxCollapsed(isCollapsed: boolean): void;
|
|
134
136
|
setIsEditorCollapsed(isCollapsed: boolean): void;
|
|
137
|
+
setPreferences(changes: PreferenceChange[], stepId: string): void;
|
|
138
|
+
getPreference(key: string): string | null;
|
|
135
139
|
}
|
|
136
140
|
|
|
137
141
|
declare class DefinitionValidator {
|
|
@@ -200,7 +204,7 @@ interface ClickDetails {
|
|
|
200
204
|
position: Vector;
|
|
201
205
|
scale: number;
|
|
202
206
|
}
|
|
203
|
-
type ClickCommand = SelectStepClickCommand |
|
|
207
|
+
type ClickCommand = SelectStepClickCommand | SetPreferencesClickCommand | OpenFolderClickCommand | TriggerCustomActionClickCommand;
|
|
204
208
|
interface BaseClickCommand {
|
|
205
209
|
type: ClickCommandType;
|
|
206
210
|
}
|
|
@@ -208,10 +212,10 @@ interface SelectStepClickCommand extends BaseClickCommand {
|
|
|
208
212
|
type: ClickCommandType.selectStep;
|
|
209
213
|
component: StepComponent;
|
|
210
214
|
}
|
|
211
|
-
interface
|
|
212
|
-
type: ClickCommandType.
|
|
215
|
+
interface SetPreferencesClickCommand extends BaseClickCommand {
|
|
216
|
+
type: ClickCommandType.changePreferences;
|
|
213
217
|
step: Step;
|
|
214
|
-
|
|
218
|
+
changes: PreferenceChange[];
|
|
215
219
|
}
|
|
216
220
|
interface OpenFolderClickCommand extends BaseClickCommand {
|
|
217
221
|
type: ClickCommandType.openFolder;
|
|
@@ -225,7 +229,7 @@ interface TriggerCustomActionClickCommand extends BaseClickCommand {
|
|
|
225
229
|
}
|
|
226
230
|
declare enum ClickCommandType {
|
|
227
231
|
selectStep = 1,
|
|
228
|
-
|
|
232
|
+
changePreferences = 2,
|
|
229
233
|
openFolder = 3,
|
|
230
234
|
triggerCustomAction = 4
|
|
231
235
|
}
|
|
@@ -871,7 +875,7 @@ interface StepComponentViewContext {
|
|
|
871
875
|
createPlaceholderForArea(parentElement: SVGElement, size: Vector, direction: PlaceholderDirection, sequence: Sequence, index: number): Placeholder;
|
|
872
876
|
createRegionComponentView(parentElement: SVGElement, componentClassName: string, contentFactory: RegionComponentViewContentFactory): StepComponentView;
|
|
873
877
|
getPreference(key: string): string | null;
|
|
874
|
-
|
|
878
|
+
createPreferenceChange(key: string, value: string): PreferenceChange;
|
|
875
879
|
}
|
|
876
880
|
interface StepContext<S extends Step = Step> {
|
|
877
881
|
parentSequence: Sequence;
|
|
@@ -1210,6 +1214,14 @@ interface DefinitionChangedEvent<TDefinition extends Definition = Definition> {
|
|
|
1210
1214
|
changeType: DefinitionChangeType;
|
|
1211
1215
|
stepId: string | null;
|
|
1212
1216
|
duplicatedStepIds?: DuplicatedStepId[];
|
|
1217
|
+
}
|
|
1218
|
+
interface PreferenceChange {
|
|
1219
|
+
key: string;
|
|
1220
|
+
value: string;
|
|
1221
|
+
}
|
|
1222
|
+
interface PreferencesChangedEvent {
|
|
1223
|
+
stepId: string;
|
|
1224
|
+
changes: PreferenceChange[];
|
|
1213
1225
|
}
|
|
1214
1226
|
|
|
1215
1227
|
declare class StateModifier {
|
|
@@ -1368,6 +1380,14 @@ declare class Designer<TDefinition extends Definition = Definition> {
|
|
|
1368
1380
|
* @description Fires when the editor is collapsed or expanded.
|
|
1369
1381
|
*/
|
|
1370
1382
|
readonly onIsEditorCollapsedChanged: SimpleEvent<boolean>;
|
|
1383
|
+
/**
|
|
1384
|
+
* @description Fires when the root component and all its children are rerendered.
|
|
1385
|
+
*/
|
|
1386
|
+
readonly onRootComponentUpdated: SimpleEvent<void>;
|
|
1387
|
+
/**
|
|
1388
|
+
* @description Fires when any of the designer preferences has changed.
|
|
1389
|
+
*/
|
|
1390
|
+
readonly onPreferencesChanged: SimpleEvent<PreferencesChangedEvent>;
|
|
1371
1391
|
/**
|
|
1372
1392
|
* @returns the current definition of the workflow.
|
|
1373
1393
|
*/
|
|
@@ -1467,4 +1487,4 @@ declare class Designer<TDefinition extends Definition = Definition> {
|
|
|
1467
1487
|
}
|
|
1468
1488
|
|
|
1469
1489
|
export { Badges, CenteredViewportCalculator, ClassicWheelControllerExtension, ClickCommandType, ComponentContext, ComponentDom, ControlBarApi, CustomActionController, DefaultRegionComponentViewExtension, DefaultRegionView, DefaultSequenceComponent, DefaultSequenceComponentView, DefaultViewportController, DefaultViewportControllerDesignerExtension, DefaultViewportControllerExtension, DefinitionChangeType, Designer, DesignerApi, DesignerContext, DesignerState, Dom, Editor, EditorApi, Icons, InputView, JoinView, KeyboardAction, LabelView, LineGridDesignerExtension, ObjectCloner, OutputView, PathBarApi, PlaceholderController, PlaceholderDirection, PlaceholderGapOrientation, RectPlaceholder, RectPlaceholderDesignerExtension, RectPlaceholderView, SelectStepBehaviorEndToken, ServicesResolver, SimpleEvent, StartStopRootComponentDesignerExtension, StartStopRootComponentExtension, StepComponent, StepExtensionResolver, StepsDesignerExtension, TYPE, ToolboxApi, Uid, ValidationErrorBadgeExtension, Vector, ViewportApi, WorkspaceApi, createContainerStepComponentViewFactory, createLaunchPadStepComponentViewFactory, createSwitchStepComponentViewFactory, createTaskStepComponentViewFactory, getAbsolutePosition, race };
|
|
1470
|
-
export type { Attributes, Badge, BadgeExtension, BadgeView, BadgesDecorator, BadgesResult, BaseClickCommand, Behavior, BehaviorEndToken, BranchNamesResolver, ClickBehaviorWrapper, ClickBehaviorWrapperExtension, ClickCommand, ClickDetails, Component, ComponentView, ContainerStepComponentViewConfiguration, ContainerStepExtensionConfiguration, ContextMenuExtension, ContextMenuItem, ContextMenuItemsProvider, CustomAction, CustomActionHandler, CustomActionHandlerContext, Daemon, DaemonExtension, DefaultViewportControllerConfiguration, DefaultViewportControllerExtensionConfiguration, DefinitionChangedEvent, DefinitionChangedEventDetails, DesignerConfiguration, DesignerExtension, DraggedComponent, DraggedComponentExtension, DuplicatedStepId, EditorsConfiguration, FoundPlaceholders, Grid, GridExtension, I18n, KeyboardConfiguration, LaunchPadStepComponentViewConfiguration, LaunchPadStepExtensionConfiguration, LineGridConfiguration, NextScale, OpenFolderClickCommand, Placeholder, PlaceholderConfiguration, PlaceholderExtension, PlaceholderView, PreferenceStorage, RectPlaceholderConfiguration, RegionComponentViewContentFactory, RegionComponentViewExtension, RegionView, RegionViewFactory,
|
|
1490
|
+
export type { Attributes, Badge, BadgeExtension, BadgeView, BadgesDecorator, BadgesResult, BaseClickCommand, Behavior, BehaviorEndToken, BranchNamesResolver, ClickBehaviorWrapper, ClickBehaviorWrapperExtension, ClickCommand, ClickDetails, Component, ComponentView, ContainerStepComponentViewConfiguration, ContainerStepExtensionConfiguration, ContextMenuExtension, ContextMenuItem, ContextMenuItemsProvider, CustomAction, CustomActionHandler, CustomActionHandlerContext, Daemon, DaemonExtension, DefaultViewportControllerConfiguration, DefaultViewportControllerExtensionConfiguration, DefinitionChangedEvent, DefinitionChangedEventDetails, DesignerConfiguration, DesignerExtension, DraggedComponent, DraggedComponentExtension, DuplicatedStepId, EditorsConfiguration, FoundPlaceholders, Grid, GridExtension, I18n, KeyboardConfiguration, LaunchPadStepComponentViewConfiguration, LaunchPadStepExtensionConfiguration, LineGridConfiguration, NextScale, OpenFolderClickCommand, Placeholder, PlaceholderConfiguration, PlaceholderExtension, PlaceholderView, PreferenceChange, PreferenceStorage, PreferencesChangedEvent, RectPlaceholderConfiguration, RegionComponentViewContentFactory, RegionComponentViewExtension, RegionView, RegionViewFactory, RootComponentExtension, RootEditorContext, RootEditorProvider, RootValidator, SelectStepClickCommand, SelectedStepIdProvider, SequenceComponent, SequenceComponentExtension, SequenceContext, SequencePlaceIndicator, Services, SetPreferencesClickCommand, SimpleEventListener, StartStopRootComponentExtensionConfiguration, StartStopRootComponentViewConfiguration, StateModifierDependency, StepBadgesDecoratorExtension, StepComponentView, StepComponentViewContext, StepComponentViewFactory, StepComponentViewWrapperExtension, StepContext, StepDefinition, StepDescriptionProvider, StepEditorContext, StepEditorProvider, StepExtension, StepIconUrlProvider, StepLabelProvider, StepValidator, StepsConfiguration, StepsDesignerExtensionConfiguration, SwitchStepComponentViewConfiguration, SwitchStepExtensionConfiguration, TaskStepComponentViewConfiguration, TaskStepExtensionConfiguration, ToolboxConfiguration, ToolboxGroupConfiguration, TriggerCustomActionClickCommand, UiComponent, UiComponentExtension, UidGenerator, UndoStack, UndoStackItem, ValidationErrorBadgeExtensionConfiguration, ValidationErrorBadgeViewConfiguration, ValidatorConfiguration, Viewport, ViewportController, ViewportControllerExtension, WheelController, WheelControllerExtension, WorkspaceRootSequence };
|
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.
|
|
4
|
+
"version": "0.37.0",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./lib/esm/index.js",
|
|
7
7
|
"types": "./lib/index.d.ts",
|