@node-red/editor-client 3.0.0 → 3.0.1

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@node-red/editor-client",
-    "version": "3.0.0",
+    "version": "3.0.1",
     "license": "Apache-2.0",
     "repository": {
         "type": "git",

package/public/red/about

@@ -1,3 +1,17 @@
+#### 3.0.1: Maintenance Release
+
+Editor
+
+ - Allow codeEditor theme to be set even if `codeEditor` is not set in settings.js (#3794) @Steve-Mcl
+ - Sys info (diagnostics report) amendments (#3793) @Steve-Mcl
+ - Allow `mode` and `title` to be omitted in `options` argument for `createEditor` (#3791) @Steve-Mcl
+ - Fix focus issues (#3789) @Steve-Mcl
+ - Ensure all typedInput buttons have button type set (#3788) @knolleary
+ - Do not flag hasUsers=false nodes as unused in search (#3787) @knolleary
+ - Properly position quick-add dialog in all cases (#3786) @knolleary
+ - Ensure quick-add dialog does not obscure ghost node when shifted (#3785) @knolleary
+ - Remove use of Object.hasOwn (#3784) @knolleary
+
 #### 3.0.0: Milestone Release
 
 Editor

package/public/red/red.js

@@ -857,7 +857,7 @@ var RED = (function() {
         $('<div id="red-ui-header-shade" class="hide"></div>').appendTo(header);
         $('<div id="red-ui-main-container" class="red-ui-sidebar-closed hide">'+
             '<div id="red-ui-workspace"></div>'+
-            '<div id="red-ui-editor-stack"></div>'+
+            '<div id="red-ui-editor-stack" tabindex="-1"></div>'+
             '<div id="red-ui-palette"></div>'+
             '<div id="red-ui-sidebar"></div>'+
             '<div id="red-ui-sidebar-separator"></div>'+
@@ -13841,10 +13841,10 @@ RED.stack = (function() {
                         optEl.append(generateSpans(srcMatch));
                         optEl.appendTo(element);
                     }
-                    matches.push({ 
-                        value: optVal, 
-                        label: element, 
-                        i: (valMatch.found ? valMatch.index : srcMatch.index) 
+                    matches.push({
+                        value: optVal,
+                        label: element,
+                        i: (valMatch.found ? valMatch.index : srcMatch.index)
                     });
                 }
             })
@@ -14252,7 +14252,7 @@ RED.stack = (function() {
                 this.options.types = this.options.types||Object.keys(allOptions);
             }
 
-            this.selectTrigger = $('<button class="red-ui-typedInput-type-select" tabindex="0"></button>').prependTo(this.uiSelect);
+            this.selectTrigger = $('<button type="button" class="red-ui-typedInput-type-select" tabindex="0"></button>').prependTo(this.uiSelect);
             $('<i class="red-ui-typedInput-icon fa fa-caret-down"></i>').toggle(this.options.types.length > 1).appendTo(this.selectTrigger);
 
             this.selectLabel = $('<span class="red-ui-typedInput-type-label"></span>').appendTo(this.selectTrigger);
@@ -14321,7 +14321,7 @@ RED.stack = (function() {
             })
 
             // explicitly set optionSelectTrigger display to inline-block otherwise jQ sets it to 'inline'
-            this.optionSelectTrigger = $('<button tabindex="0" class="red-ui-typedInput-option-trigger" style="display:inline-block"><span class="red-ui-typedInput-option-caret"><i class="red-ui-typedInput-icon fa fa-caret-down"></i></span></button>').appendTo(this.uiSelect);
+            this.optionSelectTrigger = $('<button type="button" tabindex="0" class="red-ui-typedInput-option-trigger" style="display:inline-block"><span class="red-ui-typedInput-option-caret"><i class="red-ui-typedInput-icon fa fa-caret-down"></i></span></button>').appendTo(this.uiSelect);
             this.optionSelectLabel = $('<span class="red-ui-typedInput-option-label"></span>').prependTo(this.optionSelectTrigger);
             // RED.popover.tooltip(this.optionSelectLabel,function() {
             //     return that.optionValue;
@@ -14342,7 +14342,7 @@ RED.stack = (function() {
                 that.uiSelect.addClass('red-ui-typedInput-focus');
             });
 
-            this.optionExpandButton = $('<button tabindex="0" class="red-ui-typedInput-option-expand" style="display:inline-block"></button>').appendTo(this.uiSelect);
+            this.optionExpandButton = $('<button type="button" tabindex="0" class="red-ui-typedInput-option-expand" style="display:inline-block"></button>').appendTo(this.uiSelect);
             this.optionExpandButtonIcon = $('<i class="red-ui-typedInput-icon fa fa-ellipsis-h"></i>').appendTo(this.optionExpandButton);
 
             this.type(this.typeField.val() || this.options.default||this.typeList[0].value);
@@ -20761,12 +20761,15 @@ RED.view = (function() {
             RED.view.redraw();
         }
 
+        // `point` is the place in the workspace the mouse has clicked.
+        //  This takes into account scrolling and scaling of the workspace.
         var ox = point[0];
         var oy = point[1];
 
+        // Need to map that to browser location to position the pop-up
         const offset = $("#red-ui-workspace-chart").offset()
-        var clientX = ox + offset.left - $("#red-ui-workspace-chart").scrollLeft()
-        var clientY = oy + offset.top - $("#red-ui-workspace-chart").scrollTop()
+        var clientX = (ox * scaleFactor) + offset.left - $("#red-ui-workspace-chart").scrollLeft()
+        var clientY = (oy * scaleFactor) + offset.top - $("#red-ui-workspace-chart").scrollTop()
 
         if (RED.settings.get("editor").view['view-snap-grid']) {
             // eventLayer.append("circle").attr("cx",point[0]).attr("cy",point[1]).attr("r","2").attr('fill','red')
@@ -24596,7 +24599,7 @@ RED.view = (function() {
                         if (d._def.button) {
                             var buttonEnabled = isButtonEnabled(d);
                             this.__buttonGroup__.classList.toggle("red-ui-flow-node-button-disabled", !buttonEnabled);
-                            if (RED.runtime && Object.hasOwn(RED.runtime,'started')) {
+                            if (RED.runtime && RED.runtime.started !== undefined) {
                                 this.__buttonGroup__.classList.toggle("red-ui-flow-node-button-stopped", !RED.runtime.started);
                             }
 
@@ -33369,6 +33372,10 @@ RED.editor = (function() {
                 if (editing_node) {
                     RED.sidebar.info.refresh(editing_node);
                     RED.sidebar.help.show(editing_node.type, false);
+                    //ensure focused element is NOT body (for keyboard scope to operate correctly)
+                    if (document.activeElement.tagName === 'BODY') {
+                        $('#red-ui-editor-stack').trigger('focus')
+                    }
                 }
             }
         }
@@ -39099,7 +39106,7 @@ RED.editor.codeEditor.monaco = (function() {
 
         
         if(!options.stateId && options.stateId !== false) {
-            options.stateId = RED.editor.generateViewStateId("monaco", options, (options.mode || options.title).split("/").pop());
+            options.stateId = RED.editor.generateViewStateId("monaco", options, (options.mode || options.title || "").split("/").pop());
         }
         var el = options.element || $("#"+options.id)[0];
         var toolbarRow = $("<div>").appendTo(el);
@@ -42951,7 +42958,7 @@ RED.search = (function() {
                         }
                         if (flags.hasOwnProperty("unused")) {
                             var isUnused = (node.node.type === 'subflow' && node.node.instances.length === 0) ||
-                                           (isConfigNode && node.node.users.length === 0)
+                                           (isConfigNode && node.node.users.length === 0 && node.node._def.hasUsers !== false)
                             if (flags.unused !== isUnused) {
                                 continue;
                             }
@@ -43302,7 +43309,7 @@ RED.search = (function() {
                 $(previousActiveElement).trigger("focus");
             }
             previousActiveElement = null;
-        } 
+        }
         if(!keepSearchToolbar) {
             clearActiveSearch();
         }
@@ -43394,7 +43401,7 @@ RED.search = (function() {
         $("#red-ui-sidebar-shade").on('mousedown',hide);
 
         $("#red-ui-view-searchtools-close").on("click", function close() {
-            clearActiveSearch();            
+            clearActiveSearch();
             updateSearchToolbar();
         });
         $("#red-ui-view-searchtools-close").trigger("click");
@@ -43474,14 +43481,10 @@ RED.search = (function() {
         const canRemoveFromGroup = hasSelection && !!selection.nodes[0].g
         const offset = $("#red-ui-workspace-chart").offset()
 
-        let addX = options.x - offset.left + $("#red-ui-workspace-chart").scrollLeft()
-        let addY = options.y - offset.top + $("#red-ui-workspace-chart").scrollTop()
-
-        if (RED.view.snapGrid) {
-            const gridSize = RED.view.gridSize()
-            addX = gridSize * Math.floor(addX / gridSize)
-            addY = gridSize * Math.floor(addY / gridSize)
-        }
+        // addX/addY must be the position in the workspace accounting for both scroll and scale
+        // The +5 is because we display the contextMenu -5,-5 to actual click position
+        let addX = (options.x + 5 - offset.left + $("#red-ui-workspace-chart").scrollLeft()) / RED.view.scale()
+        let addY = (options.y + 5 - offset.top + $("#red-ui-workspace-chart").scrollTop()) / RED.view.scale()
 
         const menuItems = [
             { onselect: 'core:show-action-list', onpostselect: function () { } },
@@ -43497,6 +43500,10 @@ RED.search = (function() {
                                 splice: isSingleLink ? selection.links[0] : undefined,
                                 // spliceMultiple: isMultipleLinks
                             })
+                        },
+                        onpostselect: function() {
+                            // ensure quick add dialog search input has focus
+                            $('#red-ui-type-search-input').trigger('focus')
                         }
                     },
                     (hasLinks) ? { // has least 1 wire selected
@@ -43574,7 +43581,7 @@ RED.search = (function() {
             ($(window).width() -MENU_WIDTH)) {
             direction = "left";
         }
-        
+
         menu = RED.menu.init({
             direction: direction,
             onpreselect: function() {
@@ -44134,8 +44141,8 @@ RED.actionList = (function() {
         moveCallback = opts.move;
         RED.events.emit("type-search:open");
         //shade.show();
-        if ($("#red-ui-main-container").height() - opts.y - 150 < 0) {
-            opts.y = opts.y - 235;
+        if ($("#red-ui-main-container").height() - opts.y - 195 < 0) {
+            opts.y = opts.y - 275;
         }
         dialog.css({left:opts.x+"px",top:opts.y+"px"}).show();
         searchResultsDiv.slideDown(300);