UX: Do not close login modal and search menu on outside mouse up event. (#7366)

app/assets/javascripts/discourse/components/d-modal.js.es6

@@ -73,7 +73,7 @@ export default Ember.Component.extend({
     $("html").off("keydown.discourse-modal");
   },
 
-  click(e) {
+  mouseDown(e) {
     if (!this.get("dismissable")) {
       return;
     }

app/assets/javascripts/discourse/widgets/hooks.js.es6

@@ -2,6 +2,8 @@
 
 const CLICK_ATTRIBUTE_NAME = "_discourse_click_widget";
 const CLICK_OUTSIDE_ATTRIBUTE_NAME = "_discourse_click_outside_widget";
+const MOUSE_DOWN_OUTSIDE_ATTRIBUTE_NAME =
+  "_discourse_mouse_down_outside_widget";
 const KEY_UP_ATTRIBUTE_NAME = "_discourse_key_up_widget";
 const KEY_DOWN_ATTRIBUTE_NAME = "_discourse_key_down_widget";
 const DRAG_ATTRIBUTE_NAME = "_discourse_drag_widget";
@@ -33,6 +35,10 @@ export const WidgetClickOutsideHook = buildHook(
   CLICK_OUTSIDE_ATTRIBUTE_NAME,
   "data-click-outside"
 );
+export const WidgetMouseDownOutsideHook = buildHook(
+  MOUSE_DOWN_OUTSIDE_ATTRIBUTE_NAME,
+  "data-mouse-down-outside"
+);
 export const WidgetKeyUpHook = buildHook(KEY_UP_ATTRIBUTE_NAME);
 export const WidgetKeyDownHook = buildHook(KEY_DOWN_ATTRIBUTE_NAME);
 export const WidgetDragHook = buildHook(DRAG_ATTRIBUTE_NAME);
@@ -136,6 +142,20 @@ WidgetClickHook.setupDocumentCallback = function() {
     });
   });
 
+  $(document).on("mousedown.discourse-widget", e => {
+    let node = e.target;
+    const $outside = $("[data-mouse-down-outside]");
+    $outside.each((i, outNode) => {
+      if (outNode.contains(node)) {
+        return;
+      }
+      const widget2 = outNode[MOUSE_DOWN_OUTSIDE_ATTRIBUTE_NAME];
+      if (widget2) {
+        widget2.mouseDownOutside(e);
+      }
+    });
+  });
+
   $(document).on("keyup.discourse-widget", e => {
     nodeCallback(e.target, KEY_UP_ATTRIBUTE_NAME, w => w.keyUp(e));
   });

app/assets/javascripts/discourse/widgets/search-menu.js.es6

@@ -199,7 +199,7 @@ export default createWidget("search-menu", {
     });
   },
 
-  clickOutside() {
+  mouseDownOutside() {
     this.sendWidgetAction("toggleSearchMenu");
   },
 

app/assets/javascripts/discourse/widgets/widget.js.es6

@@ -3,6 +3,7 @@ import {
   WidgetClickOutsideHook,
   WidgetKeyUpHook,
   WidgetKeyDownHook,
+  WidgetMouseDownOutsideHook,
   WidgetDragHook
 } from "discourse/widgets/hooks";
 import { h } from "virtual-dom";
@@ -84,6 +85,13 @@ function drawWidget(builder, attrs, state) {
   if (this.click) {
     properties["widget-click"] = new WidgetClickHook(this);
   }
+
+  if (this.mouseDownOutside) {
+    properties["widget-mouse-down-outside"] = new WidgetMouseDownOutsideHook(
+      this
+    );
+  }
+
   if (this.drag) {
     properties["widget-drag"] = new WidgetDragHook(this);
   }