Add support for spaceSelectsMatch. Closes #170.

zurb · Jan 4, 2019 · 994fbf2 · 994fbf2
1 parent 9181229
commit 994fbf2
Show file tree

Hide file tree

Showing 5 changed files with 41 additions and 18 deletions.
diff --git a/README.md b/README.md
@@ -181,6 +181,9 @@ Collection object shown with defaults:
   // specify whether the menu should be positioned.  Set to false and use in conjuction with menuContainer to create an inline menu
   // (defaults to true)
   positionMenu: true,
+
+  // when the spacebar is hit, select the current match
+  spaceSelectsMatch: false
 }
 ```
 
@@ -190,7 +193,7 @@ The `lookup` column can also be passed a function to construct a string to query
 
 ```js
 {
-  lookup: function (person) {
+  lookup: function (person, mentionText) {
     return person.name + person.email;
   }
 }

diff --git a/dist/tribute.js b/dist/tribute.js
diff --git a/example/index.html b/example/index.html
@@ -77,7 +77,7 @@ <h5>Tribute on traditional form elements!</h5>
 
     </div>
 
-    <script src="../dist/tribute.min.js?33289"></script>
+    <script src="../dist/tribute.js"></script>
     <script>
       // example of alternative callback
       var tribute = new Tribute({
@@ -93,7 +93,8 @@ <h5>Tribute on traditional form elements!</h5>
           }
 
           return '@' + item.original.value;
-        }
+        },
+        spaceSelectsMatch: true
       });
 
       tribute.attach(document.getElementById('test'));

diff --git a/src/Tribute.js b/src/Tribute.js
@@ -21,6 +21,7 @@ class Tribute {
         allowSpaces = false,
         replaceTextSuffix = null,
         positionMenu = true,
+        spaceSelectsMatch = false,
     }) {
 
         this.menuSelected = 0
@@ -32,6 +33,7 @@ class Tribute {
         this.replaceTextSuffix = replaceTextSuffix
         this.positionMenu = positionMenu
         this.hasTrailingSpace = false;
+        this.spaceSelectsMatch = spaceSelectsMatch;
 
         if (values) {
             this.collection = [{
@@ -68,7 +70,7 @@ class Tribute {
                 // array of objects or a function returning an array of objects
                 values: values,
 
-                requireLeadingSpace: requireLeadingSpace,
+                requireLeadingSpace: requireLeadingSpace
             }]
         }
         else if (collection) {

diff --git a/src/TributeEvents.js b/src/TributeEvents.js
@@ -17,6 +17,9 @@ class TributeEvents {
         }, {
             key: 27,
             value: 'ESCAPE'
+        }, {
+            key: 32,
+            value: 'SPACE'
         }, {
             key: 38,
             value: 'UP'
@@ -206,12 +209,16 @@ class TributeEvents {
                 this.callbacks().enter(e, el)
             },
             space: (e, el) => {
-                if (this.tribute.isActive && !this.tribute.allowSpaces) {
-                    e.stopPropagation();
-                    setTimeout(() => {
-                        this.tribute.hideMenu();
-                        this.tribute.isActive = false;
-                    }, 0);
+                if (this.tribute.isActive) {
+                    if (this.tribute.spaceSelectsMatch) {
+                        this.callbacks().enter(e, el)
+                    } else if (!this.tribute.allowSpaces) {
+                        e.stopPropagation();
+                        setTimeout(() => {
+                            this.tribute.hideMenu();
+                            this.tribute.isActive = false;
+                        }, 0);
+                    }
                 }
             },
             up: (e, el) => {