vanilla-js-dropdown - npm Package Compare versions

Comparing version 2.1.0 to 2.1.2

CHANGELOG.md

 # Change Log
 ---
 
+## [2.1.2] - 2019-03-11
 
+### Fixed
+1. Original selected option shown selected in dropdown on page refresh or navigating to page
+
+
+## [2.1.1] - 2018-04-28
+
+### Fixed
+1. Invalid _id_ attribute assigned when a DOM element passed
+
+
 ## [2.1.0] - 2017-10-21
@@ -6,0 +17,0 @@

index.js

@@ -1,1 +0,1 @@
-module.exports=function(e){function t(){u.classList.toggle(o)}function n(){u.classList.remove(o)}var a="string"==typeof e.elem?document.getElementById(e.elem):e.elem,l="js-Dropdown-title",s="is-selected",o="is-open",i=a.querySelectorAll("option"),r=i.length,c=document.createElement("div");c.className="js-Dropdown",c.id="custom-"+e.elem;var d=document.createElement("button");d.className=l,d.textContent=i[0].textContent;var u=document.createElement("ul");u.className="js-Dropdown-list";for(var m=0;m<r;m++){var p=document.createElement("li");p.innerText=i[m].textContent,p.setAttribute("data-value",i[m].value),p.setAttribute("data-index",m),null!==i[m].getAttribute("selected")&&(p.classList.add(s),d.textContent=i[m].textContent),u.appendChild(p)}return c.appendChild(d),c.appendChild(u),c.addEventListener("click",function(e){e.preventDefault();var o=e.target;if(o.className===l&&t(),"LI"===o.tagName){c.querySelector("."+l).innerText=o.innerText,a.options.selectedIndex=o.getAttribute("data-index");var i=new Event("change");a.dispatchEvent(i);for(var d=0;d<r;d++)u.querySelectorAll("li")[d].classList.remove(s);o.classList.add(s),n()}}),a.parentNode.insertBefore(c,a),a.style.display="none",document.addEventListener("click",function(e){c.contains(e.target)||n()}),{toggle:t,close:n,open:function(){u.classList.add(o)}}};
+module.exports=function(e){var s="string"==typeof e.elem?document.getElementById(e.elem):e.elem,o="js-Dropdown-title",i="is-selected",t="is-open",n=s.options,l=n.length,d=document.createElement("div");d.className="js-Dropdown",s.id&&(d.id="custom-"+s.id);var a=document.createElement("button");a.className=o,a.textContent=n[0].textContent;var c=document.createElement("ul");c.className="js-Dropdown-list";for(var r=0;r<l;r++){var u=document.createElement("li");u.innerText=n[r].textContent,u.setAttribute("data-value",n[r].value),u.setAttribute("data-index",r),s.selectedIndex===r&&(u.classList.add(i),a.textContent=n[r].textContent),c.appendChild(u)}function m(){c.classList.toggle(t)}function v(){c.classList.remove(t)}return d.appendChild(a),d.appendChild(c),d.addEventListener("click",function(e){e.preventDefault();var t=e.target;t.className===o&&m();if("LI"===t.tagName){d.querySelector("."+o).innerText=t.innerText,s.options.selectedIndex=t.getAttribute("data-index");var n=new CustomEvent("change");s.dispatchEvent(n);for(var a=0;a<l;a++)c.querySelectorAll("li")[a].classList.remove(i);t.classList.add(i),v()}}),s.parentNode.insertBefore(d,s),s.style.display="none",document.addEventListener("click",function(e){d.contains(e.target)||v()}),{toggle:m,close:v,open:function(){c.classList.add(t)}}};

package.json

 {
   "name": "vanilla-js-dropdown",
-  "version": "2.1.0",
+  "version": "2.1.2",
   "description": "Vanilla JavaScript Dropdown - a tiny (~600 bytes gzipped) select tag replacement.",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -0,0 +0,0 @@ # Vanilla JavaScript Dropdown - replacement for `<select>`

src/vanilla-js-dropdown.js

 /**
 * @fileOverview
 * @author Zoltan Toth
-* @version 2.1.0
+* @version 2.1.2
 */
@@ -14,4 +14,5 @@
 */
-module.exports = function(options) {
-    var elem          = typeof options.elem === 'string' ? document.getElementById(options.elem) : options.elem,
+var CustomSelect = function(options) {
+    var elem          = typeof options.elem === 'string' ?
+                          document.getElementById(options.elem) : options.elem,
         mainClass     = 'js-Dropdown',
@@ -22,3 +23,3 @@ titleClass    = 'js-Dropdown-title',
         openClass     = 'is-open',
-        selectOptions = elem.querySelectorAll('option'),
+        selectOptions = elem.options,
         optionsLength = selectOptions.length;
@@ -30,4 +31,7 @@
     selectContainer.className = mainClass;
-    selectContainer.id = 'custom-' + options.elem;
 
+    if (elem.id) {
+      selectContainer.id = 'custom-' + elem.id;
+    }
+
     // creating the always visible main button
@@ -50,3 +54,3 @@ var button = document.createElement('button');
 
-        if (selectOptions[i].getAttribute('selected') !== null) {
+        if (elem.selectedIndex === i) {
             li.classList.add(selectedClass);
@@ -90,3 +94,3 @@ button.textContent = selectOptions[i].textContent;
             toggle();
-        } 
+        }
 
@@ -98,3 +102,3 @@ if (t.tagName === 'LI') {
             //trigger 'change' event
-            var evt = new Event('change');
+            var evt = new CustomEvent('change');
             elem.dispatchEvent(evt);
@@ -107,3 +111,3 @@
             t.classList.add(selectedClass);
-            
+
             close();
@@ -145,2 +149,2 @@ }
     };
-};
+};

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

63748

increased by371.16%

Number of package files

17

increased by112.5%

Lines of code

594

increased by241.38%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes