@node-red/editor-client 2.1.6 → 2.2.2

package/public/red/red.js

@@ -647,8 +647,7 @@ var RED = (function() {
 
         $(".red-ui-header-toolbar").show();
 
-
-        RED.sidebar.show(":first");
+        RED.sidebar.show(":first", true);
 
         setTimeout(function() {
             loader.end();
@@ -3539,7 +3538,9 @@ RED.state = {
     PANNING: 10,
     SELECTING_NODE: 11,
     GROUP_DRAGGING: 12,
-    GROUP_RESIZE: 13
+    GROUP_RESIZE: 13,
+    DETACHED_DRAGGING: 14,
+    SLICING: 15
 }
 ;RED.plugins = (function() {
     var plugins = {};
@@ -3604,6 +3605,9 @@ RED.state = {
  **/
 RED.nodes = (function() {
 
+    var PORT_TYPE_INPUT = 1;
+    var PORT_TYPE_OUTPUT = 0;
+
     var node_defs = {};
     var linkTabMap = {};
 
@@ -4186,6 +4190,14 @@ RED.nodes = (function() {
         RED.events.emit('nodes:add',n);
     }
     function addLink(l) {
+        if (nodeLinks[l.source.id]) {
+            const isUnique = nodeLinks[l.source.id].out.every(function(link) {
+                return link.sourcePort !== l.sourcePort || link.target.id !== l.target.id
+            })
+            if (!isUnique) {
+                return
+            }
+        }
         links.push(l);
         if (l.source) {
             // Possible the node hasn't been added yet
@@ -6047,6 +6059,144 @@ RED.nodes = (function() {
         return helpContent;
     }
 
+    function getNodeIslands(nodes) {
+        var selectedNodes = new Set(nodes);
+        // Maps node => island index
+        var nodeToIslandIndex = new Map();
+        // Maps island index => [nodes in island]
+        var islandIndexToNodes = new Map();
+        var internalLinks = new Set();
+        nodes.forEach((node, index) => {
+            nodeToIslandIndex.set(node,index);
+            islandIndexToNodes.set(index, [node]);
+            var inboundLinks = RED.nodes.getNodeLinks(node, PORT_TYPE_INPUT);
+            var outboundLinks = RED.nodes.getNodeLinks(node, PORT_TYPE_OUTPUT);
+            inboundLinks.forEach(l => {
+                if (selectedNodes.has(l.source)) {
+                    internalLinks.add(l)
+                }
+            })
+            outboundLinks.forEach(l => {
+                if (selectedNodes.has(l.target)) {
+                    internalLinks.add(l)
+                }
+            })
+        })
+
+        internalLinks.forEach(l => {
+            let source = l.source;
+            let target = l.target;
+            if (nodeToIslandIndex.get(source) !== nodeToIslandIndex.get(target)) {
+                let sourceIsland = nodeToIslandIndex.get(source);
+                let islandToMove = nodeToIslandIndex.get(target);
+                let nodesToMove = islandIndexToNodes.get(islandToMove);
+                nodesToMove.forEach(n => {
+                    nodeToIslandIndex.set(n,sourceIsland);
+                    islandIndexToNodes.get(sourceIsland).push(n);
+                })
+                islandIndexToNodes.delete(islandToMove);
+            }
+        })
+        const result = [];
+        islandIndexToNodes.forEach((nodes,index) => {
+            result.push(nodes);
+        })
+        return result;
+    }
+
+    function detachNodes(nodes) {
+        let allSelectedNodes = [];
+        nodes.forEach(node => {
+            if (node.type === 'group') {
+                let groupNodes = RED.group.getNodes(node,true,true);
+                allSelectedNodes = allSelectedNodes.concat(groupNodes);
+            } else {
+                allSelectedNodes.push(node);
+            }
+        })
+        if (allSelectedNodes.length > 0 ) {
+            const nodeIslands = RED.nodes.getNodeIslands(allSelectedNodes);
+            let removedLinks = [];
+            let newLinks = [];
+            let createdLinkIds = new Set();
+
+            nodeIslands.forEach(nodes => {
+                let selectedNodes = new Set(nodes);
+                let allInboundLinks = [];
+                let allOutboundLinks = [];
+                // Identify links that enter or exit this island of nodes
+                nodes.forEach(node => {
+                    var inboundLinks = RED.nodes.getNodeLinks(node, PORT_TYPE_INPUT);
+                    var outboundLinks = RED.nodes.getNodeLinks(node, PORT_TYPE_OUTPUT);
+                    inboundLinks.forEach(l => {
+                        if (!selectedNodes.has(l.source)) {
+                            allInboundLinks.push(l)
+                        }
+                    })
+                    outboundLinks.forEach(l => {
+                        if (!selectedNodes.has(l.target)) {
+                            allOutboundLinks.push(l)
+                        }
+                    })
+                });
+
+
+                // Identify the links to restore
+                allInboundLinks.forEach(inLink => {
+                    // For Each inbound link,
+                    //  - get source node.
+                    //  - trace through to all outbound links
+                    let sourceNode = inLink.source;
+                    let targetNodes = new Set();
+                    let visited = new Set();
+                    let stack = [inLink.target];
+                    while (stack.length > 0) {
+                        let node = stack.pop(stack);
+                        visited.add(node)
+                        let links = RED.nodes.getNodeLinks(node, PORT_TYPE_OUTPUT);
+                        links.forEach(l => {
+                            if (visited.has(l.target)) {
+                                return
+                            }
+                            visited.add(l.target);
+                            if (selectedNodes.has(l.target)) {
+                                // internal link
+                                stack.push(l.target)
+                            } else {
+                                targetNodes.add(l.target)
+                            }
+                        })
+                    }
+                    targetNodes.forEach(target => {
+                        let linkId = `${sourceNode.id}[${inLink.sourcePort}] -> ${target.id}`
+                        if (!createdLinkIds.has(linkId)) {
+                            createdLinkIds.add(linkId);
+                            let link = {
+                                source: sourceNode,
+                                sourcePort: inLink.sourcePort,
+                                target: target
+                            }
+                            let existingLinks = RED.nodes.filterLinks(link)
+                            if (existingLinks.length === 0) {
+                                newLinks.push(link);
+                            }
+                        }
+                    })
+                })
+
+                // 2. delete all those links
+                allInboundLinks.forEach(l => { RED.nodes.removeLink(l); removedLinks.push(l)})
+                allOutboundLinks.forEach(l => { RED.nodes.removeLink(l); removedLinks.push(l)})
+            })
+
+            newLinks.forEach(l => RED.nodes.addLink(l));
+            return {
+                newLinks,
+                removedLinks
+            }
+        }
+    }
+
     return {
         init: function() {
             RED.events.on("registry:node-type-added",function(type) {
@@ -6128,7 +6278,7 @@ RED.nodes = (function() {
         add: addNode,
         remove: removeNode,
         clear: clear,
-
+        detachNodes: detachNodes,
         moveNodesForwards: moveNodesForwards,
         moveNodesBackwards: moveNodesBackwards,
         moveNodesToFront: moveNodesToFront,
@@ -6140,7 +6290,20 @@ RED.nodes = (function() {
 
         addLink: addLink,
         removeLink: removeLink,
-
+        getNodeLinks: function(id, portType) {
+            if (typeof id !== 'string') {
+                id = id.id;
+            }
+            if (nodeLinks[id]) {
+                if (portType === 1) {
+                    // Return cloned arrays so they can be safely modified by caller
+                    return [].concat(nodeLinks[id].in)
+                } else {
+                    return [].concat(nodeLinks[id].out)
+                }
+            }
+            return [];
+        },
         addWorkspace: addWorkspace,
         removeWorkspace: removeWorkspace,
         getWorkspaceOrder: function() { return workspacesOrder },
@@ -6214,6 +6377,7 @@ RED.nodes = (function() {
         getAllFlowNodes: getAllFlowNodes,
         getAllUpstreamNodes: getAllUpstreamNodes,
         getAllDownstreamNodes: getAllDownstreamNodes,
+        getNodeIslands: getNodeIslands,
         createExportableNodeSet: createExportableNodeSet,
         createCompleteNodeSet: createCompleteNodeSet,
         updateConfigNodeUsers: updateConfigNodeUsers,
@@ -7734,6 +7898,13 @@ RED.history = (function() {
         peek: function() {
             return undoHistory[undoHistory.length-1];
         },
+        replace: function(ev) {
+            if (undoHistory.length === 0) {
+                RED.history.push(ev);
+            } else {
+                undoHistory[undoHistory.length-1] = ev;
+            }
+        },
         clear: function() {
             undoHistory = [];
             redoHistory = [];
@@ -11491,6 +11662,15 @@ RED.popover = (function() {
             }
         }
 
+        target.on("remove", function (ev) {
+            if (timer) {
+                clearTimeout(timer);
+            }
+            if (active) {
+                active = false;
+                setTimeout(closePopup,delay.hide);
+            }
+        });
         if (trigger === 'hover') {
             target.on('mouseenter',function(e) {
                 clearTimeout(timer);
@@ -12536,23 +12716,19 @@ RED.tabs = (function() {
                 }
             }
 
-            li.one("transitionend", function(evt) {
-                li.remove();
-                if (tabs[id].pinned) {
-                    pinnedTabsCount--;
-                }
-                if (options.onremove) {
-                    options.onremove(tabs[id]);
-                }
-                delete tabs[id];
-                updateTabWidths();
-                if (collapsibleMenu) {
-                    collapsibleMenu.remove();
-                    collapsibleMenu = null;
-                }
-            })
-            li.addClass("hide-tab");
-            li.width(0);
+            li.remove();
+            if (tabs[id].pinned) {
+                pinnedTabsCount--;
+            }
+            if (options.onremove) {
+                options.onremove(tabs[id]);
+            }
+            delete tabs[id];
+            updateTabWidths();
+            if (collapsibleMenu) {
+                collapsibleMenu.remove();
+                collapsibleMenu = null;
+            }
         }
 
         function findPreviousVisibleTab(li) {
@@ -14661,33 +14837,39 @@ RED.stack = (function() {
 ;RED.actions = (function() {
     var actions = {
 
-    }
+    };
 
-    function addAction(name,handler) {
+    function addAction(name,handler,options) {
         if (typeof handler !== 'function') {
             throw new Error("Action handler not a function");
         }
         if (actions[name]) {
             throw new Error("Cannot override existing action");
         }
-        actions[name] = handler;
+        actions[name] = {
+            handler: handler,
+            options: options,
+        };
     }
     function removeAction(name) {
         delete actions[name];
     }
     function getAction(name) {
-        return actions[name];
+        return actions[name].handler;
     }
     function invokeAction() {
         var args = Array.prototype.slice.call(arguments);
         var name = args.shift();
         if (actions.hasOwnProperty(name)) {
-            actions[name].apply(null, args);
+            var handler = actions[name].handler;
+            handler.apply(null, args);
         }
     }
     function listActions() {
         var result = [];
+        var missing = [];
         Object.keys(actions).forEach(function(action) {
+            var def = actions[action];
             var shortcut = RED.keyboard.getShortcut(action);
             var isUser = false;
             if (shortcut) {
@@ -14695,13 +14877,38 @@ RED.stack = (function() {
             } else {
                 isUser = !!RED.keyboard.getUserShortcut(action);
             }
+            if (!def.label) {
+                var name = action;
+                var options = def.options;
+                var key = options ? options.label : undefined;
+                if (!key) {
+                    key = "action-list." +name.replace(/^.*:/,"");
+                }
+                var label = RED._(key);
+                if (label === key) {
+                    // no translation. convert `name` to description 
+                    label = name.replace(/(^.+:([a-z]))|(-([a-z]))/g, function() {
+                        if (arguments[5] === 0) {
+                            return arguments[2].toUpperCase();
+                        } else {
+                            return " "+arguments[4].toUpperCase();
+                        }
+                    });
+                    missing.push(key);
+                }
+                def.label = label;
+            }
+            //console.log("; missing:", missing);
+
             result.push({
                 id:action,
                 scope:shortcut?shortcut.scope:undefined,
                 key:shortcut?shortcut.key:undefined,
-                user:isUser
-            })
-        })
+                user:isUser,
+                label: def.label,
+                options: def.options,
+            });
+        });
         return result;
     }
     return {
@@ -15047,6 +15254,19 @@ RED.deploy = (function() {
                 var unknownNodes = [];
                 var invalidNodes = [];
 
+                RED.nodes.eachConfig(function(node) {
+                    if (node.valid === undefined) {
+                        RED.editor.validateNode(node);
+                    }
+                    if (!node.valid && !node.d) {
+                        invalidNodes.push(getNodeInfo(node));
+                    }
+                    if (node.type === "unknown") {
+                        if (unknownNodes.indexOf(node.name) == -1) {
+                            unknownNodes.push(node.name);
+                        }
+                    }                    
+                });
                 RED.nodes.eachNode(function(node) {
                     if (!node.valid && !node.d) {
                         invalidNodes.push(getNodeInfo(node));
@@ -17516,15 +17736,15 @@ RED.keyboard = (function() {
         "]": 221,
         "{": 219,// <- QWERTY specific
         "}": 221 // <- QWERTY specific
-    }
+    };
     var metaKeyCodes = {
         16: true,
         17: true,
         18: true,
         91: true,
         93: true
-    }
-    var actionToKeyMap = {}
+    };
+    var actionToKeyMap = {};
     var defaultKeyMap = {};
 
     // FF generates some different keycodes because reasons.
@@ -17532,7 +17752,7 @@ RED.keyboard = (function() {
         59:186,
         61:187,
         173:189
-    }
+    };
 
     function migrateOldKeymap() {
         // pre-0.18
@@ -17547,7 +17767,7 @@ RED.keyboard = (function() {
     }
 
     function getUserKey(action) {
-        return RED.settings.get('editor.keymap',{})[action]
+        return RED.settings.get('editor.keymap',{})[action];
     }
 
     function mergeKeymaps(defaultKeymap, themeKeymap) {
@@ -17572,7 +17792,7 @@ RED.keyboard = (function() {
                                 scope:scope,
                                 key:key,
                                 user:false
-                            })
+                            });
                         }
                     }
                 }
@@ -17582,13 +17802,13 @@ RED.keyboard = (function() {
             if (themeKeymap.hasOwnProperty(action)) {
                 if (!themeKeymap[action].key) {
                     // No key for this action - default is no keybinding
-                    delete mergedKeymap[action]
+                    delete mergedKeymap[action];
                 } else {
                     mergedKeymap[action] = [{
                         scope: themeKeymap[action].scope || "*",
                         key: themeKeymap[action].key,
                         user: false
-                    }]
+                    }];
                     if (mergedKeymap[action][0].scope === "workspace") {
                         mergedKeymap[action][0].scope = "red-ui-workspace";
                     }
@@ -17646,7 +17866,7 @@ RED.keyboard = (function() {
             close: function() {
                 RED.menu.refreshShortcuts();
             }
-        })
+        });
     }
 
     function revertToDefault(action) {
@@ -17794,7 +18014,7 @@ RED.keyboard = (function() {
                         scope:scope,
                         key:key,
                         user:false
-                    }
+                    };
                 }
                 if (!ondown) {
                     var userAction = getUserKey(cbdown);
@@ -17817,7 +18037,7 @@ RED.keyboard = (function() {
                 }
             }
         } else {
-            keys.push([key,mod])
+            keys.push([key,mod]);
         }
         var slot = handlers;
         for (i=0;i<keys.length;i++) {
@@ -17840,7 +18060,7 @@ RED.keyboard = (function() {
             //slot[key] = {scope: scope, ondown:cbdown};
         }
         slot.handlers = slot.handlers || [];
-        slot.handlers.push({scope:scope,ondown:cbdown})
+        slot.handlers.push({scope:scope,ondown:cbdown});
         slot.scope = scope;
         slot.ondown = cbdown;
     }
@@ -17857,12 +18077,12 @@ RED.keyboard = (function() {
                 if (parsedKey) {
                     keys.push(parsedKey);
                 } else {
-                    console.log("Unrecognised key specifier:",key)
+                    console.log("Unrecognised key specifier:",key);
                     return;
                 }
             }
         } else {
-            keys.push([key,mod])
+            keys.push([key,mod]);
         }
         var slot = handlers;
         for (i=0;i<keys.length;i++) {
@@ -17884,7 +18104,7 @@ RED.keyboard = (function() {
         }
         if (typeof slot.ondown === "string") {
             if (typeof modifiers === 'boolean' && modifiers) {
-                actionToKeyMap[slot.ondown] = {user: modifiers}
+                actionToKeyMap[slot.ondown] = {user: modifiers};
             } else {
                 delete actionToKeyMap[slot.ondown];
             }
@@ -17900,11 +18120,11 @@ RED.keyboard = (function() {
     function formatKey(key,plain) {
         var formattedKey = isMac?key.replace(/ctrl-?/,"&#8984;"):key;
         formattedKey = isMac?formattedKey.replace(/alt-?/,"&#8997;"):key;
-        formattedKey = formattedKey.replace(/shift-?/,"&#8679;")
-        formattedKey = formattedKey.replace(/left/,"&#x2190;")
-        formattedKey = formattedKey.replace(/up/,"&#x2191;")
-        formattedKey = formattedKey.replace(/right/,"&#x2192;")
-        formattedKey = formattedKey.replace(/down/,"&#x2193;")
+        formattedKey = formattedKey.replace(/shift-?/,"&#8679;");
+        formattedKey = formattedKey.replace(/left/,"&#x2190;");
+        formattedKey = formattedKey.replace(/up/,"&#x2191;");
+        formattedKey = formattedKey.replace(/right/,"&#x2192;");
+        formattedKey = formattedKey.replace(/down/,"&#x2193;");
         if (plain) {
             return formattedKey;
         }
@@ -17928,7 +18148,6 @@ RED.keyboard = (function() {
         var container = $(this);
         var object = container.data('data');
 
-
         if (!container.hasClass('keyboard-shortcut-entry-expanded')) {
             endEditShortcut();
 
@@ -17952,7 +18171,7 @@ RED.keyboard = (function() {
                 }
                 $(this).toggleClass("input-error",!valid);
                 okButton.attr("disabled",!valid);
-            })
+            });
 
             var scopeSelect = $('<select><option value="*" data-i18n="keyboard.global"></option><option value="red-ui-workspace" data-i18n="keyboard.workspace"></option></select>').appendTo(scope);
             scopeSelect.i18n();
@@ -17962,7 +18181,7 @@ RED.keyboard = (function() {
             scopeSelect.val(object.scope||'*');
             scopeSelect.on("change", function() {
                 keyInput.trigger("change");
-            })
+            });
 
             var div = $('<div class="keyboard-shortcut-edit button-group-vertical"></div>').appendTo(scope);
             var okButton = $('<button class="red-ui-button red-ui-button-small"><i class="fa fa-check"></i></button>').appendTo(div);
@@ -17988,10 +18207,13 @@ RED.keyboard = (function() {
                     id:object.id,
                     scope:shortcut?shortcut.scope:undefined,
                     key:shortcut?shortcut.key:undefined,
-                    user:shortcut?shortcut.user:undefined
-                }
+                    user:shortcut?shortcut.user:undefined,
+
+                    label: object.label,
+                    options: object.options,
+                };
                 buildShortcutRow(container,obj);
-            })
+            });
 
             keyInput.trigger("focus");
         }
@@ -18026,7 +18248,7 @@ RED.keyboard = (function() {
                             delete object.scope;
                         } else {
                             keyDiv.parent().removeClass("keyboard-shortcut-entry-unassigned");
-                            keyDiv.append(RED.keyboard.formatKey(key))
+                            keyDiv.append(RED.keyboard.formatKey(key));
                             $("<span>").text(scope).appendTo(scopeDiv);
                             object.key = key;
                             object.scope = scope;
@@ -18039,7 +18261,7 @@ RED.keyboard = (function() {
                         userKeymap[object.id] = {
                             scope:shortcut.scope,
                             key:shortcut.key
-                        }
+                        };
                         RED.settings.set('editor.keymap',userKeymap);
                     }
                 }
@@ -18055,13 +18277,7 @@ RED.keyboard = (function() {
         var item = $('<div class="keyboard-shortcut-entry">').appendTo(container);
         container.data('data',object);
 
-        var text = object.id.replace(/(^.+:([a-z]))|(-([a-z]))/g,function() {
-            if (arguments[5] === 0) {
-                return arguments[2].toUpperCase();
-            } else {
-                return " "+arguments[4].toUpperCase();
-            }
-        });
+        var text = object.label;
         var label = $('<div>').addClass("keyboard-shortcut-entry-text").text(text).appendTo(item);
 
         var user = $('<i class="fa fa-user"></i>').prependTo(label);
@@ -18096,14 +18312,15 @@ RED.keyboard = (function() {
         pane.find("#red-ui-settings-tab-keyboard-filter").searchBox({
             delay: 100,
             change: function() {
-                var filterValue = $(this).val().trim();
+                var filterValue = $(this).val().trim().toLowerCase();
                 if (filterValue === "") {
                     shortcutList.editableList('filter', null);
                 } else {
                     filterValue = filterValue.replace(/\s/g,"");
                     shortcutList.editableList('filter', function(data) {
-                        return data.id.toLowerCase().replace(/^.*:/,"").replace("-","").indexOf(filterValue) > -1;
-                    })
+                        var label = data.label.toLowerCase();
+                        return label.indexOf(filterValue) > -1;
+                    });
                 }
             }
         });
@@ -18124,9 +18341,9 @@ RED.keyboard = (function() {
         });
         var shortcuts = RED.actions.list();
         shortcuts.sort(function(A,B) {
-            var Aid = A.id.replace(/^.*:/,"").replace(/[ -]/g,"").toLowerCase();
-            var Bid = B.id.replace(/^.*:/,"").replace(/[ -]/g,"").toLowerCase();
-            return Aid.localeCompare(Bid);
+            var Akey = A.label;
+            var Bkey = B.label;
+            return Akey.localeCompare(Bkey);
         });
         knownShortcuts = new Set();
         shortcuts.forEach(function(s) {
@@ -18880,7 +19097,6 @@ RED.view = (function() {
     var activeGroups = [];
     var dirtyGroups = {};
 
-    var selected_link = null;
     var mousedown_link = null;
     var mousedown_node = null;
     var mousedown_group = null;
@@ -18892,6 +19108,8 @@ RED.view = (function() {
     var mouse_mode = 0;
     var mousedown_group_handle = null;
     var lasso = null;
+    var slicePath = null;
+    var slicePathLast = null;
     var ghostNode = null;
     var showStatus = false;
     var lastClickNode = null;
@@ -18946,6 +19164,14 @@ RED.view = (function() {
                     if (!setIds.has(node.id)) {
                         set.push({n:node});
                         setIds.add(node.id);
+                        var links = RED.nodes.getNodeLinks(node.id,PORT_TYPE_INPUT).concat(RED.nodes.getNodeLinks(node.id,PORT_TYPE_OUTPUT))
+                        for (var i=0,l=links.length;i<l;i++) {
+                            var link = links[i]
+                            if (link.source === node && setIds.has(link.target.id) ||
+                                link.target === node && setIds.has(link.source.id)) {
+                                selectedLinks.add(link)
+                            }
+                        }
                     }
                 }
             },
@@ -18962,6 +19188,10 @@ RED.view = (function() {
                             }
                         }
                     }
+                    var links = RED.nodes.getNodeLinks(node.id,PORT_TYPE_INPUT).concat(RED.nodes.getNodeLinks(node.id,PORT_TYPE_OUTPUT))
+                    for (var i=0,l=links.length;i<l;i++) {
+                        selectedLinks.remove(links[i]);
+                    }
                 }
             },
             clear: function() {
@@ -18976,6 +19206,31 @@ RED.view = (function() {
         return api;
     })();
 
+    var selectedLinks = (function() {
+        var links = new Set();
+        return {
+            add: function(link) {
+                links.add(link);
+                link.selected = true;
+            },
+            remove: function(link) {
+                links.delete(link);
+                link.selected = false;
+            },
+            clear: function() {
+                links.forEach(function(link) { link.selected = false })
+                links.clear();
+            },
+            length: function() {
+                return links.size;
+            },
+            forEach: function(func) { links.forEach(func) },
+            has: function(link) { return links.has(link) },
+            toArray: function() { return Array.from(links) }
+        }
+    })();
+
+
     function init() {
 
         chart = $("#red-ui-workspace-chart");
@@ -19010,6 +19265,12 @@ RED.view = (function() {
                     }
                 } else if (mouse_mode === RED.state.PANNING && d3.event.buttons !== 4) {
                     resetMouseVars();
+                } else if (slicePath) {
+                    if (d3.event.buttons !== 2) {
+                        slicePath.remove();
+                        slicePath = null;
+                        resetMouseVars()
+                    }
                 }
             })
             .on("touchend", function() {
@@ -19229,26 +19490,56 @@ RED.view = (function() {
                 var historyEvent = result.historyEvent;
                 var nn = result.node;
 
+                RED.nodes.add(nn);
+
                 var showLabel = RED.utils.getMessageProperty(RED.settings.get('editor'),"view.view-node-show-label");
                 if (showLabel !== undefined &&  (nn._def.hasOwnProperty("showLabel")?nn._def.showLabel:true) && !nn._def.defaults.hasOwnProperty("l")) {
                     nn.l = showLabel;
                 }
 
                 var helperOffset = d3.touches(ui.helper.get(0))[0]||d3.mouse(ui.helper.get(0));
+                var helperWidth = ui.helper.width();
+                var helperHeight = ui.helper.height();
                 var mousePos = d3.touches(this)[0]||d3.mouse(this);
 
-                mousePos[1] += this.scrollTop + ((nn.h/2)-helperOffset[1]);
-                mousePos[0] += this.scrollLeft + ((nn.w/2)-helperOffset[0]);
+                try {
+                    var isLink = (nn.type === "link in" || nn.type === "link out")
+                    var hideLabel = nn.hasOwnProperty('l')?!nn.l : isLink;
+
+                    var label = RED.utils.getNodeLabel(nn, nn.type);
+                    var labelParts = getLabelParts(label, "red-ui-flow-node-label");
+                    if (hideLabel) {
+                        nn.w = node_height;
+                        nn.h = Math.max(node_height,(nn.outputs || 0) * 15);
+                    } else {
+                        nn.w = Math.max(node_width,20*(Math.ceil((labelParts.width+50+(nn._def.inputs>0?7:0))/20)) );
+                        nn.h = Math.max(6+24*labelParts.lines.length,(nn.outputs || 0) * 15, 30);
+                    }
+                } catch(err) {
+                }
+
+                mousePos[1] += this.scrollTop + ((helperHeight/2)-helperOffset[1]);
+                mousePos[0] += this.scrollLeft + ((helperWidth/2)-helperOffset[0]);
                 mousePos[1] /= scaleFactor;
                 mousePos[0] /= scaleFactor;
 
-                if (snapGrid) {
-                    mousePos[0] = gridSize*(Math.ceil(mousePos[0]/gridSize));
-                    mousePos[1] = gridSize*(Math.ceil(mousePos[1]/gridSize));
-                }
                 nn.x = mousePos[0];
                 nn.y = mousePos[1];
 
+                if (snapGrid) {
+                    var gridOffset = [0,0];
+                    var offsetLeft = nn.x-(gridSize*Math.round((nn.x-nn.w/2)/gridSize)+nn.w/2);
+                    var offsetRight = nn.x-(gridSize*Math.round((nn.x+nn.w/2)/gridSize)-nn.w/2);
+                    if (Math.abs(offsetLeft) < Math.abs(offsetRight)) {
+                        gridOffset[0] = offsetLeft
+                    } else {
+                        gridOffset[0] = offsetRight
+                    }
+                    gridOffset[1] = nn.y-(gridSize*Math.round(nn.y/gridSize));
+                    nn.x -= gridOffset[0];
+                    nn.y -= gridOffset[1];
+                }
+
                 var spliceLink = $(ui.helper).data("splice");
                 if (spliceLink) {
                     // TODO: DRY - droppable/nodeMouseDown/canvasMouseUp/showQuickAddDialog
@@ -19269,7 +19560,6 @@ RED.view = (function() {
                     historyEvent.removedLinks = [spliceLink];
                 }
 
-                RED.nodes.add(nn);
 
                 var group = $(ui.helper).data("group");
                 if (group) {
@@ -19319,6 +19609,8 @@ RED.view = (function() {
         RED.actions.add("core:cut-selection-to-internal-clipboard",function(){copySelection();deleteSelection();});
         RED.actions.add("core:paste-from-internal-clipboard",function(){importNodes(clipboard,{generateIds: true});});
 
+        RED.actions.add("core:detach-selected-nodes", function() { detachSelectedNodes() })
+
         RED.events.on("view:selection-changed", function(selection) {
             var hasSelection = (selection.nodes && selection.nodes.length > 0);
             var hasMultipleSelection = hasSelection && selection.nodes.length > 1;
@@ -19341,6 +19633,7 @@ RED.view = (function() {
         })
 
         RED.actions.add("core:delete-selection",deleteSelection);
+        RED.actions.add("core:delete-selection-and-reconnect",function() { deleteSelection(true) });
         RED.actions.add("core:edit-selected-node",editSelection);
         RED.actions.add("core:go-to-selection",function() {
             if (movingSet.length() > 0) {
@@ -19419,6 +19712,39 @@ RED.view = (function() {
             show: function(n) { return !n.valid }
         })
 
+        if (RED.settings.get("editor.view.view-store-zoom")) {
+            var  userZoomLevel = parseFloat(RED.settings.getLocal('zoom-level'))
+            if (!isNaN(userZoomLevel)) {
+                scaleFactor = userZoomLevel
+            }
+        }
+
+        var onScrollTimer = null;
+        function storeScrollPosition() {
+            workspaceScrollPositions[RED.workspaces.active()] = {
+                left:chart.scrollLeft(),
+                top:chart.scrollTop()
+            };
+            RED.settings.setLocal('scroll-positions', JSON.stringify(workspaceScrollPositions) )
+        }
+        chart.on("scroll", function() {
+            if (RED.settings.get("editor.view.view-store-position")) {
+                if (onScrollTimer) {
+                    clearTimeout(onScrollTimer)
+                }
+                onScrollTimer = setTimeout(storeScrollPosition, 200);
+            }
+        })
+
+        if (RED.settings.get("editor.view.view-store-position")) {
+            var scrollPositions = RED.settings.getLocal('scroll-positions')
+            if (scrollPositions) {
+                try {
+                    workspaceScrollPositions = JSON.parse(scrollPositions)
+                } catch(err) {
+                }
+            }
+        }
     }
 
 
@@ -19726,7 +20052,7 @@ RED.view = (function() {
             return;
         }
         if (!mousedown_node && !mousedown_link && !mousedown_group) {
-            selected_link = null;
+            selectedLinks.clear();
             updateSelection();
         }
         if (mouse_mode === 0) {
@@ -19735,19 +20061,18 @@ RED.view = (function() {
                 lasso = null;
             }
         }
-        if (mouse_mode === 0 || mouse_mode === RED.state.QUICK_JOINING) {
-            if (d3.event.metaKey || d3.event.ctrlKey) {
-                d3.event.stopPropagation();
-                clearSelection();
-                point = d3.mouse(this);
-                var clickedGroup = getGroupAt(point[0],point[1]);
-                if (drag_lines.length > 0) {
-                    clickedGroup = clickedGroup || RED.nodes.group(drag_lines[0].node.g)
-                }
-                showQuickAddDialog({position:point, group:clickedGroup});
+        if ((mouse_mode === 0 || mouse_mode === RED.state.QUICK_JOINING) && (d3.event.touches || d3.event.button === 0) && (d3.event.metaKey || d3.event.ctrlKey)) {
+            // Trigger quick add dialog
+            d3.event.stopPropagation();
+            clearSelection();
+            point = d3.mouse(this);
+            var clickedGroup = getGroupAt(point[0],point[1]);
+            if (drag_lines.length > 0) {
+                clickedGroup = clickedGroup || RED.nodes.group(drag_lines[0].node.g)
             }
-        }
-        if (mouse_mode === 0 && !(d3.event.metaKey || d3.event.ctrlKey)) {
+            showQuickAddDialog({position:point, group:clickedGroup});
+        } else if (mouse_mode === 0 && (d3.event.touches || d3.event.button === 0) && !(d3.event.metaKey || d3.event.ctrlKey)) {
+            // Tigger lasso
             if (!touchStartTime) {
                 point = d3.mouse(this);
                 lasso = eventLayer.append("rect")
@@ -19762,6 +20087,13 @@ RED.view = (function() {
                 .attr("class","nr-ui-view-lasso");
                 d3.event.preventDefault();
             }
+        } else if (mouse_mode === 0 && d3.event.button === 2 && (d3.event.metaKey || d3.event.ctrlKey)) {
+            clearSelection();
+            mouse_mode = RED.state.SLICING;
+            point = d3.mouse(this);
+            slicePath = eventLayer.append("path").attr("class","nr-ui-view-slice").attr("d",`M${point[0]} ${point[1]}`)
+            slicePathLast = point;
+            RED.view.redraw();
         }
     }
 
@@ -20158,6 +20490,17 @@ RED.view = (function() {
                 .attr("height",h)
             ;
             return;
+        } else if (mouse_mode === RED.state.SLICING) {
+            if (slicePath) {
+                var delta = Math.max(1,Math.abs(slicePathLast[0]-mouse_position[0]))*Math.max(1,Math.abs(slicePathLast[1]-mouse_position[1]))
+                if (delta > 20) {
+                    var currentPath = slicePath.attr("d")
+                    currentPath += " L"+mouse_position[0]+" "+mouse_position[1]
+                    slicePath.attr("d",currentPath);
+                    slicePathLast = mouse_position
+                }
+            }
+            return
         }
 
         if (mouse_mode === RED.state.SELECTING_NODE) {
@@ -20165,7 +20508,7 @@ RED.view = (function() {
             return;
         }
 
-        if (mouse_mode != RED.state.QUICK_JOINING && mouse_mode != RED.state.IMPORT_DRAGGING && !mousedown_node && !mousedown_group && selected_link == null) {
+        if (mouse_mode != RED.state.QUICK_JOINING && mouse_mode != RED.state.IMPORT_DRAGGING && mouse_mode != RED.state.DETACHED_DRAGGING && !mousedown_node && !mousedown_group && selectedLinks.length() === 0) {
             return;
         }
 
@@ -20189,16 +20532,18 @@ RED.view = (function() {
                     // Get all the wires we need to detach.
                     var links = [];
                     var existingLinks = [];
-                    if (selected_link &&
-                        ((mousedown_port_type === PORT_TYPE_OUTPUT &&
-                            selected_link.source === mousedown_node &&
-                            selected_link.sourcePort === mousedown_port_index
-                        ) ||
-                        (mousedown_port_type === PORT_TYPE_INPUT &&
-                            selected_link.target === mousedown_node
-                        ))
-                    ) {
-                        existingLinks = [selected_link];
+                    if (selectedLinks.length() > 0) {
+                        selectedLinks.forEach(function(link) {
+                            if (((mousedown_port_type === PORT_TYPE_OUTPUT &&
+                                link.source === mousedown_node &&
+                                link.sourcePort === mousedown_port_index
+                            ) ||
+                            (mousedown_port_type === PORT_TYPE_INPUT &&
+                                link.target === mousedown_node
+                            ))) {
+                                existingLinks.push(link);
+                            }
+                        })
                     } else {
                         var filter;
                         if (mousedown_port_type === PORT_TYPE_OUTPUT) {
@@ -20236,7 +20581,7 @@ RED.view = (function() {
                 } else if (mousedown_node && !quickAddLink) {
                     showDragLines([{node:mousedown_node,port:mousedown_port_index,portType:mousedown_port_type}]);
                 }
-                selected_link = null;
+                selectedLinks.clear();
             }
             mousePos = mouse_position;
             for (i=0;i<drag_lines.length;i++) {
@@ -20268,7 +20613,7 @@ RED.view = (function() {
                                    RED.nodes.filterLinks({ target: node.n }).length === 0;
                 }
             }
-        } else if (mouse_mode == RED.state.MOVING_ACTIVE || mouse_mode == RED.state.IMPORT_DRAGGING) {
+        } else if (mouse_mode == RED.state.MOVING_ACTIVE || mouse_mode == RED.state.IMPORT_DRAGGING || mouse_mode == RED.state.DETACHED_DRAGGING) {
             mousePos = mouse_position;
             var minX = 0;
             var minY = 0;
@@ -20332,8 +20677,16 @@ RED.view = (function() {
                     gridOffset[0] = node.n.x-(gridSize*Math.floor(node.n.x/gridSize))-gridSize/2;
                     gridOffset[1] = node.n.y-(gridSize*Math.floor(node.n.y/gridSize))-gridSize/2;
                 } else {
-                    gridOffset[0] = node.n.x-(gridSize*Math.floor((node.n.x-node.n.w/2)/gridSize)+node.n.w/2);
-                    gridOffset[1] = node.n.y-(gridSize*Math.floor(node.n.y/gridSize));
+                    var offsetLeft = node.n.x-(gridSize*Math.round((node.n.x-node.n.w/2)/gridSize)+node.n.w/2);
+                    var offsetRight = node.n.x-(gridSize*Math.round((node.n.x+node.n.w/2)/gridSize)-node.n.w/2);
+                    // gridOffset[0] = node.n.x-(gridSize*Math.floor((node.n.x-node.n.w/2)/gridSize)+node.n.w/2);
+                    if (Math.abs(offsetLeft) < Math.abs(offsetRight)) {
+                        gridOffset[0] = offsetLeft
+                    } else {
+                        gridOffset[0] = offsetRight
+                    }
+                    gridOffset[1] = node.n.y-(gridSize*Math.round(node.n.y/gridSize));
+                    // console.log(offsetLeft, offsetRight);
                 }
                 if (gridOffset[0] !== 0 || gridOffset[1] !== 0) {
                     for (i = 0; i<movingSet.length(); i++) {
@@ -20553,6 +20906,11 @@ RED.view = (function() {
         } else if (mouse_mode == RED.state.DEFAULT && mousedown_link == null && !d3.event.ctrlKey && !d3.event.metaKey ) {
             clearSelection();
             updateSelection();
+        } else if (slicePath) {
+            deleteSelection();
+            slicePath.remove();
+            slicePath = null;
+            RED.view.redraw(true);
         }
         if (mouse_mode == RED.state.MOVING_ACTIVE) {
             if (movingSet.length() > 0) {
@@ -20624,10 +20982,30 @@ RED.view = (function() {
         //         movingSet.add(mousedown_node);
         //     }
         // }
-        if (mouse_mode == RED.state.MOVING || mouse_mode == RED.state.MOVING_ACTIVE) {
+        if (mouse_mode == RED.state.MOVING || mouse_mode == RED.state.MOVING_ACTIVE || mouse_mode == RED.state.DETACHED_DRAGGING) {
             // if (mousedown_node) {
             //     delete mousedown_node.gSelected;
             // }
+            if (mouse_mode === RED.state.DETACHED_DRAGGING) {
+                var ns = [];
+                for (var j=0;j<movingSet.length();j++) {
+                    var n = movingSet.get(j);
+                    if (n.ox !== n.n.x || n.oy !== n.n.y) {
+                        ns.push({n:n.n,ox:n.ox,oy:n.oy,moved:n.n.moved});
+                        n.n.dirty = true;
+                        n.n.moved = true;
+                    }
+                }
+                var detachEvent = RED.history.peek();
+                // The last event in the stack *should* be a multi-event from
+                // where the links were added/removed
+                var historyEvent = {t:"move",nodes:ns,dirty:RED.nodes.dirty()}
+                if (detachEvent.t === "multi") {
+                    detachEvent.events.push(historyEvent)
+                } else {
+                    RED.history.push(historyEvent)
+                }
+            }
             for (i=0;i<movingSet.length();i++) {
                 var node = movingSet.get(i);
                 delete node.ox;
@@ -20654,6 +21032,7 @@ RED.view = (function() {
     }
     function zoomZero() { zoomView(1); }
 
+
     function zoomView(factor) {
         var screenSize = [chart.width(),chart.height()];
         var scrollPos = [chart.scrollLeft(),chart.scrollTop()];
@@ -20666,16 +21045,38 @@ RED.view = (function() {
 
         RED.view.navigator.resize();
         redraw();
+        if (RED.settings.get("editor.view.view-store-zoom")) {
+            RED.settings.setLocal('zoom-level', factor.toFixed(1))
+        }
     }
 
     function selectNone() {
         if (mouse_mode === RED.state.MOVING || mouse_mode === RED.state.MOVING_ACTIVE) {
             return;
         }
-        if (mouse_mode === RED.state.IMPORT_DRAGGING) {
+        if (mouse_mode === RED.state.DETACHED_DRAGGING) {
+            for (var j=0;j<movingSet.length();j++) {
+                var n = movingSet.get(j);
+                n.n.x = n.ox;
+                n.n.y = n.oy;
+            }
             clearSelection();
             RED.history.pop();
             mouse_mode = 0;
+        } else if (mouse_mode === RED.state.IMPORT_DRAGGING) {
+            clearSelection();
+            RED.history.pop();
+            mouse_mode = 0;
+        } else if (mouse_mode === RED.state.SLICING) {
+            if (slicePath) {
+                slicePath.remove();
+                slicePath = null;
+                resetMouseVars()
+            }
+            clearSelection();
+        } else if (lasso) {
+            lasso.remove();
+            lasso = null;
         } else if (activeGroup) {
             exitActiveGroup()
         } else {
@@ -20687,6 +21088,7 @@ RED.view = (function() {
         if (mouse_mode === RED.state.SELECTING_NODE && selectNodesOptions.single) {
             return;
         }
+        selectedLinks.clear();
 
         if (activeGroup) {
             var ag = activeGroup;
@@ -20758,7 +21160,6 @@ RED.view = (function() {
                 }
             }
         }
-        selected_link = null;
         if (mouse_mode !== RED.state.SELECTING_NODE) {
             updateSelection();
         }
@@ -20773,7 +21174,7 @@ RED.view = (function() {
             n.n.selected = false;
         }
         movingSet.clear();
-        selected_link = null;
+        selectedLinks.clear();
         if (activeGroup) {
             activeGroup.active = false
             activeGroup.dirty = true;
@@ -20867,12 +21268,16 @@ RED.view = (function() {
                         }
                     }
                 }
-                if (activeFlowLinks.length === 0 && selected_link !== null && selected_link.link) {
-                    activeLinks.push(selected_link);
-                    activeLinkNodes[selected_link.source.id] = selected_link.source;
-                    selected_link.source.dirty = true;
-                    activeLinkNodes[selected_link.target.id] = selected_link.target;
-                    selected_link.target.dirty = true;
+                if (activeFlowLinks.length === 0 && selectedLinks.length() > 0) {
+                    selectedLinks.forEach(function(link) {
+                        if (link.link) {
+                            activeLinks.push(link);
+                            activeLinkNodes[link.source.id] = link.source;
+                            link.source.dirty = true;
+                            activeLinkNodes[link.target.id] = link.target;
+                            link.target.dirty = true;
+                        }
+                    })
                 }
             } else {
                 selection.flows = workspaceSelection;
@@ -20883,6 +21288,10 @@ RED.view = (function() {
                 return value.map(function(n) { return n.id })
             } else if (key === 'link') {
                 return value.source.id+":"+value.sourcePort+":"+value.target.id;
+            } else if (key === 'links') {
+                return value.map(function(link) {
+                    return link.source.id+":"+link.sourcePort+":"+link.target.id;
+                });
             }
             return value;
         });
@@ -20904,7 +21313,7 @@ RED.view = (function() {
             }
         }
     }
-    function deleteSelection() {
+    function deleteSelection(reconnectWires) {
         if (mouse_mode === RED.state.SELECTING_NODE) {
             return;
         }
@@ -20952,7 +21361,7 @@ RED.view = (function() {
             updateActiveNodes();
             updateSelection();
             redraw();
-        } else if (movingSet.length() > 0 || selected_link != null) {
+        } else if (movingSet.length() > 0 || selectedLinks.length() > 0) {
             var result;
             var node;
             var removedNodes = [];
@@ -20962,6 +21371,23 @@ RED.view = (function() {
             var removedSubflowInputs = [];
             var removedSubflowStatus;
             var subflowInstances = [];
+            var historyEvents = [];
+            var addToRemovedLinks = function(links) {
+                if(!links) { return; }
+                var _links = Array.isArray(links) ? links : [links];
+                _links.forEach(function(l) {
+                    removedLinks.push(l);
+                    selectedLinks.remove(l);
+                })
+            }
+            if (reconnectWires) {
+                var reconnectResult = RED.nodes.detachNodes(movingSet.nodes())
+                var addedLinks = reconnectResult.newLinks;
+                if (addedLinks.length > 0) {
+                    historyEvents.push({ t:'add', links: addedLinks })
+                }
+                addToRemovedLinks(reconnectResult.removedLinks)
+            }
 
             var startDirty = RED.nodes.dirty();
             var startChanged = false;
@@ -20992,7 +21418,7 @@ RED.view = (function() {
                         var removedEntities = RED.nodes.remove(node.id);
                         removedNodes.push(node);
                         removedNodes = removedNodes.concat(removedEntities.nodes);
-                        removedLinks = removedLinks.concat(removedEntities.links);
+                        addToRemovedLinks(removedNodes.removedLinks);
                         if (node.g) {
                             var group = RED.nodes.group(node.g);
                             if (selectedGroups.indexOf(group) === -1) {
@@ -21025,20 +21451,20 @@ RED.view = (function() {
                 if (removedSubflowOutputs.length > 0) {
                     result = RED.subflow.removeOutput(removedSubflowOutputs);
                     if (result) {
-                        removedLinks = removedLinks.concat(result.links);
+                        addToRemovedLinks(result.links);
                     }
                 }
                 // Assume 0/1 inputs
                 if (removedSubflowInputs.length == 1) {
                     result = RED.subflow.removeInput();
                     if (result) {
-                        removedLinks = removedLinks.concat(result.links);
+                        addToRemovedLinks(result.links);
                     }
                 }
                 if (removedSubflowStatus) {
                     result = RED.subflow.removeStatus();
                     if (result) {
-                        removedLinks = removedLinks.concat(result.links);
+                        addToRemovedLinks(result.links);
                     }
                 }
 
@@ -21051,71 +21477,71 @@ RED.view = (function() {
                     RED.nodes.dirty(true);
                 }
             }
-            var historyEvent;
 
-            if (selected_link && selected_link.link) {
-                var sourceId = selected_link.source.id;
-                var targetId = selected_link.target.id;
-                var sourceIdIndex = selected_link.target.links.indexOf(sourceId);
-                var targetIdIndex = selected_link.source.links.indexOf(targetId);
-
-                historyEvent = {
-                    t:"multi",
-                    events: [
-                        {
+            if (selectedLinks.length() > 0) {
+                selectedLinks.forEach(function(link) {
+                    if (link.link) {
+                        var sourceId = link.source.id;
+                        var targetId = link.target.id;
+                        var sourceIdIndex = link.target.links.indexOf(sourceId);
+                        var targetIdIndex = link.source.links.indexOf(targetId);
+                        historyEvents.push({
                             t: "edit",
-                            node: selected_link.source,
-                            changed: selected_link.source.changed,
+                            node: link.source,
+                            changed: link.source.changed,
                             changes: {
-                                links: $.extend(true,{},{v:selected_link.source.links}).v
+                                links: $.extend(true,{},{v:link.source.links}).v
                             }
-                        },
-                        {
+                        })
+                        historyEvents.push({
                             t: "edit",
-                            node: selected_link.target,
-                            changed: selected_link.target.changed,
+                            node: link.target,
+                            changed: link.target.changed,
                             changes: {
-                                links: $.extend(true,{},{v:selected_link.target.links}).v
+                                links: $.extend(true,{},{v:link.target.links}).v
                             }
-                        }
-
-                    ],
-                    dirty:RED.nodes.dirty()
-                }
-                RED.nodes.dirty(true);
-                selected_link.source.changed = true;
-                selected_link.target.changed = true;
-                selected_link.target.links.splice(sourceIdIndex,1);
-                selected_link.source.links.splice(targetIdIndex,1);
-                selected_link.source.dirty = true;
-                selected_link.target.dirty = true;
+                        })
+                        link.source.changed = true;
+                        link.target.changed = true;
+                        link.target.links.splice(sourceIdIndex,1);
+                        link.source.links.splice(targetIdIndex,1);
+                        link.source.dirty = true;
+                        link.target.dirty = true;
 
+                    } else {
+                        RED.nodes.removeLink(link);
+                        removedLinks.push(link);
+                    }
+                })
+            }
+            RED.nodes.dirty(true);
+            var historyEvent = {
+                t:"delete",
+                nodes:removedNodes,
+                links:removedLinks,
+                groups: removedGroups,
+                subflowOutputs:removedSubflowOutputs,
+                subflowInputs:removedSubflowInputs,
+                subflow: {
+                    id: activeSubflow?activeSubflow.id:undefined,
+                    instances: subflowInstances
+                },
+                dirty:startDirty
+            };
+            if (removedSubflowStatus) {
+                historyEvent.subflow.status = removedSubflowStatus;
+            }
+            if (historyEvents.length > 0) {
+                historyEvents.unshift(historyEvent);
+                RED.history.push({
+                    t:"multi",
+                    events: historyEvents
+                })
             } else {
-                if (selected_link) {
-                    RED.nodes.removeLink(selected_link);
-                    removedLinks.push(selected_link);
-                }
-                RED.nodes.dirty(true);
-                historyEvent = {
-                    t:"delete",
-                    nodes:removedNodes,
-                    links:removedLinks,
-                    groups: removedGroups,
-                    subflowOutputs:removedSubflowOutputs,
-                    subflowInputs:removedSubflowInputs,
-                    subflow: {
-                        id: activeSubflow?activeSubflow.id:undefined,
-                        instances: subflowInstances
-                    },
-                    dirty:startDirty
-                };
-                if (removedSubflowStatus) {
-                    historyEvent.subflow.status = removedSubflowStatus;
-                }
+                RED.history.push(historyEvent);
             }
-            RED.history.push(historyEvent);
 
-            selected_link = null;
+            selectedLinks.clear();
             updateActiveNodes();
             updateSelection();
             redraw();
@@ -21192,6 +21618,28 @@ RED.view = (function() {
         }
     }
 
+
+    function detachSelectedNodes() {
+        var selection = RED.view.selection();
+        if (selection.nodes) {
+            const {newLinks, removedLinks} = RED.nodes.detachNodes(selection.nodes);
+            if (removedLinks.length || newLinks.length) {
+                RED.history.push({
+                    t: "multi",
+                    events: [
+                        { t:'delete', links: removedLinks },
+                        { t:'add', links: newLinks }
+                    ],
+                    dirty: RED.nodes.dirty()
+                })
+                RED.nodes.dirty(true)
+            }
+            prepareDrag([selection.nodes[0].x,selection.nodes[0].y]);
+            mouse_mode = RED.state.DETACHED_DRAGGING;
+            RED.view.redraw(true);
+        }
+    }
+
     function calculateTextWidth(str, className) {
         var result = convertLineBreakCharacter(str);
         var width = 0;
@@ -21278,7 +21726,7 @@ RED.view = (function() {
             activeHoverGroup.hovered = false;
             activeHoverGroup = null;
         }
-        d3.select(".red-ui-flow-link-splice").classed("red-ui-flow-link-splice",false);
+        d3.selectAll(".red-ui-flow-link-splice").classed("red-ui-flow-link-splice",false);
         if (spliceTimer) {
             clearTimeout(spliceTimer);
             spliceTimer = null;
@@ -21526,10 +21974,13 @@ RED.view = (function() {
                     } else {
                         resetMouseVars();
                     }
-                    selected_link = select_link;
                     mousedown_link = select_link;
                     if (select_link) {
+                        selectedLinks.clear();
+                        selectedLinks.add(select_link);
                         updateSelection();
+                    } else {
+                        selectedLinks.clear();
                     }
                 }
                 redraw();
@@ -21538,7 +21989,10 @@ RED.view = (function() {
 
             resetMouseVars();
             hideDragLines();
-            selected_link = select_link;
+            if (select_link) {
+                selectedLinks.clear();
+                selectedLinks.add(select_link);
+            }
             mousedown_link = select_link;
             if (select_link) {
                 updateSelection();
@@ -21711,10 +22165,13 @@ RED.view = (function() {
             msn.dx = msn.n.x-mouse[0];
             msn.dy = msn.n.y-mouse[1];
         }
-
-        mouse_offset = d3.mouse(document.body);
-        if (isNaN(mouse_offset[0])) {
-            mouse_offset = d3.touches(document.body)[0];
+        try {
+            mouse_offset = d3.mouse(document.body);
+            if (isNaN(mouse_offset[0])) {
+                mouse_offset = d3.touches(document.body)[0];
+            }
+        } catch(err) {
+            mouse_offset = [0,0]
         }
     }
 
@@ -21795,7 +22252,7 @@ RED.view = (function() {
         //var touch0 = d3.event;
         //var pos = [touch0.pageX,touch0.pageY];
         //RED.touch.radialMenu.show(d3.select(this),pos);
-        if (mouse_mode == RED.state.IMPORT_DRAGGING) {
+        if (mouse_mode == RED.state.IMPORT_DRAGGING || mouse_mode == RED.state.DETACHED_DRAGGING) {
             var historyEvent = RED.history.peek();
             if (activeSpliceLink) {
                 // TODO: DRY - droppable/nodeMouseDown/canvasMouseUp
@@ -21833,6 +22290,18 @@ RED.view = (function() {
                 activeHoverGroup = null;
             }
 
+            if (mouse_mode == RED.state.DETACHED_DRAGGING) {
+                var ns = [];
+                for (var j=0;j<movingSet.length();j++) {
+                    var n = movingSet.get(j);
+                    if (n.ox !== n.n.x || n.oy !== n.n.y) {
+                        ns.push({n:n.n,ox:n.ox,oy:n.oy,moved:n.n.moved});
+                        n.n.dirty = true;
+                        n.n.moved = true;
+                    }
+                }
+                RED.history.replace({t:"multi",events:[historyEvent,{t:"move",nodes:ns}],dirty: historyEvent.dirty})
+            }
 
             updateSelection();
             RED.nodes.dirty(true);
@@ -22001,7 +22470,9 @@ RED.view = (function() {
             //     }
             // } else
             if (d3.event.shiftKey) {
-                clearSelection();
+                if (!(d3.event.ctrlKey||d3.event.metaKey)) {
+                    clearSelection();
+                }
                 var clickPosition = (d3.event.offsetX/scaleFactor - mousedown_node.x)
                 var edgeDelta = (mousedown_node.w/2) - Math.abs(clickPosition);
                 var cnodes;
@@ -22029,7 +22500,7 @@ RED.view = (function() {
                 mousedown_node.selected = true;
                 movingSet.add(mousedown_node);
             }
-            selected_link = null;
+            // selectedLinks.clear();
             if (d3.event.button != 2) {
                 mouse_mode = RED.state.MOVING;
                 var mouse = d3.touches(this)[0]||d3.mouse(this);
@@ -22155,19 +22626,35 @@ RED.view = (function() {
             d3.event.stopPropagation();
             return;
         }
-         mousedown_link = d;
-         clearSelection();
-         selected_link = mousedown_link;
-         updateSelection();
-         redraw();
-         focusView();
-         d3.event.stopPropagation();
-         if (d3.event.metaKey || d3.event.ctrlKey) {
-             d3.select(this).classed("red-ui-flow-link-splice",true);
-             var point = d3.mouse(this);
-             var clickedGroup = getGroupAt(point[0],point[1]);
-             showQuickAddDialog({position:point, splice:selected_link, group:clickedGroup});
-         }
+        if (d3.event.button === 2) {
+            return
+        }
+        mousedown_link = d;
+
+        if (!(d3.event.metaKey || d3.event.ctrlKey)) {
+            clearSelection();
+        }
+        if (d3.event.metaKey || d3.event.ctrlKey) {
+            if (!selectedLinks.has(mousedown_link)) {
+                selectedLinks.add(mousedown_link);
+            } else {
+                if (selectedLinks.length() !== 1) {
+                    selectedLinks.remove(mousedown_link);
+                }
+            }
+        } else {
+            selectedLinks.add(mousedown_link);
+        }
+        updateSelection();
+        redraw();
+        focusView();
+        d3.event.stopPropagation();
+        if (!mousedown_link.link && movingSet.length() === 0 && (d3.event.touches || d3.event.button === 0) && selectedLinks.length() === 1 && selectedLinks.has(mousedown_link) && (d3.event.metaKey || d3.event.ctrlKey)) {
+            d3.select(this).classed("red-ui-flow-link-splice",true);
+            var point = d3.mouse(this);
+            var clickedGroup = getGroupAt(point[0],point[1]);
+            showQuickAddDialog({position:point, splice:mousedown_link, group:clickedGroup});
+        }
     }
     function linkTouchStart(d) {
         if (mouse_mode === RED.state.SELECTING_NODE) {
@@ -22176,7 +22663,8 @@ RED.view = (function() {
         }
         mousedown_link = d;
         clearSelection();
-        selected_link = mousedown_link;
+        selectedLinks.clear();
+        selectedLinks.add(mousedown_link);
         updateSelection();
         redraw();
         focusView();
@@ -22412,7 +22900,7 @@ RED.view = (function() {
     function showTouchMenu(obj,pos) {
         var mdn = mousedown_node;
         var options = [];
-        options.push({name:"delete",disabled:(movingSet.length()===0 && selected_link === null),onselect:function() {deleteSelection();}});
+        options.push({name:"delete",disabled:(movingSet.length()===0 && selectedLinks.length() === 0),onselect:function() {deleteSelection();}});
         options.push({name:"cut",disabled:(movingSet.length()===0),onselect:function() {copySelection();deleteSelection();}});
         options.push({name:"copy",disabled:(movingSet.length()===0),onselect:function() {copySelection();}});
         options.push({name:"paste",disabled:(clipboard.length===0),onselect:function() {importNodes(clipboard, {generateIds: true, touchImport: true});}});
@@ -22545,28 +23033,89 @@ RED.view = (function() {
             if (activeSubflow) {
                 var subflowOutputs = nodeLayer.selectAll(".red-ui-flow-subflow-port-output").data(activeSubflow.out,function(d,i){ return d.id;});
                 subflowOutputs.exit().remove();
-                var outGroup = subflowOutputs.enter().insert("svg:g").attr("class","red-ui-flow-node red-ui-flow-subflow-port-output").attr("transform",function(d) { return "translate("+(d.x-20)+","+(d.y-20)+")"});
+                var outGroup = subflowOutputs.enter().insert("svg:g").attr("class","red-ui-flow-node red-ui-flow-subflow-port-output")
                 outGroup.each(function(d,i) {
-                    d.w=40;
-                    d.h=40;
+                    var node = d3.select(this);
+                    var nodeContents = document.createDocumentFragment();
+
+                    d.h = 40;
+                    d.resize = true;
+                    d.dirty = true;
+
+                    var mainRect = document.createElementNS("http://www.w3.org/2000/svg","rect");
+                    mainRect.__data__ = d;
+                    mainRect.setAttribute("class", "red-ui-flow-subflow-port");
+                    mainRect.setAttribute("rx", 8);
+                    mainRect.setAttribute("ry", 8);
+                    mainRect.setAttribute("width", 40);
+                    mainRect.setAttribute("height", 40);
+                    node[0][0].__mainRect__ = mainRect;
+                    d3.select(mainRect)
+                        .on("mouseup",nodeMouseUp)
+                        .on("mousedown",nodeMouseDown)
+                        .on("touchstart",nodeTouchStart)
+                        .on("touchend",nodeTouchEnd)
+                    nodeContents.appendChild(mainRect);
+
+                    var output_groupEl = document.createElementNS("http://www.w3.org/2000/svg","g");
+                    output_groupEl.setAttribute("x",0);
+                    output_groupEl.setAttribute("y",0);
+                    node[0][0].__outputLabelGroup__ = output_groupEl;
+
+                    var output_output = document.createElementNS("http://www.w3.org/2000/svg","text");
+                    output_output.setAttribute("class","red-ui-flow-port-label");
+                    output_output.style["font-size"] = "10px";
+                    output_output.textContent = "output";
+                    output_groupEl.appendChild(output_output);
+                    node[0][0].__outputOutput__ = output_output;
+
+                    var output_number = document.createElementNS("http://www.w3.org/2000/svg","text");
+                    output_number.setAttribute("class","red-ui-flow-port-label red-ui-flow-port-index");
+                    output_number.setAttribute("x",0);
+                    output_number.setAttribute("y",0);
+                    output_number.textContent = d.i+1;
+                    output_groupEl.appendChild(output_number);
+                    node[0][0].__outputNumber__ = output_number;
+
+                    var output_border = document.createElementNS("http://www.w3.org/2000/svg","path");
+                    output_border.setAttribute("d","M 40 1 l 0 38")
+                    output_border.setAttribute("class", "red-ui-flow-node-icon-shade-border")
+                    output_groupEl.appendChild(output_border);
+                    node[0][0].__outputBorder__ = output_border;
+
+                    nodeContents.appendChild(output_groupEl);
+
+                    var text = document.createElementNS("http://www.w3.org/2000/svg","g");
+                    text.setAttribute("class","red-ui-flow-port-label");
+                    text.setAttribute("transform","translate(38,0)");
+                    text.setAttribute('style', 'fill : #888');  // hard coded here!
+                    node[0][0].__textGroup__ = text;
+                    nodeContents.append(text);
+
+                    var portEl = document.createElementNS("http://www.w3.org/2000/svg","g");
+                    portEl.setAttribute('transform','translate(-5,15)')
+
+                    var port = document.createElementNS("http://www.w3.org/2000/svg","rect");
+                    port.setAttribute("class","red-ui-flow-port");
+                    port.setAttribute("rx",3);
+                    port.setAttribute("ry",3);
+                    port.setAttribute("width",10);
+                    port.setAttribute("height",10);
+                    portEl.appendChild(port);
+                    port.__data__ = d;
+
+                    d3.select(port)
+                        .on("mousedown", function(d,i){portMouseDown(d,PORT_TYPE_INPUT,0);} )
+                        .on("touchstart", function(d,i){portMouseDown(d,PORT_TYPE_INPUT,0);d3.event.preventDefault();} )
+                        .on("mouseup", function(d,i){portMouseUp(d,PORT_TYPE_INPUT,0);})
+                        .on("touchend",function(d,i){portMouseUp(d,PORT_TYPE_INPUT,0);d3.event.preventDefault();} )
+                        .on("mouseover",function(d){portMouseOver(d3.select(this),d,PORT_TYPE_INPUT,0);})
+                        .on("mouseout",function(d){portMouseOut(d3.select(this),d,PORT_TYPE_INPUT,0);});
+
+                    node[0][0].__port__ = portEl
+                    nodeContents.appendChild(portEl);
+                    node[0][0].appendChild(nodeContents);
                 });
-                outGroup.append("rect").attr("class","red-ui-flow-subflow-port").attr("rx",8).attr("ry",8).attr("width",40).attr("height",40)
-                    // TODO: This is exactly the same set of handlers used for regular nodes - DRY
-                    .on("mouseup",nodeMouseUp)
-                    .on("mousedown",nodeMouseDown)
-                    .on("touchstart",nodeTouchStart)
-                    .on("touchend",nodeTouchEnd)
-
-                outGroup.append("g").attr('transform','translate(-5,15)').append("rect").attr("class","red-ui-flow-port").attr("rx",3).attr("ry",3).attr("width",10).attr("height",10)
-                    .on("mousedown", function(d,i){portMouseDown(d,PORT_TYPE_INPUT,0);} )
-                    .on("touchstart", function(d,i){portMouseDown(d,PORT_TYPE_INPUT,0);d3.event.preventDefault();} )
-                    .on("mouseup", function(d,i){portMouseUp(d,PORT_TYPE_INPUT,0);})
-                    .on("touchend",function(d,i){portMouseUp(d,PORT_TYPE_INPUT,0);d3.event.preventDefault();} )
-                    .on("mouseover",function(d){portMouseOver(d3.select(this),d,PORT_TYPE_INPUT,0);})
-                    .on("mouseout",function(d){portMouseOut(d3.select(this),d,PORT_TYPE_INPUT,0);});
-
-                outGroup.append("svg:text").attr("class","red-ui-flow-port-label").attr("x",20).attr("y",12).style("font-size","10px").text("output");
-                outGroup.append("svg:text").attr("class","red-ui-flow-port-label red-ui-flow-port-index").attr("x",20).attr("y",28).text(function(d,i){ return i+1});
 
                 var subflowInputs = nodeLayer.selectAll(".red-ui-flow-subflow-port-input").data(activeSubflow.in,function(d,i){ return d.id;});
                 subflowInputs.exit().remove();
@@ -22619,11 +23168,89 @@ RED.view = (function() {
 
                 subflowOutputs.each(function(d,i) {
                     if (d.dirty) {
-                        var output = d3.select(this);
-                        output.classed("red-ui-flow-node-selected",function(d) { return d.selected; })
-                        output.selectAll(".red-ui-flow-port-index").text(function(d){ return d.i+1});
-                        output.attr("transform", function(d) { return "translate(" + (d.x-d.w/2) + "," + (d.y-d.h/2) + ")"; });
+
+                        var port_height = 40;
+
+                        var self = this;
+                        var thisNode = d3.select(this);
+
                         dirtyNodes[d.id] = d;
+
+                        var label = getPortLabel(activeSubflow, PORT_TYPE_OUTPUT, d.i) || "";
+                        var hideLabel = (label.length < 1)
+
+                        var labelParts;
+                        if (d.resize || this.__hideLabel__ !== hideLabel || this.__label__ !== label) {
+                            labelParts = getLabelParts(label, "red-ui-flow-node-label");
+                            if (labelParts.lines.length !== this.__labelLineCount__ || this.__label__ !== label) {
+                                d.resize = true;
+                            }
+                            this.__label__ = label;
+                            this.__labelLineCount__ = labelParts.lines.length;
+
+                            if (hideLabel) {
+                                d.h = Math.max(port_height,(d.outputs || 0) * 15);
+                            } else {
+                                d.h = Math.max(6+24*labelParts.lines.length,(d.outputs || 0) * 15, port_height);
+                            }
+                            this.__hideLabel__ = hideLabel;
+                        }
+
+                        if (d.resize) {
+                            var ow = d.w;
+                            if (hideLabel) {
+                                d.w = port_height;
+                            } else {
+                                d.w = Math.max(port_height,20*(Math.ceil((labelParts.width+50+7)/20)) );
+                            }
+                            if (ow !== undefined) {
+                                d.x += (d.w-ow)/2;
+                            }
+                            d.resize = false;
+                        }
+
+                        this.setAttribute("transform", "translate(" + (d.x-d.w/2) + "," + (d.y-d.h/2) + ")");
+                        // This might be the first redraw after a node has been click-dragged to start a move.
+                        // So its selected state might have changed since the last redraw.
+                        this.classList.toggle("red-ui-flow-node-selected", !!d.selected )
+                        if (mouse_mode != RED.state.MOVING_ACTIVE) {
+                            this.classList.toggle("red-ui-flow-node-disabled", d.d === true);
+                            this.__mainRect__.setAttribute("width", d.w)
+                            this.__mainRect__.setAttribute("height", d.h)
+                            this.__mainRect__.classList.toggle("red-ui-flow-node-highlighted",!!d.highlighted );
+
+                            if (labelParts) {
+                                // The label has changed
+                                var sa = labelParts.lines;
+                                var sn = labelParts.lines.length;
+                                var textLines = this.__textGroup__.childNodes;
+                                while(textLines.length > sn) {
+                                    textLines[textLines.length-1].remove();
+                                }
+                                for (var i=0; i<sn; i++) {
+                                    if (i===textLines.length) {
+                                        var line = document.createElementNS("http://www.w3.org/2000/svg","text");
+                                        line.setAttribute("class","red-ui-flow-node-label-text");
+                                        line.setAttribute("x",0);
+                                        line.setAttribute("y",i*24);
+                                        this.__textGroup__.appendChild(line);
+                                    }
+                                    textLines[i].textContent = sa[i];
+                                }
+                            }
+
+                            var textClass = "red-ui-flow-node-label"+(hideLabel?" hide":"");
+                            this.__textGroup__.setAttribute("class", textClass);
+                            var yp = d.h / 2 - (this.__labelLineCount__ / 2) * 24 + 13;
+
+                            // this.__textGroup__.classList.remove("red-ui-flow-node-label-right");
+                            this.__textGroup__.setAttribute("transform", "translate(48,"+yp+")");
+
+                            this.__outputBorder__.setAttribute("d","M 40 1 l 0 "+(hideLabel?0:(d.h - 2)));
+                            this.__port__.setAttribute("transform","translate(-5,"+((d.h/2)-5)+")");
+                            this.__outputOutput__.setAttribute("transform","translate(20,"+((d.h/2)-8)+")");
+                            this.__outputNumber__.setAttribute("transform","translate(20,"+((d.h/2)+7)+")");
+                        }
                         d.dirty = false;
                     }
                 });
@@ -23149,6 +23776,13 @@ RED.view = (function() {
                 d3.select(pathBack)
                     .on("mousedown",linkMouseDown)
                     .on("touchstart",linkTouchStart)
+                    .on("mousemove", function(d) {
+                        if (mouse_mode === RED.state.SLICING) {
+                            selectedLinks.add(d)
+                            l.classed("red-ui-flow-link-splice",true)
+                            redraw()
+                        }
+                    })
 
                 var pathOutline = document.createElementNS("http://www.w3.org/2000/svg","path");
                 pathOutline.__data__ = d;
@@ -23169,7 +23803,7 @@ RED.view = (function() {
             link.exit().remove();
             link.each(function(d) {
                 var link = d3.select(this);
-                if (d.added || d===selected_link || d.selected || dirtyNodes[d.source.id] || dirtyNodes[d.target.id]) {
+                if (d.added || d.selected || dirtyNodes[d.source.id] || dirtyNodes[d.target.id]) {
                     var numOutputs = d.source.outputs || 1;
                     var sourcePort = d.sourcePort || 0;
                     var y = -((numOutputs-1)/2)*13 +13*sourcePort;
@@ -23192,7 +23826,8 @@ RED.view = (function() {
                     this.__pathLine__.classList.toggle("red-ui-flow-node-disabled",!!(d.source.d || d.target.d));
                     this.__pathLine__.classList.toggle("red-ui-flow-subflow-link", !d.link && activeSubflow);
                 }
-                this.classList.toggle("red-ui-flow-link-selected", !!(d===selected_link||d.selected));
+
+                this.classList.toggle("red-ui-flow-link-selected", !!d.selected);
 
                 var connectedToUnknown = !!(d.target.type == "unknown" || d.source.type == "unknown");
                 this.classList.toggle("red-ui-flow-link-unknown",!!(d.target.type == "unknown" || d.source.type == "unknown"))
@@ -23900,8 +24535,9 @@ RED.view = (function() {
         if (allNodes.size > 0) {
             selection.nodes = Array.from(allNodes);
         }
-        if (selected_link != null) {
-            selection.link = selected_link;
+        if (selectedLinks.length() > 0) {
+            selection.links = selectedLinks.toArray();
+            selection.link = selection.links[0];
         }
         return selection;
     }
@@ -25202,6 +25838,90 @@ RED.view.tools = (function() {
         }
     }
 
+
+    function wireSeriesOfNodes() {
+        var selection = RED.view.selection();
+        if (selection.nodes) {
+            if (selection.nodes.length > 1) {
+                var i = 0;
+                var newLinks = [];
+                while (i < selection.nodes.length - 1) {
+                    var nodeA = selection.nodes[i];
+                    var nodeB = selection.nodes[i+1];
+                    if (nodeA.outputs > 0 && nodeB.inputs > 0) {
+                        var existingLinks = RED.nodes.filterLinks({
+                            source: nodeA,
+                            target: nodeB,
+                            sourcePort: 0
+                        })
+                        if (existingLinks.length === 0) {
+                            var newLink = {
+                                source: nodeA,
+                                target: nodeB,
+                                sourcePort: 0
+                            }
+                            RED.nodes.addLink(newLink);
+                            newLinks.push(newLink);
+                        }
+                    }
+                    i++;
+                }
+                if (newLinks.length > 0) {
+                    RED.history.push({
+                        t: 'add',
+                        links: newLinks,
+                        dirty: RED.nodes.dirty()
+                    })
+                    RED.nodes.dirty(true);
+                    RED.view.redraw(true);
+                }
+            }
+        }
+    }
+
+    function wireNodeToMultiple() {
+        var selection = RED.view.selection();
+        if (selection.nodes) {
+            if (selection.nodes.length > 1) {
+                var sourceNode = selection.nodes[0];
+                if (sourceNode.outputs === 0) {
+                    return;
+                }
+                var i = 1;
+                var newLinks = [];
+                while (i < selection.nodes.length) {
+                    var targetNode = selection.nodes[i];
+                    if (targetNode.inputs > 0) {
+                        var existingLinks = RED.nodes.filterLinks({
+                            source: sourceNode,
+                            target: targetNode,
+                            sourcePort: Math.min(sourceNode.outputs-1,i-1)
+                        })
+                        if (existingLinks.length === 0) {
+                            var newLink = {
+                                source: sourceNode,
+                                target: targetNode,
+                                sourcePort: Math.min(sourceNode.outputs-1,i-1)
+                            }
+                            RED.nodes.addLink(newLink);
+                            newLinks.push(newLink);
+                        }
+                    }
+                    i++;
+                }
+                if (newLinks.length > 0) {
+                    RED.history.push({
+                        t: 'add',
+                        links: newLinks,
+                        dirty: RED.nodes.dirty()
+                    })
+                    RED.nodes.dirty(true);
+                    RED.view.redraw(true);
+                }
+            }
+        }
+    }
+
     return {
         init: function() {
             RED.actions.add("core:show-selected-node-labels", function() { setSelectedNodeLabelState(true); })
@@ -25260,7 +25980,8 @@ RED.view.tools = (function() {
             RED.actions.add("core:distribute-selection-horizontally", function() { distributeSelection('h') })
             RED.actions.add("core:distribute-selection-vertically", function() { distributeSelection('v') })
 
-
+            RED.actions.add("core:wire-series-of-nodes", function() { wireSeriesOfNodes() })
+            RED.actions.add("core:wire-node-to-multiple", function() { wireNodeToMultiple() })
 
             // RED.actions.add("core:add-node", function() { addNode() })
         },
@@ -25298,6 +26019,15 @@ RED.sidebar = (function() {
     var sidebar_tabs;
     var knownTabs = {};
 
+    // We store the current sidebar tab id in localStorage as 'last-sidebar-tab'
+    // This is restored when the editor is reloaded.
+    // We use sidebar_tabs.onchange to update localStorage. However that will
+    // also get triggered when the first tab gets added to the tabs - typically
+    // the 'info' tab. So we use the following variable to store the retrieved
+    // value from localStorage before we start adding the actual tabs
+    var lastSessionSelectedTab = null;
+
+
     function addTab(title,content,closeable,visible) {
         var options;
         if (typeof title === "string") {
@@ -25473,16 +26203,16 @@ RED.sidebar = (function() {
         RED.events.emit("sidebar:resize");
     }
 
-    function showSidebar(id) {
+    function showSidebar(id, skipShowSidebar) {
         if (id === ":first") {
-            id = RED.settings.get("editor.sidebar.order",["info", "help", "version-control", "debug"])[0]
+            id = lastSessionSelectedTab || RED.settings.get("editor.sidebar.order",["info", "help", "version-control", "debug"])[0]
         }
         if (id) {
             if (!containsTab(id) && knownTabs[id]) {
                 sidebar_tabs.addTab(knownTabs[id]);
             }
             sidebar_tabs.activateTab(id);
-            if (!RED.menu.isSelected("menu-item-sidebar")) {
+            if (!skipShowSidebar && !RED.menu.isSelected("menu-item-sidebar")) {
                 RED.menu.setSelected("menu-item-sidebar",true);
             }
         }
@@ -25506,6 +26236,7 @@ RED.sidebar = (function() {
                 if (tab.toolbar) {
                     $(tab.toolbar).show();
                 }
+                RED.settings.setLocal("last-sidebar-tab", tab.id)
             },
             onremove: function(tab) {
                 $(tab.wrapper).hide();
@@ -25534,7 +26265,9 @@ RED.sidebar = (function() {
             }
         });
         RED.popover.tooltip($("#red-ui-sidebar-separator").find(".red-ui-sidebar-control-right"),RED._("keyboard.toggleSidebar"),"core:toggle-sidebar");
-        showSidebar();
+
+        lastSessionSelectedTab = RED.settings.getLocal("last-sidebar-tab")
+
         RED.sidebar.info.init();
         RED.sidebar.help.init();
         RED.sidebar.config.init();
@@ -27593,15 +28326,17 @@ RED.sidebar.help = (function() {
             style: "compact",
             delay: 100,
             change: function() {
-                var val = $(this).val().toLowerCase();
-                if (val) {
+                const searchFor = $(this).val().toLowerCase();
+                if (searchFor) {
                     showTOC();
-                    var c = treeList.treeList('filter',function(item) {
+                    treeList.treeList('filter',function(item) {
                         if (item.depth === 0) {
                             return true;
                         }
-                        return (item.nodeType &&  item.nodeType.indexOf(val) > -1) ||
-                               (item.subflowLabel && item.subflowLabel.indexOf(val) > -1)
+                        let found = item.nodeType && item.nodeType.toLowerCase().indexOf(searchFor) > -1;
+                        found = found || item.subflowLabel && item.subflowLabel.toLowerCase().indexOf(searchFor) > -1;
+                        found = found || item.palleteLabel && item.palleteLabel.toLowerCase().indexOf(searchFor) > -1;
+                        return found;
                     },true)
                 } else {
                     treeList.treeList('filter',null);
@@ -27753,17 +28488,21 @@ RED.sidebar.help = (function() {
 
 
         moduleNames.forEach(function(moduleName) {
-            var module = modules[moduleName];
-            var nodeTypes = [];
-
-            var setNames = Object.keys(module.sets);
+            const module = modules[moduleName];
+            const nodeTypes = [];
+            const moduleSets = module.sets;
+            const setNames = Object.keys(moduleSets);
             setNames.forEach(function(setName) {
-                module.sets[setName].types.forEach(function(nodeType) {
+                const moduleSet = moduleSets[setName];
+                moduleSet.types.forEach(function(nodeType) {
                     if ($("script[data-help-name='"+nodeType+"']").length) {
+                        const n =  {_def:RED.nodes.getType(nodeType),type:nodeType}
+                        n.name = getNodePaletteLabel(n);
                         nodeTypes.push({
                             id: "node-type:"+nodeType,
                             nodeType: nodeType,
-                            element:getNodeLabel({_def:RED.nodes.getType(nodeType),type:nodeType})
+                            palleteLabel: n.name,
+                            element: getNodeLabel(n)
                         })
                     }
                 })
@@ -27783,18 +28522,21 @@ RED.sidebar.help = (function() {
         treeList.treeList("data",helpData);
     }
 
-    function getNodeLabel(n) {
-        var div = $('<div>',{class:"red-ui-node-list-item"});
-        var icon = RED.utils.createNodeIcon(n).appendTo(div);
-        var label = n.name;
+    function getNodePaletteLabel(n) {
+        let label = n.name;
         if (!label && n._def && n._def.paletteLabel) {
             try {
                 label = (typeof n._def.paletteLabel === "function" ? n._def.paletteLabel.call(n._def) : n._def.paletteLabel)||"";
             } catch (err) {
             }
         }
-        label = label || n.type;
-        $('<div>',{class:"red-ui-node-label"}).text(n.name||n.type).appendTo(icon);
+        return label || n.type;
+    }
+
+    function getNodeLabel(n) {
+        const div = $('<div>',{class:"red-ui-node-list-item"});
+        const icon = RED.utils.createNodeIcon(n).appendTo(div);
+        $('<div>',{class:"red-ui-node-label"}).text(getNodePaletteLabel(n)).appendTo(icon);
         return div;
     }
 
@@ -31929,9 +32671,10 @@ RED.editor = (function() {
                     editState.changed = true;
                 }
                 if (!node._def.defaults || !node._def.defaults.hasOwnProperty("icon")) {
-                    var icon = $("#red-ui-editor-node-icon").val()||""
+                    var icon = $("#red-ui-editor-node-icon").val()||"";
                     if (!this.isDefaultIcon) {
-                        if (icon !== node.icon) {
+                        if ((icon !== node.icon) &&
+                            (icon !== "")) {
                             editState.changes.icon = node.icon;
                             node.icon = icon;
                             editState.changed = true;
@@ -31995,14 +32738,14 @@ RED.editor = (function() {
                     if (showLabel) {
                         // Default to show label
                         if (node.l !== false) {
-                            editState.changes.l = node.l
+                            editState.changes.l = node.l;
                             editState.changed = true;
                         }
                         node.l = false;
                     } else {
                         // Node has showLabel:false (eg link nodes)
                         if (node.hasOwnProperty('l') && node.l) {
-                            editState.changes.l = node.l
+                            editState.changes.l = node.l;
                             editState.changed = true;
                         }
                         delete node.l;
@@ -32012,20 +32755,20 @@ RED.editor = (function() {
                     if (showLabel) {
                         // Default to show label
                         if (node.hasOwnProperty('l') && !node.l) {
-                            editState.changes.l = node.l
+                            editState.changes.l = node.l;
                             editState.changed = true;
                         }
                         delete node.l;
                     } else {
                         if (!node.l) {
-                            editState.changes.l = node.l
+                            editState.changes.l = node.l;
                             editState.changed = true;
                         }
                         node.l = true;
                     }
                 }
             }
-        }
+        };
     });
 
     function buildAppearanceForm(container,node) {
@@ -32058,10 +32801,10 @@ RED.editor = (function() {
             var categories = RED.palette.getCategories();
             categories.sort(function(A,B) {
                 return A.label.localeCompare(B.label);
-            })
+            });
             categories.forEach(function(cat) {
                 categorySelector.append($("<option/>").val(cat.id).text(cat.label));
-            })
+            });
             categorySelector.append($("<option/>").attr('disabled',true).text("---"));
             categorySelector.append($("<option/>").val("_custom_").text(RED._("palette.addCategory")));
 
@@ -32074,7 +32817,7 @@ RED.editor = (function() {
                     $("#subflow-appearance-input-category").width(250);
                     $("#subflow-appearance-input-custom-category").hide();
                 }
-            })
+            });
 
             $("#subflow-appearance-input-category").val(node.category||"subflows");
             var userCount = 0;
@@ -32098,7 +32841,7 @@ RED.editor = (function() {
         $("#node-input-show-label").toggleButton({
             enabledLabel: RED._("editor.show"),
             disabledLabel: RED._("editor.hide")
-        })
+        });
 
         if (!node.hasOwnProperty("l")) {
             // Show label unless def.showLabel set to false
@@ -32124,7 +32867,7 @@ RED.editor = (function() {
                 "#E9967A", "#F3B567", "#FDD0A2",
                 "#FDF0C2", "#FFAAAA", "#FFCC66",
                 "#FFF0F0", "#FFFFFF"
-            ]
+            ];
 
             RED.editor.colorPicker.create({
                 id: "red-ui-editor-node-color",
@@ -32139,9 +32882,9 @@ RED.editor = (function() {
                 nodeDiv.css('backgroundColor',colour);
                 var borderColor = RED.utils.getDarkerColor(colour);
                 if (borderColor !== colour) {
-                    nodeDiv.css('border-color',borderColor)
+                    nodeDiv.css('border-color',borderColor);
                 }
-            })
+            });
         }
 
 
@@ -32158,7 +32901,7 @@ RED.editor = (function() {
             nodeDiv.css('backgroundColor',colour);
             var borderColor = RED.utils.getDarkerColor(colour);
             if (borderColor !== colour) {
-                nodeDiv.css('border-color',borderColor)
+                nodeDiv.css('border-color',borderColor);
             }
 
             var iconContainer = $('<div/>',{class:"red-ui-palette-icon-container"}).appendTo(nodeDiv);
@@ -32186,7 +32929,7 @@ RED.editor = (function() {
 
             RED.popover.tooltip(iconButton, function() {
                 return $("#red-ui-editor-node-icon").val() || RED._("editor.default");
-            })
+            });
             $('<input type="hidden" id="red-ui-editor-node-icon">').val(node.icon).appendTo(iconRow);
         }
 
@@ -32311,11 +33054,11 @@ RED.editor = (function() {
             });
             rows.sort(function(A,B) {
                 return A.i-B.i;
-            })
+            });
             rows.forEach(function(r,i) {
                 r.r.find("label").text((i+1)+".");
                 r.r.appendTo(outputsDiv);
-            })
+            });
             if (rows.length === 0) {
                 buildLabelRow("output",i,"").appendTo(outputsDiv);
             } else {
@@ -32361,7 +33104,7 @@ RED.editor = (function() {
             clear.on("click", function(evt) {
                 evt.preventDefault();
                 input.val("");
-            })
+            });
         }
         return result;
     }
@@ -32395,6 +33138,12 @@ RED.editor = (function() {
             }
             var v = $(this).val();
             hasNonBlankLabel = hasNonBlankLabel || v!== "";
+
+            // mark changed output port labels as dirty
+            if (node.type === "subflow" && (!node.outputLabels || node.outputLabels[index] !== v)) {
+                node.out[index].dirty = true;
+            }
+
             newValue[index] = v;
         });
 
@@ -32403,6 +33152,12 @@ RED.editor = (function() {
             changes.outputLabels = node.outputLabels;
             node.outputLabels = newValue;
             changed = true;
+
+            // trigger redraw of dirty port labels
+            if (node.type === "subflow") {
+                RED.view.redraw();
+            }
+
         }
         return changed;
     }
@@ -36330,7 +37085,7 @@ RED.editor.codeEditor.monaco = (function() {
                     createMonacoCompletionItem("set (flow context)", 'flow.set("${1:name}", ${1:value});','Set a value in flow context',range),
                     createMonacoCompletionItem("get (global context)", 'global.get("${1:name}");','Get a value from global context',range),
                     createMonacoCompletionItem("set (global context)", 'global.set("${1:name}", ${1:value});','Set a value in global context',range),
-                    createMonacoCompletionItem("get (env)", 'env.get("${1:name}");','Get env variable value',range),
+                    createMonacoCompletionItem("get (env)", 'env.get("${1|NR_NODE_ID,NR_NODE_NAME,NR_NODE_PATH,NR_GROUP_ID,NR_GROUP_NAME,NR_FLOW_ID,NR_FLOW_NAME|}");','Get env variable value',range),
                     createMonacoCompletionItem("cloneMessage (RED.util)", 'RED.util.cloneMessage(${1:msg});',
                         ["```typescript",
                         "RED.util.cloneMessage<T extends registry.NodeMessage>(msg: T): T",
@@ -40133,6 +40888,7 @@ RED.search = (function() {
     var selected = -1;
     var visible = false;
 
+    var searchHistory = [];
     var index = {};
     var currentResults = [];
     var previousActiveElement;
@@ -40163,10 +40919,22 @@ RED.search = (function() {
         }
         l = l||n.label||n.name||n.id||"";
 
-
         var properties = ['id','type','name','label','info'];
-        if (n._def && n._def.defaults) {
-            properties = properties.concat(Object.keys(n._def.defaults));
+        const node_def = n && n._def;
+        if (node_def) {
+            if (node_def.defaults) {
+                properties = properties.concat(Object.keys(node_def.defaults));
+            }
+            if (n.type !== "group" && node_def.paletteLabel && node_def.paletteLabel !== node_def.type) {
+                try {
+                    const label = ("" + (typeof node_def.paletteLabel === "function" ? node_def.paletteLabel.call(node_def) : node_def.paletteLabel)).toLowerCase();
+                    if(label && label !== (""+node_def.type).toLowerCase()) {
+                        indexProperty(n, l, label);
+                    }
+                } catch(err) {
+                    console.warn(`error indexing ${l}`, err);
+                }
+            }
         }
         for (var i=0;i<properties.length;i++) {
             if (n.hasOwnProperty(properties[i])) {
@@ -40316,6 +41084,20 @@ RED.search = (function() {
         }
     }
 
+    function populateSearchHistory() {
+        if (searchHistory.length > 0) {
+            searchResults.editableList('addItem',{
+                historyHeader: true
+            });
+            searchHistory.forEach(function(entry) {
+                searchResults.editableList('addItem',{
+                    history: true,
+                    value: entry
+                });
+            })
+        }
+
+    }
     function createDialog() {
         dialog = $("<div>",{id:"red-ui-search",class:"red-ui-search"}).appendTo("#red-ui-main-container");
         var searchDiv = $("<div>",{class:"red-ui-search-container"}).appendTo(dialog);
@@ -40324,7 +41106,12 @@ RED.search = (function() {
             change: function() {
                 searchResults.editableList('empty');
                 selected = -1;
-                currentResults = search($(this).val());
+                var value = $(this).val();
+                if (value === "") {
+                    populateSearchHistory();
+                    return;
+                }
+                currentResults = search(value);
                 if (currentResults.length > 0) {
                     for (i=0;i<Math.min(currentResults.length,25);i++) {
                         searchResults.editableList('addItem',currentResults[i])
@@ -40396,7 +41183,12 @@ RED.search = (function() {
                                 })
                             }
                         }
-                    } else {
+                    } if ($(children[selected]).hasClass("red-ui-search-history")) {
+                        var object = $(children[selected]).find(".red-ui-editableList-item-content").data('data');
+                        if (object) {
+                            searchInput.searchBox('value',object.value)
+                        }
+                    } else if (!$(children[selected]).hasClass("red-ui-search-historyHeader")) {
                         if (currentResults.length > 0) {
                             reveal(currentResults[Math.max(0,selected)].node);
                         }
@@ -40412,7 +41204,32 @@ RED.search = (function() {
             addItem: function(container,i,object) {
                 var node = object.node;
                 var div;
-                if (object.more) {
+                if (object.historyHeader) {
+                    container.parent().addClass("red-ui-search-historyHeader")
+                    $('<div>',{class:"red-ui-search-empty"}).text(RED._("search.history")).appendTo(container);
+                    $('<button type="button" class="red-ui-button red-ui-button-small"></button>').text(RED._("search.clear")).appendTo(container).on("click", function(evt) {
+                        evt.preventDefault();
+                        searchHistory = [];
+                        searchResults.editableList('empty');
+                    });
+                } else if (object.history) {
+                    container.parent().addClass("red-ui-search-history")
+                    div = $('<a>',{href:'#',class:"red-ui-search-result"}).appendTo(container);
+                    div.text(object.value);
+                    div.on("click", function(evt) {
+                        evt.preventDefault();
+                        searchInput.searchBox('value',object.value)
+                        searchInput.focus();
+                    })
+                    $('<button type="button" class="red-ui-button red-ui-button-small"><i class="fa fa-remove"></i></button>').appendTo(container).on("click", function(evt) {
+                        evt.preventDefault();
+                        var index = searchHistory.indexOf(object.value);
+                        searchHistory.splice(index,1);
+                        searchResults.editableList('removeItem', object);
+                    });
+
+
+                } else if (object.more) {
                     container.parent().addClass("red-ui-search-more")
                     div = $('<a>',{href:'#',class:"red-ui-search-result red-ui-search-empty"}).appendTo(container);
                     div.text(RED._("palette.editor.more",{count:object.more.results.length-object.more.start}));
@@ -40467,6 +41284,12 @@ RED.search = (function() {
     }
 
     function reveal(node) {
+        var searchVal = searchInput.val();
+        var existingIndex = searchHistory.indexOf(searchVal);
+        if (existingIndex > -1) {
+            searchHistory.splice(existingIndex,1);
+        }
+        searchHistory.unshift(searchInput.val());
         hide();
         RED.view.reveal(node.id);
     }
@@ -40485,9 +41308,14 @@ RED.search = (function() {
 
             if (dialog === null) {
                 createDialog();
+            } else {
+                searchResults.editableList('empty');
             }
             dialog.slideDown(300);
             searchInput.searchBox('value',v)
+            if (!v || v === "") {
+                populateSearchHistory();
+            }
             RED.events.emit("search:open");
             visible = true;
         }
@@ -40745,18 +41573,19 @@ RED.actionList = (function() {
                 createDialog();
             }
             dialog.slideDown(300);
-            searchInput.searchBox('value',v)
+            searchInput.searchBox('value',v);
             searchResults.editableList('empty');
             results = [];
             var actions = RED.actions.list();
             actions.sort(function(A,B) {
-                return A.id.localeCompare(B.id);
+                var Akey = A.label;
+                var Bkey = B.label;
+                return Akey.localeCompare(Bkey);
             });
             actions.forEach(function(action) {
-                action.label = action.id.replace(/:/,": ").replace(/-/g," ").replace(/(^| )./g,function() { return arguments[0].toUpperCase()});
                 action._label = action.label.toLowerCase();
-                searchResults.editableList('addItem',action)
-            })
+                searchResults.editableList('addItem',action);
+            });
             RED.events.emit("actionList:open");
             visible = true;
         }
@@ -43118,12 +43947,14 @@ RED.group = (function() {
         markDirty(group);
     }
 
-    function getNodes(group,recursive) {
+    function getNodes(group,recursive,excludeGroup) {
         var nodes = [];
         group.nodes.forEach(function(n) {
-            nodes.push(n);
+            if (n.type !== 'group' || !excludeGroup) {
+                nodes.push(n);
+            }
             if (recursive && n.type === 'group') {
-                nodes = nodes.concat(getNodes(n,recursive))
+                nodes = nodes.concat(getNodes(n,recursive,excludeGroup))
             }
         })
         return nodes;
@@ -43357,6 +44188,13 @@ RED.userSettings = (function() {
         //         {setting:"theme", label:"Theme",options:function(done){ done([{val:'',text:'default'}].concat(RED.settings.theme("themes"))) }},
         //     ]
         // },
+        {
+            title: "menu.label.view.view",
+            options: [
+                {setting:"view-store-zoom",label:"menu.label.view.storeZoom", default: false, toggle:true, onchange: function(val) { if (!val) { RED.settings.removeLocal("zoom-level")}}},
+                {setting:"view-store-position",label:"menu.label.view.storePosition", default: false, toggle:true, onchange: function(val) { if (!val) { RED.settings.removeLocal("scroll-positions")}}},
+            ]
+        },
         {
             title: "menu.label.view.grid",
             options: [
@@ -44744,6 +45582,9 @@ RED.projects = (function() {
                             }
                         }).appendTo(row);
 
+                        row = $('<div class="form-row red-ui-projects-dialog-screen-create-row red-ui-projects-dialog-screen-create-row-open"></div>').hide().appendTo(container);
+                        $('<span style="display: flex; align-items: center;"><input style="padding:0; margin: 0 5px 0 0" checked type="checkbox" id="red-ui-projects-dialog-screen-clear-context"> <label for="red-ui-projects-dialog-screen-clear-context" style="padding:0; margin: 0"> <span data-i18n="projects.create.clearContext"></span></label></span>').appendTo(row).i18n();
+
                         row = $('<div class="form-row red-ui-projects-dialog-screen-create-row red-ui-projects-dialog-screen-create-row-empty red-ui-projects-dialog-screen-create-row-clone"></div>').appendTo(container);
                         $('<label for="red-ui-projects-dialog-screen-create-project-name">'+RED._("projects.create.project-name")+'</label>').appendTo(row);
 
@@ -45033,7 +45874,8 @@ RED.projects = (function() {
                                             };
                                         }
                                     } else if (projectType === 'open') {
-                                        return switchProject(selectedProject.name,function(err,data) {
+                                        var clearContext = $("#red-ui-projects-dialog-screen-clear-context").prop("checked")
+                                        return switchProject(selectedProject.name, clearContext, function(err,data) {
                                             if (err) {
                                                 if (err.code !== 'credentials_load_failed') {
                                                     console.log(RED._("projects.create.unexpected_error"),err)
@@ -45127,7 +45969,7 @@ RED.projects = (function() {
         }
     }
 
-    function switchProject(name,done) {
+    function switchProject(name,clearContext,done) {
         RED.deploy.setDeployInflight(true);
         RED.projects.settings.switchProject(name);
         sendRequest({
@@ -45146,7 +45988,7 @@ RED.projects = (function() {
                     '*': done
                 },
             }
-        },{active:true}).then(function() {
+        },{active:true, clearContext:clearContext}).then(function() {
             dialog.dialog( "close" );
             RED.events.emit("project:change", {name:name});
         }).always(function() {
@@ -45219,7 +46061,7 @@ RED.projects = (function() {
             dialogHeight = 590 - (750 - winHeight);
         }
         $(".red-ui-projects-dialog-box").height(dialogHeight);
-        $(".red-ui-projects-dialog-project-list-inner-container").height(Math.max(500,dialogHeight) - 180);
+        $(".red-ui-projects-dialog-project-list-inner-container").height(Math.max(500,dialogHeight) - 210);
         dialog.dialog('option','title',screen.title||"");
         dialog.dialog("open");
     }
@@ -49926,6 +50768,10 @@ RED.touch.radialMenu = (function() {
             }
             $('<div>').css("text-align","left").html(getLocaleText(step.description)).appendTo(stepDescription);
 
+            if (step.image) {
+                $(`<img src="red/tours/${step.image}" />`).appendTo(stepDescription)
+            }
+
             var stepToolbar = $('<div>',{class:"red-ui-tourGuide-toolbar"}).appendTo(stepContent);
 
             // var breadcrumbs = $('<div>',{class:"red-ui-tourGuide-breadcrumbs"}).appendTo(stepToolbar);