Initial version of blurring behavior

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "angular-ui-mention",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "homepage": "https://github.com/angular-ui/ui-mention",
   "authors": [
     "AngularUI Team"

dist/mention.js

@@ -2,7 +2,7 @@
 
 var _slicedToArray = (function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i['return']) _i['return'](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError('Invalid attempt to destructure non-iterable instance'); } }; })();
 
-angular.module('ui.mention', []).directive('uiMention', function ($q, $timeout) {
+angular.module('ui.mention', []).directive('uiMention', function ($q, $timeout, $document) {
   return {
     require: ['ngModel', 'uiMention'],
     controllerAs: '$mention',
@@ -173,8 +173,6 @@ angular.module('ui.mention', []).directive('uiMention', function ($q, $timeout)
       this.select = function () {
         var choice = arguments.length <= 0 || arguments[0] === undefined ? this.activeChoice : arguments[0];
 
-        if (!this.searching) return;
-
         // Add the mention
         this.mentions.push(choice);
 
@@ -310,6 +308,25 @@ angular.module('ui.mention', []).directive('uiMention', function ($q, $timeout)
         $scope.$apply();
       });
 
+      this.onMouseup = (function (event) {
+        var _this4 = this;
+
+        if (event.target == $element[0]) return;
+
+        $document.off('mouseup', this.onMouseup);
+
+        if (!this.searching) return;
+
+        // Let ngClick fire first
+        $scope.$evalAsync(function () {
+          _this4.cancel();
+        });
+      }).bind(this);
+
+      $element.on('focus', function (event) {
+        $document.on('mouseup', _this2.onMouseup);
+      });
+
       // Autogrow is mandatory beacuse the textarea scrolls away from highlights
       $element.on('input', this.autogrow);
       // Initialize autogrow height

package.json

@@ -1,6 +1,6 @@
 {
   "name": "angular-ui-mention",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "description": "Facebook-like @mentions for text inputs built around composability",
   "main": "src/mention.js",
   "scripts": {

src/mention.es6.js

@@ -1,5 +1,5 @@
 angular.module('ui.mention', [])
-.directive('uiMention', function($q, $timeout){
+.directive('uiMention', function($q, $timeout, $document){
   return {
     require: ['ngModel', 'uiMention'],
     controllerAs: '$mention',
@@ -153,9 +153,6 @@ angular.module('ui.mention', [])
        * @param  {mixed|object} [choice] The selected choice (default: activeChoice)
        */
       this.select = function(choice = this.activeChoice) {
-        if (!this.searching)
-          return;
-
         // Add the mention
         this.mentions.push(choice);
 
@@ -291,6 +288,27 @@ angular.module('ui.mention', [])
         $scope.$apply();
       });
 
+
+
+      this.onMouseup = (function(event) {
+        if (event.target == $element[0])
+          return
+
+        $document.off('mouseup', this.onMouseup);
+
+        if (!this.searching)
+          return;
+
+        // Let ngClick fire first
+        $scope.$evalAsync( () => {
+          this.cancel();
+        });
+      }).bind(this);
+
+      $element.on('focus', event => {
+        $document.on('mouseup', this.onMouseup);
+      });
+
       // Autogrow is mandatory beacuse the textarea scrolls away from highlights
       $element.on('input', this.autogrow);
       // Initialize autogrow height