@github/auto-complete-element - npm Package Compare versions

Comparing version 0.3.0 to 0.4.0

dist/index.esm.js

@@ -208,12 +208,19 @@ function debounce(callback, wait) {
         case 'ArrowDown':
-          this.select(this.sibling(true));
-          event.preventDefault();
+          {
+            var item = this.sibling(true);
+            if (item) this.select(item);
+            event.preventDefault();
+          }
           break;
         case 'ArrowUp':
-          this.select(this.sibling(false));
-          event.preventDefault();
+          {
+            var _item = this.sibling(false);
+            if (_item) this.select(_item);
+            event.preventDefault();
+          }
           break;
         case 'n':
           if (ctrlBindings && event.ctrlKey) {
-            this.select(this.sibling(true));
+            var _item2 = this.sibling(true);
+            if (_item2) this.select(_item2);
             event.preventDefault();
@@ -224,3 +231,4 @@ }
           if (ctrlBindings && event.ctrlKey) {
-            this.select(this.sibling(false));
+            var _item3 = this.sibling(false);
+            if (_item3) this.select(_item3);
             event.preventDefault();
@@ -333,3 +341,3 @@ }
 
-      var url = new URL(src, window.location.origin);
+      var url = new URL(src, window.location.href);
       var params = new URLSearchParams(url.search.slice(1));
@@ -343,3 +351,3 @@ params.append('q', query);
         _this2.identifyOptions();
-        var hasResults = !!_this2.results.querySelector('[data-autocomplete-value]');
+        var hasResults = !!_this2.results.querySelector('[role="option"]');
         _this2.container.open = hasResults;
@@ -346,0 +354,0 @@ _this2.container.dispatchEvent(new CustomEvent('load'));

dist/index.umd.js

@@ -214,12 +214,19 @@ (function (global, factory) {
           case 'ArrowDown':
-            this.select(this.sibling(true));
-            event.preventDefault();
+            {
+              var item = this.sibling(true);
+              if (item) this.select(item);
+              event.preventDefault();
+            }
             break;
           case 'ArrowUp':
-            this.select(this.sibling(false));
-            event.preventDefault();
+            {
+              var _item = this.sibling(false);
+              if (_item) this.select(_item);
+              event.preventDefault();
+            }
             break;
           case 'n':
             if (ctrlBindings && event.ctrlKey) {
-              this.select(this.sibling(true));
+              var _item2 = this.sibling(true);
+              if (_item2) this.select(_item2);
               event.preventDefault();
@@ -230,3 +237,4 @@ }
             if (ctrlBindings && event.ctrlKey) {
-              this.select(this.sibling(false));
+              var _item3 = this.sibling(false);
+              if (_item3) this.select(_item3);
               event.preventDefault();
@@ -339,3 +347,3 @@ }
 
-        var url = new URL(src, window.location.origin);
+        var url = new URL(src, window.location.href);
         var params = new URLSearchParams(url.search.slice(1));
@@ -349,3 +357,3 @@ params.append('q', query);
           _this2.identifyOptions();
-          var hasResults = !!_this2.results.querySelector('[data-autocomplete-value]');
+          var hasResults = !!_this2.results.querySelector('[role="option"]');
           _this2.container.open = hasResults;
@@ -352,0 +360,0 @@ _this2.container.dispatchEvent(new CustomEvent('load'));

package.json

 {
   "name": "@github/auto-complete-element",
-  "version": "0.3.0",
+  "version": "0.4.0",
   "description": "Auto-complete input values from server results",
@@ -30,6 +30,6 @@ "repository": "github/auto-complete-element",
     "chai": "^4.1.2",
-    "eslint": "^4.19.0",
-    "eslint-plugin-github": "^0.24.0",
-    "flow-bin": "^0.69.0",
-    "karma": "^2.0.0",
+    "eslint": "^5.0.1",
+    "eslint-plugin-github": "1.0.0",
+    "flow-bin": "^0.75.0",
+    "karma": "^2.0.4",
     "karma-chai": "^0.1.0",
@@ -39,6 +39,6 @@ "karma-chrome-launcher": "^2.2.0",
     "karma-mocha-reporter": "^2.2.5",
-    "mocha": "^5.0.5",
-    "rollup": "^0.57.1",
-    "rollup-plugin-babel": "^3.0.3"
+    "mocha": "^5.2.0",
+    "rollup": "^0.62.0",
+    "rollup-plugin-babel": "^3.0.5"
   }
 }

README.md

@@ -19,3 +19,3 @@ # <auto-complete> element
 <auto-complete src="/users/search" aria-owns="users-popup">
-  <input type="text" data-autocomplete-autofocus>
+  <input type="text">
   <ul id="users-popup"></ul>
@@ -28,8 +28,15 @@ </auto-complete>
 ```html
-<li role="option" data-autocomplete-value="@hubot">Hubot</li>
-<li role="option" data-autocomplete-value="@bender">Bender</li>
-<li role="option" data-autocomplete-value="@bb-8">BB-8</li>
-<li role="option" data-autocomplete-value="@r2d2" aria-disabled="true">R2-D2 (powered down)</li>
+<li role="option">Hubot</li>
+<li role="option">Bender</li>
+<li role="option">BB-8</li>
+<li role="option" aria-disabled="true">R2-D2 (powered down)</li>
 ```
 
+The `data-autocomplete-value` attribute can be used to define the value for an
+item whose display text needs to be different:
+
+```html
+<li role="option" data-autocomplete-value="bb8">BB-8 (astromech)</li>
+```
+
 ## Browser support
@@ -36,0 +43,0 @@

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Fixed alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

36442

increased by1.37%

Lines of code

922

increased by1.77%

Number of lines in readme file

58

increased by13.73%

No dependency changes