sequential-workflow-designer 0.16.3 → 0.16.4

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/lib/cjs/index.cjs CHANGED
@@ -74,57 +74,6 @@ class ControlBarApi {
74
74
  }
75
75
  }
76
76
 
77
- class SimpleEvent {
78
- constructor() {
79
- this.listeners = [];
80
- }
81
- subscribe(listener) {
82
- this.listeners.push(listener);
83
- }
84
- unsubscribe(listener) {
85
- const index = this.listeners.indexOf(listener);
86
- if (index >= 0) {
87
- this.listeners.splice(index, 1);
88
- }
89
- else {
90
- throw new Error('Unknown listener');
91
- }
92
- }
93
- forward(value) {
94
- if (this.listeners.length > 0) {
95
- this.listeners.forEach(listener => listener(value));
96
- }
97
- }
98
- count() {
99
- return this.listeners.length;
100
- }
101
- }
102
-
103
- class Vector {
104
- constructor(x, y) {
105
- this.x = x;
106
- this.y = y;
107
- }
108
- add(v) {
109
- return new Vector(this.x + v.x, this.y + v.y);
110
- }
111
- subtract(v) {
112
- return new Vector(this.x - v.x, this.y - v.y);
113
- }
114
- multiplyByScalar(s) {
115
- return new Vector(this.x * s, this.y * s);
116
- }
117
- divideByScalar(s) {
118
- return new Vector(this.x / s, this.y / s);
119
- }
120
- round() {
121
- return new Vector(Math.round(this.x), Math.round(this.y));
122
- }
123
- distance() {
124
- return Math.sqrt(Math.pow(this.x, 2) + Math.pow(this.y, 2));
125
- }
126
- }
127
-
128
77
  exports.DefinitionChangeType = void 0;
129
78
  (function (DefinitionChangeType) {
130
79
  DefinitionChangeType[DefinitionChangeType["stepNameChanged"] = 1] = "stepNameChanged";
@@ -135,88 +84,7 @@ exports.DefinitionChangeType = void 0;
135
84
  DefinitionChangeType[DefinitionChangeType["stepInserted"] = 6] = "stepInserted";
136
85
  DefinitionChangeType[DefinitionChangeType["globalPropertyChanged"] = 7] = "globalPropertyChanged";
137
86
  DefinitionChangeType[DefinitionChangeType["rootReplaced"] = 8] = "rootReplaced";
138
- })(exports.DefinitionChangeType || (exports.DefinitionChangeType = {}));
139
- class DesignerState {
140
- constructor(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed) {
141
- this.definition = definition;
142
- this.isReadonly = isReadonly;
143
- this.isToolboxCollapsed = isToolboxCollapsed;
144
- this.isEditorCollapsed = isEditorCollapsed;
145
- this.onViewportChanged = new SimpleEvent();
146
- this.onSelectedStepIdChanged = new SimpleEvent();
147
- this.onFolderPathChanged = new SimpleEvent();
148
- this.onIsReadonlyChanged = new SimpleEvent();
149
- this.onIsDraggingChanged = new SimpleEvent();
150
- this.onIsDragDisabledChanged = new SimpleEvent();
151
- this.onDefinitionChanged = new SimpleEvent();
152
- this.onIsToolboxCollapsedChanged = new SimpleEvent();
153
- this.onIsEditorCollapsedChanged = new SimpleEvent();
154
- this.viewport = {
155
- position: new Vector(0, 0),
156
- scale: 1
157
- };
158
- this.selectedStepId = null;
159
- this.folderPath = [];
160
- this.isDragging = false;
161
- this.isDragDisabled = false;
162
- }
163
- setSelectedStepId(stepId) {
164
- if (this.selectedStepId !== stepId) {
165
- this.selectedStepId = stepId;
166
- this.onSelectedStepIdChanged.forward(stepId);
167
- }
168
- }
169
- pushStepIdToFolderPath(stepId) {
170
- this.folderPath.push(stepId);
171
- this.onFolderPathChanged.forward(this.folderPath);
172
- }
173
- setFolderPath(path) {
174
- this.folderPath = path;
175
- this.onFolderPathChanged.forward(path);
176
- }
177
- tryGetLastStepIdFromFolderPath() {
178
- return this.folderPath.length > 0 ? this.folderPath[this.folderPath.length - 1] : null;
179
- }
180
- setDefinition(definition) {
181
- this.definition = definition;
182
- this.notifyDefinitionChanged(exports.DefinitionChangeType.rootReplaced, null);
183
- }
184
- notifyDefinitionChanged(changeType, stepId) {
185
- this.onDefinitionChanged.forward({ changeType, stepId });
186
- }
187
- setViewport(viewport) {
188
- this.viewport = viewport;
189
- this.onViewportChanged.forward(viewport);
190
- }
191
- setIsReadonly(isReadonly) {
192
- if (this.isReadonly !== isReadonly) {
193
- this.isReadonly = isReadonly;
194
- this.onIsReadonlyChanged.forward(isReadonly);
195
- }
196
- }
197
- setIsDragging(isDragging) {
198
- if (this.isDragging !== isDragging) {
199
- this.isDragging = isDragging;
200
- this.onIsDraggingChanged.forward(isDragging);
201
- }
202
- }
203
- toggleIsDragDisabled() {
204
- this.isDragDisabled = !this.isDragDisabled;
205
- this.onIsDragDisabledChanged.forward(this.isDragDisabled);
206
- }
207
- setIsToolboxCollapsed(isCollapsed) {
208
- if (this.isToolboxCollapsed !== isCollapsed) {
209
- this.isToolboxCollapsed = isCollapsed;
210
- this.onIsToolboxCollapsedChanged.forward(isCollapsed);
211
- }
212
- }
213
- setIsEditorCollapsed(isCollapsed) {
214
- if (this.isEditorCollapsed !== isCollapsed) {
215
- this.isEditorCollapsed = isCollapsed;
216
- this.onIsEditorCollapsedChanged.forward(isCollapsed);
217
- }
218
- }
219
- }
87
+ })(exports.DefinitionChangeType || (exports.DefinitionChangeType = {}));
220
88
 
