npm - sequential-workflow-designer - Versions diffs - 0.19.1 → 0.19.2 - Mend

sequential-workflow-designer 0.19.1 → 0.19.2

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.

Files changed (5) hide show

package/README.md CHANGED Viewed

@@ -99,10 +99,10 @@ Add the below code to your head section in HTML document.
 ```html
 <head>
 ...
-<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.1/css/designer.css" rel="stylesheet">
-<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.1/css/designer-light.css" rel="stylesheet">
-<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.1/css/designer-dark.css" rel="stylesheet">
-<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.1/dist/index.umd.js"></script>
+<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.2/css/designer.css" rel="stylesheet">
+<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.2/css/designer-light.css" rel="stylesheet">
+<link href="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.2/css/designer-dark.css" rel="stylesheet">
+<script src="https://cdn.jsdelivr.net/npm/sequential-workflow-designer@0.19.2/dist/index.umd.js"></script>
 ```
 Call the designer by:

package/dist/index.umd.js CHANGED Viewed

@@ -2795,7 +2795,7 @@
 	    bindClick(handler) {
 	        this.canvas.addEventListener('mousedown', e => {
 	            e.preventDefault();
-	            handler(readMousePosition(e), e.target, e.button);
+	            handler(readMousePosition(e), e.target, e.button, e.altKey);
 	        }, false);
 	        this.canvas.addEventListener('touchstart', e => {
 	            e.preventDefault();
@@ -2803,7 +2803,7 @@
 	            const element = document.elementFromPoint(clientPosition.x, clientPosition.y);
 	            if (element) {
 	                const position = readTouchPosition(e);
-	                handler(position, element, 0);
+	                handler(position, element, 0, false);
 	            }
 	        }, listenerOptions$1);
 	    }