221
89
  class Dom {
222
90
  static svg(name, attributes) {
@@ -306,6 +174,31 @@ class ObjectCloner {
306
174
  }
307
175
  }
308
176
 
177
+ class Vector {
178
+ constructor(x, y) {
179
+ this.x = x;
180
+ this.y = y;
181
+ }
182
+ add(v) {
183
+ return new Vector(this.x + v.x, this.y + v.y);
184
+ }
185
+ subtract(v) {
186
+ return new Vector(this.x - v.x, this.y - v.y);
187
+ }
188
+ multiplyByScalar(s) {
189
+ return new Vector(this.x * s, this.y * s);
190
+ }
191
+ divideByScalar(s) {
192
+ return new Vector(this.x / s, this.y / s);
193
+ }
194
+ round() {
195
+ return new Vector(Math.round(this.x), Math.round(this.y));
196
+ }
197
+ distance() {
198
+ return Math.sqrt(Math.pow(this.x, 2) + Math.pow(this.y, 2));
199
+ }
200
+ }
201
+
309
202
  class Uid {
310
203
  static next() {
311
204
  const bytes = new Uint8Array(16);
@@ -314,6 +207,32 @@ class Uid {
314
207
  }
315
208
  }
316
209
 
210
+ class SimpleEvent {
211
+ constructor() {
212
+ this.listeners = [];
213
+ }
214
+ subscribe(listener) {
215
+ this.listeners.push(listener);
216
+ }
217
+ unsubscribe(listener) {
218
+ const index = this.listeners.indexOf(listener);
219
+ if (index >= 0) {
220
+ this.listeners.splice(index, 1);
221
+ }
222
+ else {
223
+ throw new Error('Unknown listener');
224
+ }
225
+ }
226
+ forward(value) {
227
+ if (this.listeners.length > 0) {
228
+ this.listeners.forEach(listener => listener(value));
229
+ }
230
+ }
231
+ count() {
232
+ return this.listeners.length;
233
+ }
234
+ }
235
+
317
236
  function race(timeout, a, b, c) {
318
237
  const value = [undefined, undefined, undefined];
319
238
  const result = new SimpleEvent();
@@ -2172,7 +2091,9 @@ class DefinitionModifier {
2172
2091
  }
2173
2092
  SequenceModifier.insertStep(step, targetSequence, targetIndex);
2174
2093
  this.state.notifyDefinitionChanged(exports.DefinitionChangeType.stepInserted, step.id);
2175
- this.state.setSelectedStepId(step.id);
2094
+ if (!this.configuration.steps.isAutoSelectDisabled) {
2095
+ this.state.setSelectedStepId(step.id);
2096
+ }
2176
2097
  return true;
2177
2098
  }
2178
2099
  isDraggable(step, parentSequence) {
@@ -2191,7 +2112,9 @@ class DefinitionModifier {
2191
2112
  }
2192
2113
  apply();
2193
2114
  this.state.notifyDefinitionChanged(exports.DefinitionChangeType.stepMoved, step.id);
2194
- this.state.setSelectedStepId(step.id);
2115
+ if (!this.configuration.steps.isAutoSelectDisabled) {
2116
+ this.state.setSelectedStepId(step.id);
2117
+ }
2195
2118
  return true;
2196
2119
  }
2197
2120
  isDuplicable(step, parentSequence) {
@@ -2232,13 +2155,101 @@ class DefinitionModifier {
2232
2155
  }
2233
2156
  }
2234
2157
 
2158
+ class DesignerState {
2159
+ constructor(definition, isReadonly, isToolboxCollapsed, isEditorCollapsed) {
2160
+ this.definition = definition;
2161
+ this.isReadonly = isReadonly;
2162
+ this.isToolboxCollapsed = isToolboxCollapsed;
2163
+ this.isEditorCollapsed = isEditorCollapsed;
2164
+ this.onViewportChanged = new SimpleEvent();
2165
+ this.onSelectedStepIdChanged = new SimpleEvent();
2166
+ this.onFolderPathChanged = new SimpleEvent();
2167
+ this.onIsReadonlyChanged = new SimpleEvent();
2168
+ this.onIsDraggingChanged = new SimpleEvent();
2169
+ this.onIsDragDisabledChanged = new SimpleEvent();
2170
+ this.onDefinitionChanged = new SimpleEvent();
2171
+ this.onIsToolboxCollapsedChanged = new SimpleEvent();
2172
+ this.onIsEditorCollapsedChanged = new SimpleEvent();
2173
+ this.viewport = {
2174
+ position: new Vector(0, 0),
2175
+ scale: 1
2176
+ };
2177
+ this.selectedStepId = null;
2178
+ this.folderPath = [];
2179
+ this.isDragging = false;
2180
+ this.isDragDisabled = false;
2181
+ }
2182
+ setSelectedStepId(stepId) {
2183
+ if (this.selectedStepId !== stepId) {
2184
+ this.selectedStepId = stepId;
2185
+ this.onSelectedStepIdChanged.forward(stepId);
2186
+ }
2187
+ }
2188
+ pushStepIdToFolderPath(stepId) {
2189
+ this.folderPath.push(stepId);
2190
+ this.onFolderPathChanged.forward(this.folderPath);
2191
+ }
2192
+ setFolderPath(path) {
2193
+ this.folderPath = path;
2194
+ this.onFolderPathChanged.forward(path);
2195
+ }
2196
+ tryGetLastStepIdFromFolderPath() {
2197
+ return this.folderPath.length > 0 ? this.folderPath[this.folderPath.length - 1] : null;
2198
+ }
2199
+ setDefinition(definition) {
2200
+ this.definition = definition;
2201
+ this.notifyDefinitionChanged(exports.DefinitionChangeType.rootReplaced, null);
2202
+ }
2203
+ notifyDefinitionChanged(changeType, stepId) {
2204
+ this.onDefinitionChanged.forward({ changeType, stepId });
2205
+ }
2206
+ setViewport(viewport) {
2207
+ this.viewport = viewport;
2208
+ this.onViewportChanged.forward(viewport);
2209
+ }
2210
+ setIsReadonly(isReadonly) {
2211
+ if (this.isReadonly !== isReadonly) {
2212
+ this.isReadonly = isReadonly;
2213
+ this.onIsReadonlyChanged.forward(isReadonly);
2214
+ }
2215
+ }
2216
+ setIsDragging(isDragging) {
2217
+ if (this.isDragging !== isDragging) {
2218
+ this.isDragging = isDragging;
2219
+ this.onIsDraggingChanged.forward(isDragging);
2220
+ }
2221
+ }
2222
+ toggleIsDragDisabled() {
2223
+ this.isDragDisabled = !this.isDragDisabled;
2224
+ this.onIsDragDisabledChanged.forward(this.isDragDisabled);
2225
+ }
2226
+ setIsToolboxCollapsed(isCollapsed) {
2227
+ if (this.isToolboxCollapsed !== isCollapsed) {
2228
+ this.isToolboxCollapsed = isCollapsed;
2229
+ this.onIsToolboxCollapsedChanged.forward(isCollapsed);
2230
+ }
2231
+ }
2232
+ setIsEditorCollapsed(isCollapsed) {
2233
+ if (this.isEditorCollapsed !== isCollapsed) {
2234
+ this.isEditorCollapsed = isCollapsed;
2235
+ this.onIsEditorCollapsedChanged.forward(isCollapsed);
2236
+ }
2237
+ }
2238
+ }
2239
+
2235
2240
  class HistoryController {
2236
- static create(state, definitionModifier, configuration) {
2241
+ static create(initialStack, state, definitionModifier, configuration) {
2237
2242
  if (!configuration.undoStackSize || configuration.undoStackSize < 1) {
2238
2243
  throw new Error('Invalid undo stack size');
2239
2244
  }
2240
- const controller = new HistoryController(state, definitionModifier, configuration.undoStackSize);
2241
- controller.remember(exports.DefinitionChangeType.rootReplaced, null);
2245
+ const stack = initialStack || {
2246
+ index: 0,
2247
+ items: []
2248
+ };
2249
+ const controller = new HistoryController(stack, state, definitionModifier, configuration.undoStackSize);
2250
+ if (!initialStack) {
2251
+ controller.remember(exports.DefinitionChangeType.rootReplaced, null);
2252
+ }
2242
2253
  state.onDefinitionChanged.subscribe(event => {
2243
2254
  if (event.changeType !== exports.DefinitionChangeType.rootReplaced) {
2244
2255
  controller.remember(event.changeType, event.stepId);
@@ -2246,49 +2257,51 @@ class HistoryController {
2246
2257
  });
2247
2258
  return controller;
2248
2259
  }
2249
- constructor(state, definitionModifier, stackSize) {
2260
+ constructor(stack, state, definitionModifier, stackSize) {
2261
+ this.stack = stack;
2250
2262
  this.state = state;
2251
2263
  this.definitionModifier = definitionModifier;
2252
2264
  this.stackSize = stackSize;
2253
- this.stack = [];
2254
- this.currentIndex = 0;
2255
2265
  }
2256
2266
  canUndo() {
2257
- return this.currentIndex > 1;
2267
+ return this.stack.index > 1;
2258
2268
  }
2259
2269
  undo() {
2260
- this.currentIndex--;
2270
+ this.stack.index--;
2261
2271
  this.commit();
2262
2272
  }
2263
2273
  canRedo() {
2264
- return this.currentIndex < this.stack.length;
2274
+ return this.stack.index < this.stack.items.length;
2265
2275
  }
2266
2276
  redo() {
2267
- this.currentIndex++;
2277
+ this.stack.index++;
2268
2278
  this.commit();
2269
2279
  }
2280
+ dump() {
2281
+ return Object.assign({}, this.stack);
2282
+ }
2270
2283
  remember(changeType, stepId) {
2271
2284
  const definition = ObjectCloner.deepClone(this.state.definition);
2272
- if (this.stack.length > 0 && this.currentIndex === this.stack.length) {
2273
- const lastItem = this.stack[this.stack.length - 1];
2285
+ if (this.stack.items.length > 0 && this.stack.index === this.stack.items.length) {
2286
+ const lastItem = this.stack.items[this.stack.items.length - 1];
2274
2287
  if (areItemsEqual(lastItem, changeType, stepId)) {
2275
2288
  lastItem.definition = definition;
2276
2289
  return;
2277
2290
  }
2278
2291
  }
2279
- this.stack.splice(this.currentIndex);
2280
- this.stack.push({
2292
+ this.stack.items.splice(this.stack.index);
2293
+ this.stack.items.push({
2281
2294
  definition,
2282
2295
  changeType,
2283
2296
  stepId
2284
2297
  });
2285
- if (this.stack.length > this.stackSize) {
2286
- this.stack.splice(0, this.stack.length - this.stackSize - 1);
2298
+ if (this.stack.items.length > this.stackSize) {
2299
+ this.stack.items.splice(0, this.stack.items.length - this.stackSize - 1);
2287
2300
  }
2288
- this.currentIndex = this.stack.length;
2301
+ this.stack.index = this.stack.items.length;
2289
2302
  }
2290
2303
  commit() {
2291
- const definition = ObjectCloner.deepClone(this.stack[this.currentIndex - 1].definition);
2304
+ const definition = ObjectCloner.deepClone(this.stack.items[this.stack.index - 1].definition);
2292
2305
  this.definitionModifier.replaceDefinition(definition);
2293
2306
  }
2294
2307
  }
@@ -2361,7 +2374,7 @@ class DesignerContext {
2361
2374
  const definitionModifier = new DefinitionModifier(definitionWalker, state, configuration);
2362
2375
  let historyController = undefined;
2363
2376
  if (configuration.undoStackSize) {
2364
- historyController = HistoryController.create(state, definitionModifier, configuration);
2377
+ historyController = HistoryController.create(configuration.undoStack, state, definitionModifier, configuration);
2365
2378
  }
2366
2379
  const componentContext = ComponentContext.create(configuration.steps, configuration.validator, state, stepExtensionResolver, services);
2367
2380
  return new DesignerContext(theme, state, configuration, services, componentContext, definitionWalker, definitionModifier, layoutController, workspaceController, behaviorController, historyController);
@@ -4112,24 +4125,25 @@ class Designer {
4112
4125
  const designerContext = DesignerContext.create(placeholder, startDefinition, config, services);
4113
4126
  const designerApi = DesignerApi.create(designerContext);
4114
4127
  const view = DesignerView.create(placeholder, designerContext, designerApi);
4115
- const designer = new Designer(view, designerContext.state, designerContext.definitionWalker, designerApi);
4128
+ const designer = new Designer(view, designerContext.state, designerContext.definitionWalker, designerContext.historyController, designerApi);
4116
4129
  view.workspace.onReady.subscribe(() => designer.onReady.forward());
4117
4130
  designerContext.state.onDefinitionChanged.subscribe(() => {
4118
4131
  setTimeout(() => designer.onDefinitionChanged.forward(designerContext.state.definition));
4119
4132
  });
4120
4133
  designerContext.state.onSelectedStepIdChanged.subscribe(() => designer.onSelectedStepIdChanged.forward(designerContext.state.selectedStepId));
4121
- designer.state.onIsToolboxCollapsedChanged.subscribe(isCollapsed => {
4134
+ designerContext.state.onIsToolboxCollapsedChanged.subscribe(isCollapsed => {
4122
4135
  designer.onIsToolboxCollapsedChanged.forward(isCollapsed);
4123
4136
  });
4124
- designer.state.onIsEditorCollapsedChanged.subscribe(isCollapsed => {
4137
+ designerContext.state.onIsEditorCollapsedChanged.subscribe(isCollapsed => {
4125
4138
  designer.onIsEditorCollapsedChanged.forward(isCollapsed);
4126
4139
  });
4127
4140
  return designer;
4128
4141
  }
4129
- constructor(view, state, walker, api) {
4142
+ constructor(view, state, walker, historyController, api) {
4130
4143
  this.view = view;
4131
4144
  this.state = state;
4132
4145
  this.walker = walker;
4146
+ this.historyController = historyController;
4133
4147
  this.api = api;
4134
4148
  /**
4135
4149
  * @description Fires when the designer is initialized and ready to use.
@@ -4242,6 +4256,15 @@ class Designer {
4242
4256
  setIsEditorCollapsed(isCollapsed) {
4243
4257
  this.state.setIsEditorCollapsed(isCollapsed);
4244
4258
  }
4259
+ /**
4260
+ * @description Dump the undo stack.
4261
+ */
4262
+ dumpUndoStack() {
4263
+ if (!this.historyController) {
4264
+ throw new Error('Undo feature is not activated');
4265
+ }
4266
+ return this.historyController.dump();
4267
+ }
4245
4268
  /**
4246
4269
  * @param needle A step, a sequence or a step id.
4247
4270
  * @returns parent steps and branch names.