@@ -2863,8 +2863,8 @@
 	}
 	class SelectStepBehavior {
-	    static create(pressedStepComponent, isMiddleButton, context) {
-	        const isDragDisabled = isMiddleButton ||
+	    static create(pressedStepComponent, forceMove, context) {
+	        const isDragDisabled = forceMove ||
 	            context.state.isDragDisabled ||
 	            !context.stateModifier.isDraggable(pressedStepComponent.step, pressedStepComponent.parentSequence);
 	        return new SelectStepBehavior(pressedStepComponent, isDragDisabled, context.state, context.stateModifier, context);
@@ -2953,13 +2953,13 @@
 	    constructor(context) {
 	        this.context = context;
 	    }
-	    resolve(commandOrNull, element, isMiddleButton) {
+	    resolve(commandOrNull, element, forceMove) {
 	        if (!commandOrNull) {
-	            return MoveViewportBehavior.create(!isMiddleButton, this.context);
+	            return MoveViewportBehavior.create(!forceMove, this.context);
 	        }
 	        switch (commandOrNull.type) {
 	            case exports.ClickCommandType.selectStep:
-	                return SelectStepBehavior.create(commandOrNull.component, isMiddleButton, this.context);
+	                return SelectStepBehavior.create(commandOrNull.component, forceMove, this.context);
 	            case exports.ClickCommandType.rerenderStep:
 	                return PressingBehavior.create(element, new RerenderStepPressingBehaviorHandler(this.context));
 	            case exports.ClickCommandType.openFolder:
@@ -3195,9 +3195,9 @@
 	        race(0, designerContext.state.onDefinitionChanged, designerContext.state.onSelectedStepIdChanged, designerContext.state.onFolderPathChanged).subscribe(r => {
 	            workspace.onStateChanged(r[0], r[1], r[2]);
 	        });
-	        view.bindClick((p, t, b) => workspace.onClick(p, t, b));
-	        view.bindWheel(e => workspace.onWheel(e));
-	        view.bindContextMenu((p, t) => workspace.onContextMenu(p, t));
+	        view.bindClick(workspace.onClick);
+	        view.bindWheel(workspace.onWheel);
+	        view.bindContextMenu(workspace.onContextMenu);
 	        return workspace;
 	    }
 	    constructor(view, definitionWalker, state, behaviorController, wheelController, contextMenuController, clickBehaviorResolver, viewportApi, services) {
@@ -3214,6 +3214,25 @@
 	        this.isValid = false;
 	        this.selectedStepComponent = null;
 	        this.validationErrorBadgeIndex = null;
+	        this.onClick = (position, target, buttonIndex, altKey) => {
+	            const isPrimaryButton = buttonIndex === 0;
+	            const isMiddleButton = buttonIndex === 1;
+	            if (isPrimaryButton || isMiddleButton) {
+	                const forceMove = isMiddleButton || altKey;
+	                const commandOrNull = this.resolveClick(target, position);
+	                const behavior = this.clickBehaviorResolver.resolve(commandOrNull, target, forceMove);
+	                this.behaviorController.start(position, behavior);
+	            }
+	        };
+	        this.onWheel = (e) => {
+	            e.preventDefault();
+	            e.stopPropagation();
+	            this.wheelController.onWheel(e);
+	        };
+	        this.onContextMenu = (position, target) => {
+	            const commandOrNull = this.resolveClick(target, position);
+	            this.contextMenuController.tryOpen(position, commandOrNull);
+	        };
 	    }
 	    updateRootComponent() {
 	        this.selectedStepComponent = null;
@@ -3278,24 +3297,6 @@
 	        this.contextMenuController.destroy();
 	        this.view.destroy();
 	    }
-	    onClick(position, target, buttonIndex) {
-	        const isPrimaryButton = buttonIndex === 0;
-	        const isMiddleButton = buttonIndex === 1;
-	        if (isPrimaryButton || isMiddleButton) {
-	            const commandOrNull = this.resolveClick(target, position);
-	            const behavior = this.clickBehaviorResolver.resolve(commandOrNull, target, isMiddleButton);
-	            this.behaviorController.start(position, behavior);
-	        }
-	    }
-	    onWheel(e) {
-	        e.preventDefault();
-	        e.stopPropagation();
-	        this.wheelController.onWheel(e);
-	    }
-	    onContextMenu(position, target) {
-	        const commandOrNull = this.resolveClick(target, position);
-	        this.contextMenuController.tryOpen(position, commandOrNull);
-	    }
 	    onIsDraggingChanged(isDragging) {
 	        this.getRootComponent().setIsDragging(isDragging);
 	    }
@@ -4444,25 +4445,19 @@
 	    }
 	}
-	function throwDepreciatedError(propertyName, groupName) {
-	    throw new Error(`The "${propertyName}" property in the "${groupName}" configuration is depreciated`);
-	}
 	function validateConfiguration(configuration) {
-	    if (configuration.controlBar === undefined) {
-	        throw new Error('The "controlBar" property is not defined in the configuration');
-	    }
-	    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-	    if (configuration.toolbox && configuration.toolbox.isHidden !== undefined) {
-	        throwDepreciatedError('isHidden', 'toolbox');
-	    }
-	    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-	    if (configuration.editors && configuration.editors.isHidden !== undefined) {
-	        throwDepreciatedError('isHidden', 'editors');
-	    }
-	    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-	    if (configuration.steps.validator) {
-	        throwDepreciatedError('validator', 'steps');
+	    const validateProperty = (key) => {
+	        if (configuration[key] === undefined) {
+	            throw new Error(`The "${key}" property is not defined in the configuration`);
+	        }
+	    };
+	    if (!configuration) {
+	        throw new Error('Configuration is not defined');
 	    }
+	    validateProperty('steps');
+	    validateProperty('toolbox');
+	    validateProperty('editors');
+	    validateProperty('controlBar');
 	}
 	class Designer {
@@ -4475,16 +4470,13 @@
 	     */
 	    static create(placeholder, startDefinition, configuration) {
 	        if (!placeholder) {
-	            throw new Error('Placeholder is not set');
+	            throw new Error('Placeholder is not defined');
 	        }
 	        if (!isElementAttached(placeholder)) {
 	            throw new Error('Placeholder is not attached to the DOM');
 	        }
 	        if (!startDefinition) {
-	            throw new Error('Start definition is not set');
-	        }
-	        if (!configuration) {
-	            throw new Error('Configuration is not set');
+	            throw new Error('Start definition is not defined');
 	        }
 	        const config = configuration;
 	        validateConfiguration(config);

package/lib/cjs/index.cjs CHANGED Viewed

@@ -2610,7 +2610,7 @@ class WorkspaceView {
     bindClick(handler) {
         this.canvas.addEventListener('mousedown', e => {
             e.preventDefault();
-            handler(readMousePosition(e), e.target, e.button);
+            handler(readMousePosition(e), e.target, e.button, e.altKey);
         }, false);
         this.canvas.addEventListener('touchstart', e => {
             e.preventDefault();
@@ -2618,7 +2618,7 @@ class WorkspaceView {
             const element = document.elementFromPoint(clientPosition.x, clientPosition.y);
             if (element) {
                 const position = readTouchPosition(e);
-                handler(position, element, 0);
+                handler(position, element, 0, false);
             }
         }, listenerOptions$1);
     }
@@ -2678,8 +2678,8 @@ class MoveViewportBehavior {
 }
 class SelectStepBehavior {
-    static create(pressedStepComponent, isMiddleButton, context) {
-        const isDragDisabled = isMiddleButton ||
+    static create(pressedStepComponent, forceMove, context) {
+        const isDragDisabled = forceMove ||
             context.state.isDragDisabled ||
             !context.stateModifier.isDraggable(pressedStepComponent.step, pressedStepComponent.parentSequence);
         return new SelectStepBehavior(pressedStepComponent, isDragDisabled, context.state, context.stateModifier, context);
@@ -2768,13 +2768,13 @@ class ClickBehaviorResolver {
     constructor(context) {
         this.context = context;
     }
-    resolve(commandOrNull, element, isMiddleButton) {
+    resolve(commandOrNull, element, forceMove) {
         if (!commandOrNull) {
-            return MoveViewportBehavior.create(!isMiddleButton, this.context);
+            return MoveViewportBehavior.create(!forceMove, this.context);
         }
         switch (commandOrNull.type) {
             case exports.ClickCommandType.selectStep:
-                return SelectStepBehavior.create(commandOrNull.component, isMiddleButton, this.context);
+                return SelectStepBehavior.create(commandOrNull.component, forceMove, this.context);
             case exports.ClickCommandType.rerenderStep:
                 return PressingBehavior.create(element, new RerenderStepPressingBehaviorHandler(this.context));
             case exports.ClickCommandType.openFolder:
@@ -3010,9 +3010,9 @@ class Workspace {
         race(0, designerContext.state.onDefinitionChanged, designerContext.state.onSelectedStepIdChanged, designerContext.state.onFolderPathChanged).subscribe(r => {
             workspace.onStateChanged(r[0], r[1], r[2]);
         });
-        view.bindClick((p, t, b) => workspace.onClick(p, t, b));
-        view.bindWheel(e => workspace.onWheel(e));
-        view.bindContextMenu((p, t) => workspace.onContextMenu(p, t));
+        view.bindClick(workspace.onClick);
+        view.bindWheel(workspace.onWheel);
+        view.bindContextMenu(workspace.onContextMenu);
         return workspace;
     }
     constructor(view, definitionWalker, state, behaviorController, wheelController, contextMenuController, clickBehaviorResolver, viewportApi, services) {
@@ -3029,6 +3029,25 @@ class Workspace {
         this.isValid = false;
         this.selectedStepComponent = null;
         this.validationErrorBadgeIndex = null;
+        this.onClick = (position, target, buttonIndex, altKey) => {
+            const isPrimaryButton = buttonIndex === 0;
+            const isMiddleButton = buttonIndex === 1;
+            if (isPrimaryButton || isMiddleButton) {
+                const forceMove = isMiddleButton || altKey;
+                const commandOrNull = this.resolveClick(target, position);
+                const behavior = this.clickBehaviorResolver.resolve(commandOrNull, target, forceMove);
+                this.behaviorController.start(position, behavior);
+            }
+        };
+        this.onWheel = (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+            this.wheelController.onWheel(e);
+        };
+        this.onContextMenu = (position, target) => {
+            const commandOrNull = this.resolveClick(target, position);
+            this.contextMenuController.tryOpen(position, commandOrNull);
+        };
     }
     updateRootComponent() {
         this.selectedStepComponent = null;
@@ -3093,24 +3112,6 @@ class Workspace {
         this.contextMenuController.destroy();
         this.view.destroy();
     }
-    onClick(position, target, buttonIndex) {
-        const isPrimaryButton = buttonIndex === 0;
-        const isMiddleButton = buttonIndex === 1;
-        if (isPrimaryButton || isMiddleButton) {
-            const commandOrNull = this.resolveClick(target, position);
-            const behavior = this.clickBehaviorResolver.resolve(commandOrNull, target, isMiddleButton);
-            this.behaviorController.start(position, behavior);
-        }
-    }
-    onWheel(e) {
-        e.preventDefault();
-        e.stopPropagation();
-        this.wheelController.onWheel(e);
-    }
-    onContextMenu(position, target) {
-        const commandOrNull = this.resolveClick(target, position);
-        this.contextMenuController.tryOpen(position, commandOrNull);
-    }
     onIsDraggingChanged(isDragging) {
         this.getRootComponent().setIsDragging(isDragging);
     }
@@ -4259,25 +4260,19 @@ function setDefaults(services, configuration) {
     }
 }
-function throwDepreciatedError(propertyName, groupName) {
-    throw new Error(`The "${propertyName}" property in the "${groupName}" configuration is depreciated`);
-}
 function validateConfiguration(configuration) {
-    if (configuration.controlBar === undefined) {
-        throw new Error('The "controlBar" property is not defined in the configuration');
-    }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    if (configuration.toolbox && configuration.toolbox.isHidden !== undefined) {
-        throwDepreciatedError('isHidden', 'toolbox');
-    }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    if (configuration.editors && configuration.editors.isHidden !== undefined) {
-        throwDepreciatedError('isHidden', 'editors');
-    }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    if (configuration.steps.validator) {
-        throwDepreciatedError('validator', 'steps');
+    const validateProperty = (key) => {
+        if (configuration[key] === undefined) {
+            throw new Error(`The "${key}" property is not defined in the configuration`);
+        }
+    };
+    if (!configuration) {
+        throw new Error('Configuration is not defined');
     }
+    validateProperty('steps');
+    validateProperty('toolbox');
+    validateProperty('editors');
+    validateProperty('controlBar');
 }
 class Designer {
@@ -4290,16 +4285,13 @@ class Designer {
      */
     static create(placeholder, startDefinition, configuration) {
         if (!placeholder) {
-            throw new Error('Placeholder is not set');
+            throw new Error('Placeholder is not defined');
         }
         if (!isElementAttached(placeholder)) {
             throw new Error('Placeholder is not attached to the DOM');
         }
         if (!startDefinition) {
-            throw new Error('Start definition is not set');
-        }
-        if (!configuration) {
-            throw new Error('Configuration is not set');
+            throw new Error('Start definition is not defined');
         }
         const config = configuration;
         validateConfiguration(config);

package/lib/esm/index.js CHANGED Viewed

@@ -2609,7 +2609,7 @@ class WorkspaceView {
     bindClick(handler) {
         this.canvas.addEventListener('mousedown', e => {
             e.preventDefault();
-            handler(readMousePosition(e), e.target, e.button);
+            handler(readMousePosition(e), e.target, e.button, e.altKey);
         }, false);
         this.canvas.addEventListener('touchstart', e => {
             e.preventDefault();
@@ -2617,7 +2617,7 @@ class WorkspaceView {
             const element = document.elementFromPoint(clientPosition.x, clientPosition.y);
             if (element) {
                 const position = readTouchPosition(e);
-                handler(position, element, 0);
+                handler(position, element, 0, false);
             }
         }, listenerOptions$1);
     }
@@ -2677,8 +2677,8 @@ class MoveViewportBehavior {
 }
 class SelectStepBehavior {
-    static create(pressedStepComponent, isMiddleButton, context) {
-        const isDragDisabled = isMiddleButton ||
+    static create(pressedStepComponent, forceMove, context) {
+        const isDragDisabled = forceMove ||
             context.state.isDragDisabled ||
             !context.stateModifier.isDraggable(pressedStepComponent.step, pressedStepComponent.parentSequence);
         return new SelectStepBehavior(pressedStepComponent, isDragDisabled, context.state, context.stateModifier, context);
@@ -2767,13 +2767,13 @@ class ClickBehaviorResolver {
     constructor(context) {
         this.context = context;
     }
-    resolve(commandOrNull, element, isMiddleButton) {
+    resolve(commandOrNull, element, forceMove) {
         if (!commandOrNull) {
-            return MoveViewportBehavior.create(!isMiddleButton, this.context);
+            return MoveViewportBehavior.create(!forceMove, this.context);
         }
         switch (commandOrNull.type) {
             case ClickCommandType.selectStep:
-                return SelectStepBehavior.create(commandOrNull.component, isMiddleButton, this.context);
+                return SelectStepBehavior.create(commandOrNull.component, forceMove, this.context);
             case ClickCommandType.rerenderStep:
                 return PressingBehavior.create(element, new RerenderStepPressingBehaviorHandler(this.context));
             case ClickCommandType.openFolder:
@@ -3009,9 +3009,9 @@ class Workspace {
         race(0, designerContext.state.onDefinitionChanged, designerContext.state.onSelectedStepIdChanged, designerContext.state.onFolderPathChanged).subscribe(r => {
             workspace.onStateChanged(r[0], r[1], r[2]);
         });
-        view.bindClick((p, t, b) => workspace.onClick(p, t, b));
-        view.bindWheel(e => workspace.onWheel(e));
-        view.bindContextMenu((p, t) => workspace.onContextMenu(p, t));
+        view.bindClick(workspace.onClick);
+        view.bindWheel(workspace.onWheel);
+        view.bindContextMenu(workspace.onContextMenu);
         return workspace;
     }
     constructor(view, definitionWalker, state, behaviorController, wheelController, contextMenuController, clickBehaviorResolver, viewportApi, services) {
@@ -3028,6 +3028,25 @@ class Workspace {
         this.isValid = false;
         this.selectedStepComponent = null;
         this.validationErrorBadgeIndex = null;
+        this.onClick = (position, target, buttonIndex, altKey) => {
+            const isPrimaryButton = buttonIndex === 0;
+            const isMiddleButton = buttonIndex === 1;
+            if (isPrimaryButton || isMiddleButton) {
+                const forceMove = isMiddleButton || altKey;
+                const commandOrNull = this.resolveClick(target, position);
+                const behavior = this.clickBehaviorResolver.resolve(commandOrNull, target, forceMove);
+                this.behaviorController.start(position, behavior);
+            }
+        };
+        this.onWheel = (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+            this.wheelController.onWheel(e);
+        };
+        this.onContextMenu = (position, target) => {
+            const commandOrNull = this.resolveClick(target, position);
+            this.contextMenuController.tryOpen(position, commandOrNull);
+        };
     }
     updateRootComponent() {
         this.selectedStepComponent = null;
@@ -3092,24 +3111,6 @@ class Workspace {
         this.contextMenuController.destroy();
         this.view.destroy();
     }
-    onClick(position, target, buttonIndex) {
-        const isPrimaryButton = buttonIndex === 0;
-        const isMiddleButton = buttonIndex === 1;
-        if (isPrimaryButton || isMiddleButton) {
-            const commandOrNull = this.resolveClick(target, position);
-            const behavior = this.clickBehaviorResolver.resolve(commandOrNull, target, isMiddleButton);
-            this.behaviorController.start(position, behavior);
-        }
-    }
-    onWheel(e) {
-        e.preventDefault();
-        e.stopPropagation();
-        this.wheelController.onWheel(e);
-    }
-    onContextMenu(position, target) {
-        const commandOrNull = this.resolveClick(target, position);
-        this.contextMenuController.tryOpen(position, commandOrNull);
-    }
     onIsDraggingChanged(isDragging) {
         this.getRootComponent().setIsDragging(isDragging);
     }
@@ -4258,25 +4259,19 @@ function setDefaults(services, configuration) {
     }
 }
-function throwDepreciatedError(propertyName, groupName) {
-    throw new Error(`The "${propertyName}" property in the "${groupName}" configuration is depreciated`);
-}
 function validateConfiguration(configuration) {
-    if (configuration.controlBar === undefined) {
-        throw new Error('The "controlBar" property is not defined in the configuration');
-    }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    if (configuration.toolbox && configuration.toolbox.isHidden !== undefined) {
-        throwDepreciatedError('isHidden', 'toolbox');
-    }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    if (configuration.editors && configuration.editors.isHidden !== undefined) {
-        throwDepreciatedError('isHidden', 'editors');
-    }
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    if (configuration.steps.validator) {
-        throwDepreciatedError('validator', 'steps');
+    const validateProperty = (key) => {
+        if (configuration[key] === undefined) {
+            throw new Error(`The "${key}" property is not defined in the configuration`);
+        }
+    };
+    if (!configuration) {
+        throw new Error('Configuration is not defined');
     }
+    validateProperty('steps');
+    validateProperty('toolbox');
+    validateProperty('editors');
+    validateProperty('controlBar');
 }
 class Designer {
@@ -4289,16 +4284,13 @@ class Designer {
      */
     static create(placeholder, startDefinition, configuration) {
         if (!placeholder) {
-            throw new Error('Placeholder is not set');
+            throw new Error('Placeholder is not defined');
         }
         if (!isElementAttached(placeholder)) {
             throw new Error('Placeholder is not attached to the DOM');
         }
         if (!startDefinition) {
-            throw new Error('Start definition is not set');
-        }
-        if (!configuration) {
-            throw new Error('Configuration is not set');
+            throw new Error('Start definition is not defined');
         }
         const config = configuration;
         validateConfiguration(config);

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
 	"name": "sequential-workflow-designer",
 	"description": "Customizable no-code component for building flow-based programming applications.",
-	"version": "0.19.1",
+	"version": "0.19.2",
 	"type": "module",
 	"main": "./lib/esm/index.js",
 	"types": "./lib/index.d.ts",