@dotburo/select-input
Advanced tools
Comparing version 1.0.0 to 1.1.1
@@ -1,2 +0,2 @@ | ||
| const t=document,e={items:[],current:null,parent:null,maxHeight:0,proposal:"Add {X} to the list?",sort:!0,order:"desc",removalIcon:"×"};export default class{constructor(t,s={}){this.options=Object.assign({},e,s),this.dom={el:this._setElement(t)},this.options.items=this._convertItems(s.items),this.current=s.current?this._convertItem(s.current):{},this.__found=null,this.options.sort&&this._sortItems(),this._renderInit(),this._events=[],this._bindEvents()}_bindEvents(){let e=t=>{("Escape"===t.key||27===t.keyCode||t.target.contains(this.dom.el))&&this.toggle(!1)};this.on("input",this._search),this.on("click",this._handleClick),this.on("keyup",this._handleKey),this.on("focusin",()=>this._renderListItems().toggle(!0),this.dom.input),this.on("keyup",e,t),this.on("click",e,t)}on(t,e,s=null){e=e.bind(this),(s||this.dom.el).addEventListener(t,e,!1),this._events.push({name:t,fn:e,el:s})}toggle(t=!1){this.dom.el.firstElementChild.classList[t?"remove":"add"]("si-hide"),t||this.dom.input.blur()}getElement(){return this.dom.el}getItems(){return this.options.items}getCurrent(){let t=Object.assign({},this.current);return delete t._lc,t}findItem(t){return t=t.nodeName?t.dataset.value:t,this.options.items.find(e=>e.value===t)}remove(){this._events=this._events.filter(t=>(t.el||this.dom.el).removeEventListener(t.name,t.fn,!1)),this.dom.el.parentNode.removeChild(this.dom.el),this.dom=null}_setCurrent(t,e=null){return this.current=t,this.dom.input.value=t.value.toString(),this._setSelected(t,e),this}_clearCurrent(){this.current={},this.dom.input.value="",this._clearSelected()}_trigger(e,s=null){let i;"function"==typeof CustomEvent?i=new CustomEvent(e,{detail:s||this.current}):(i=t.createEvent("Event")).initEvent(e,!0,!0),this.dom.el.dispatchEvent(i)}_setElement(e){if(!e&&!e.nodeType&&"string"!=typeof e)throw new Error("Wrong element type provided!");return e.nodeType?e:(this.options.parent||t).querySelector(e)}_setSelected(t,e=null){this._clearSelected(),(e=e||this.dom.list.querySelector(`li[data-value="${t.value}"]`))&&e.classList.add("si-current")}_clearSelected(){let t=this.dom.list.querySelector(".si-current");t&&t.classList.remove("si-current")}_convertItems(t=[]){return t.map(t=>this._convertItem(t))}_convertItem(t){return(t="object"!=typeof t?{value:t}:t)._lc=t.value.toString().toLowerCase(),t}_renderInit(){let e=t.createElement("div");return e.className="si-wrap si-hide",this.dom.input=e.appendChild(this._renderInput()),this.dom.list=e.appendChild(this._renderList()).firstChild,this.current.value&&(this.dom.input.value=this.current.value),this.dom.el.appendChild(e)}_renderInput(){let e=t.createElement("input");return e.type="text",e.autocomplete="false",e.spellcheck=!1,e}_renderList(){let e=t.createElement("div"),s=t.createElement("ul"),i=this.options.maxHeight;return e.className="si-list",i&&(e.style.maxHeight=i+"px"),e.appendChild(s),e}_createListItems(t=[]){let e="",s=this.current.value,i="",r=this._createRemovalButton();return t.forEach(t=>{i=s&&t.value===s?" si-current":"",e+=`<li class="si-item${i}" data-value="${t.value}">${t.value}${r}</li>`}),e}_renderListItems(t=""){return this.dom.list.innerHTML=t||this._createListItems(this.options.items),this}_createRemovalButton(){return`<button type="button" class="si-removal">${this.options.removalIcon}</button>`}_search(t){let e=null,s=t.target.value,i=s.toLowerCase(),r=this.options.items.filter(t=>-1!==t._lc.indexOf(i)),n=this._createListItems(r),l=r[0],o=r.length;1===o&&l&&(e=l),(!l||o&&i&&i!==l._lc)&&(n+=this._proposeItem(s)),this.__found=e,this._renderListItems(n)}_proposeItem(t){return`<li class="si-item si-proposal" data-term="${t}">${this.options.proposal.replace("{X}",`<span>${t}</span>`)}</li>`}_handleClick(t){let e=t.target;return e.classList.contains("si-proposal")?(this._setCurrent(this._createItem(e),e).toggle(),void this._trigger("created")):e.classList.contains("si-item")?(this._setCurrent(this.findItem(e),e).toggle(),void this._trigger("selected")):void(e.classList.contains("si-removal")&&this._trigger("removed",this._sliceItem(e.parentNode)))}_handleKey(t){let e=t.target.value,s="selected";!e||13!==t.keyCode&&13!==t.which&&"Enter"!==t.key||(this.__found?this._setCurrent(this.__found):(this._setCurrent(this._createItem(e)),s="created"),this.toggle(),this._trigger(s))}_createItem(t){let e=this._convertItem(t.nodeName?t.dataset.term:t);return this.options.items.push(e),this.options.sort&&this._sortItems(),e}_sortItems(){let t="desc"===this.options.order?1:-1;this.options.items.sort((e,s)=>e.value<s.value?-t:e.value>s.value?t:0)}_sliceItem(t){let e,s=this.options.items,i=t.dataset.value.toLowerCase(),r=this.current;return this.dom.list.removeChild(t),e=s.splice(s.findIndex(t=>t._lc===i),1).shift(),r&&e._lc===r._lc&&this._clearCurrent(),e}} | ||
| const t=document;class e{constructor(t,e={},s={}){this.options=Object.assign({},s,e),this._events=[],this.dom={el:this._setElement(t)}}on(t,e,s=null){return(s||this.dom.el).addEventListener(t,e=e.bind(this),!0),this._events.push({name:t,fn:e,el:s}),this}getElement(){return this.dom.el}remove(){this._events=this._events.filter(t=>(t.el||this.dom.el).removeEventListener(t.name,t.fn,!0)),this.dom.el.parentNode.removeChild(this.dom.el),this.dom=this.options=null}_setElement(e){if(!e&&!e.nodeType&&"string"!=typeof e)throw new Error("Wrong element type provided!");return e.nodeType?e:(this.options.parent||t).querySelector(e)}_trigger(e,s=null){let i;"function"==typeof CustomEvent?i=new CustomEvent(e,{detail:s}):(i=t.createEvent("Event")).initEvent(e,!0,!0),this.dom.el.dispatchEvent(i)}}var s={items:[],current:null,parent:null,maxHeight:0,proposal:"Add {X} to the list?",sort:!0,order:"desc",removalIcon:"×",placeHolder:"Type to search",onDelete:null,onCreate:null};const i=document;export default class extends e{constructor(t,e={}){super(t,e,s),this.options.items=this._convertItems(e.items),this.current=e.current?this._convertItem(e.current):{},this.__found=null,this.options.sort&&this._sortItems(),this._renderInit(),this._bindEvents()}_bindEvents(){let t=t=>{"Escape"!==t.key&&27!==t.keyCode&&this.dom.el.contains(t.target)||this.toggle(!1)};this.on("input",this._search),this.on("click",this._handleClick),this.on("keyup",this._handleKey),this.on("focusin",()=>this._renderListItems().toggle(!0),this.dom.input),this.on("keyup",t,i),this.on("click",t,i)}onDelete(t){return this.options.onDelete=t,this}onCreate(t){return this.options.onCreate=t,this}toggle(t=!1){return this.dom.el.firstElementChild.classList[t?"remove":"add"]("si-hide"),t||this.dom.input.blur(),this}getItems(){return this.options.items}getCurrent(){let t=Object.assign({},this.current);return delete t._lc,t}clearCurrent(){this.current={},this.dom.input.value="",this._clearSelected()}findItem(t){return t=t.nodeName?t.dataset.value:t,this.options.items.find(e=>e.value===t)}_setCurrent(t,e=null){return this.current=t,this.dom.input.value=t.value.toString(),this._setSelected(t,e),this}_setSelected(t,e=null){this._clearSelected(),(e=e||this.dom.list.querySelector(`li[data-value="${t.value}"]`))&&e.classList.add("si-current")}_clearSelected(){let t=this.dom.list.querySelector(".si-current");t&&t.classList.remove("si-current")}_convertItems(t=[]){return t.map(t=>this._convertItem(t))}_convertItem(t){return(t="object"!=typeof t?{value:t}:t)._lc=t.value.toString().toLowerCase(),t}_renderInit(){let t=i.createElement("div");return t.className="si-wrap si-hide",this.dom.input=t.appendChild(this._renderInput()).firstChild,this.dom.list=t.appendChild(this._renderList()).firstChild,this.current.value&&(this.dom.input.value=this.current.value),this.dom.el.appendChild(t)}_renderInput(){let t=i.createElement("div"),e=i.createElement("input");return t.className="si-input",e.type="text",e.autocomplete="false",e.spellcheck=!1,e.placeholder=this.options.placeHolder,t.appendChild(e),t}_renderList(){let t=i.createElement("div"),e=i.createElement("ul"),s=this.options.maxHeight;return t.className="si-list",s&&(t.style.maxHeight=s+"px"),t.appendChild(e),t}_createListItems(t=[]){let e="",s=this.current.value,i="",r=this._createRemovalButton();return t.forEach(t=>{i=s&&t.value===s?" si-current":"",e+=`<li class="si-item${i}" data-value="${t.value}">${t.value}${r}</li>`}),e}_renderListItems(t=""){return this.dom.list.innerHTML=t||this._createListItems(this.options.items),this}_createRemovalButton(){return`<button type="button" class="si-removal">${this.options.removalIcon}</button>`}_search(t){let e=null,s=t.target.value,i=s.toLowerCase(),r=this.options.items.filter(t=>-1!==t._lc.indexOf(i)),n=this._createListItems(r),l=r[0],o=r.length;1===o&&l&&(e=l),(!l||o&&i&&i!==l._lc)&&(n+=this._proposeItem(s)),this.__found=e,this._renderListItems(n)}_proposeItem(t){return`<li class="si-item si-proposal" data-term="${t}">${this.options.proposal.replace("{X}",`<span>${t}</span>`)}</li>`}_handleClick(t){let e=t.target,s=e.classList;s.contains("si-proposal")?this._tryCreateItem(e.dataset.term)&&this.toggle()._trigger("created",this.current):s.contains("si-item")?this._setCurrent(this.findItem(e),e).toggle()._trigger("selected",this.current):s.contains("si-removal")&&(e=e.parentNode,this._fireCallback("onDelete",this.findItem(e))&&this._trigger("removed",this._sliceItem(e)))}_fireCallback(t,e){return"function"!=typeof this.options[t]||this.options[t](e)}_handleKey(t){let e,s=t.target.value,i=this.__found;s&&13!==t.keyCode&&"Enter"!==t.key||(!i&&s?e=this._tryCreateItem(s)?"created":null:i&&(e="selected",this._setCurrent(i)),e&&this.toggle()._trigger(e,this.current))}_tryCreateItem(t){let e=this._convertItem(t.trim());return!(this.findItem(t)||!this._fireCallback("onCreate",e)||(this._setCurrent(this._insertItem(e)),0))}_insertItem(t){return this.options.items.push(t),this.options.sort&&this._sortItems(),t}_sortItems(){let t="desc"===this.options.order?1:-1;this.options.items.sort((e,s)=>e._lc<s._lc?-t:e._lc>s._lc?t:0)}_sliceItem(t){let e,s=this.options.items,i=t.dataset.value.toLowerCase(),r=this.current;return this.dom.list.removeChild(t),e=s.splice(s.findIndex(t=>t._lc===i),1).shift(),r&&e._lc===r._lc&&this.clearCurrent(),e}} | ||
| //# sourceMappingURL=select-input-min.js.map |
@@ -1,2 +0,2 @@ | ||
| !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t=t||self).SelectInput=e()}(this,function(){"use strict";function t(t,e){return t(e={exports:{}},e.exports),e.exports}var e=t(function(t){var e=t.exports="undefined"!=typeof window&&window.Math==Math?window:"undefined"!=typeof self&&self.Math==Math?self:Function("return this")();"number"==typeof __g&&(__g=e)}),n=t(function(t){var e=t.exports={version:"2.6.3"};"number"==typeof __e&&(__e=e)}),r=(n.version,function(t){return"object"==typeof t?null!==t:"function"==typeof t}),i=function(t){if(!r(t))throw TypeError(t+" is not an object!");return t},o=function(t){try{return!!t()}catch(t){return!0}},u=!o(function(){return 7!=Object.defineProperty({},"a",{get:function(){return 7}}).a}),c=e.document,s=r(c)&&r(c.createElement),a=function(t){return s?c.createElement(t):{}},l=!u&&!o(function(){return 7!=Object.defineProperty(a("div"),"a",{get:function(){return 7}}).a}),f=Object.defineProperty,h={f:u?Object.defineProperty:function(t,e,n){if(i(t),e=function(t,e){if(!r(t))return t;var n,i;if(e&&"function"==typeof(n=t.toString)&&!r(i=n.call(t)))return i;if("function"==typeof(n=t.valueOf)&&!r(i=n.call(t)))return i;if(!e&&"function"==typeof(n=t.toString)&&!r(i=n.call(t)))return i;throw TypeError("Can't convert object to primitive value")}(e,!0),i(n),l)try{return f(t,e,n)}catch(t){}if("get"in n||"set"in n)throw TypeError("Accessors not supported!");return"value"in n&&(t[e]=n.value),t}},v=function(t,e){return{enumerable:!(1&t),configurable:!(2&t),writable:!(4&t),value:e}},p=u?function(t,e,n){return h.f(t,e,v(1,n))}:function(t,e,n){return t[e]=n,t},d={}.hasOwnProperty,y=function(t,e){return d.call(t,e)},m=0,g=Math.random(),_=function(t){return"Symbol(".concat(void 0===t?"":t,")_",(++m+g).toString(36))},b=t(function(t){var r=_("src"),i=Function.toString,o=(""+i).split("toString");n.inspectSource=function(t){return i.call(t)},(t.exports=function(t,n,i,u){var c="function"==typeof i;c&&(y(i,"name")||p(i,"name",n)),t[n]!==i&&(c&&(y(i,r)||p(i,r,t[n]?""+t[n]:o.join(String(n)))),t===e?t[n]=i:u?t[n]?t[n]=i:p(t,n,i):(delete t[n],p(t,n,i)))})(Function.prototype,"toString",function(){return"function"==typeof this&&this[r]||i.call(this)})}),S=function(t,e,n){if(function(t){if("function"!=typeof t)throw TypeError(t+" is not a function!")}(t),void 0===e)return t;switch(n){case 1:return function(n){return t.call(e,n)};case 2:return function(n,r){return t.call(e,n,r)};case 3:return function(n,r,i){return t.call(e,n,r,i)}}return function(){return t.apply(e,arguments)}},k=function(t,r,i){var o,u,c,s,a=t&k.F,l=t&k.G,f=t&k.S,h=t&k.P,v=t&k.B,d=l?e:f?e[r]||(e[r]={}):(e[r]||{}).prototype,y=l?n:n[r]||(n[r]={}),m=y.prototype||(y.prototype={});for(o in l&&(i=r),i)c=((u=!a&&d&&void 0!==d[o])?d:i)[o],s=v&&u?S(c,e):h&&"function"==typeof c?S(Function.call,c):c,d&&b(d,o,c,t&k.U),y[o]!=c&&p(y,o,s),h&&m[o]!=c&&(m[o]=c)};e.core=n,k.F=1,k.G=2,k.S=4,k.P=8,k.B=16,k.W=32,k.U=64,k.R=128;var x=k,E={}.toString,I=function(t){return E.call(t).slice(8,-1)},L=Object("z").propertyIsEnumerable(0)?Object:function(t){return"String"==I(t)?t.split(""):Object(t)},w=function(t){if(null==t)throw TypeError("Can't call method on "+t);return t},O=function(t){return Object(w(t))},C=Math.ceil,j=Math.floor,T=function(t){return isNaN(t=+t)?0:(t>0?j:C)(t)},A=Math.min,P=function(t){return t>0?A(T(t),9007199254740991):0},M=Array.isArray||function(t){return"Array"==I(t)},R=t(function(t){var r=e["__core-js_shared__"]||(e["__core-js_shared__"]={});(t.exports=function(t,e){return r[t]||(r[t]=void 0!==e?e:{})})("versions",[]).push({version:n.version,mode:"global",copyright:"© 2019 Denis Pushkarev (zloirock.ru)"})}),F=t(function(t){var n=R("wks"),r=e.Symbol,i="function"==typeof r;(t.exports=function(t){return n[t]||(n[t]=i&&r[t]||(i?r:_)("Symbol."+t))}).store=n}),N=F("species"),G=function(t,e){return new(function(t){var e;return M(t)&&("function"!=typeof(e=t.constructor)||e!==Array&&!M(e.prototype)||(e=void 0),r(e)&&null===(e=e[N])&&(e=void 0)),void 0===e?Array:e}(t))(e)},H=function(t,e){var n=1==t,r=2==t,i=3==t,o=4==t,u=6==t,c=5==t||u,s=e||G;return function(e,a,l){for(var f,h,v=O(e),p=L(v),d=S(a,l,3),y=P(p.length),m=0,g=n?s(e,y):r?s(e,0):void 0;y>m;m++)if((c||m in p)&&(h=d(f=p[m],m,v),t))if(n)g[m]=h;else if(h)switch(t){case 3:return!0;case 5:return f;case 6:return m;case 2:g.push(f)}else if(o)return!1;return u?-1:i||o?o:g}},$=F("unscopables"),V=Array.prototype;null==V[$]&&p(V,$,{});var D=function(t){V[$][t]=!0},q=H(6),B="findIndex",U=!0;B in[]&&Array(1)[B](function(){U=!1}),x(x.P+x.F*U,"Array",{findIndex:function(t){return q(this,t,arguments.length>1?arguments[1]:void 0)}}),D(B);var W,z,K=function(t){return function(e,n){var r,i,o=String(w(e)),u=T(n),c=o.length;return u<0||u>=c?t?"":void 0:(r=o.charCodeAt(u))<55296||r>56319||u+1===c||(i=o.charCodeAt(u+1))<56320||i>57343?t?o.charAt(u):r:t?o.slice(u,u+2):i-56320+(r-55296<<10)+65536}}(!0),X=function(t,e,n){return e+(n?K(t,e).length:1)},J=F("toStringTag"),Q="Arguments"==I(function(){return arguments}()),Y=RegExp.prototype.exec,Z=function(t,e){var n,r,i,o,u=t.exec;if("function"==typeof u){var c=u.call(t,e);if("object"!=typeof c)throw new TypeError("RegExp exec method returned something other than an Object or null");return c}if("RegExp"!==(void 0===(n=t)?"Undefined":null===n?"Null":"string"==typeof(i=function(t,e){try{return t[e]}catch(t){}}(r=Object(n),J))?i:Q?I(r):"Object"==(o=I(r))&&"function"==typeof r.callee?"Arguments":o))throw new TypeError("RegExp#exec called on incompatible receiver");return Y.call(t,e)},tt=function(){var t=i(this),e="";return t.global&&(e+="g"),t.ignoreCase&&(e+="i"),t.multiline&&(e+="m"),t.unicode&&(e+="u"),t.sticky&&(e+="y"),e},et=RegExp.prototype.exec,nt=String.prototype.replace,rt=et,it=(W=/a/,z=/b*/g,et.call(W,"a"),et.call(z,"a"),0!==W.lastIndex||0!==z.lastIndex),ot=void 0!==/()??/.exec("")[1];(it||ot)&&(rt=function(t){var e,n,r,i,o=this;return ot&&(n=new RegExp("^"+o.source+"$(?!\\s)",tt.call(o))),it&&(e=o.lastIndex),r=et.call(o,t),it&&r&&(o.lastIndex=o.global?r.index+r[0].length:e),ot&&r&&r.length>1&&nt.call(r[0],n,function(){for(i=1;i<arguments.length-2;i++)void 0===arguments[i]&&(r[i]=void 0)}),r});var ut=rt;x({target:"RegExp",proto:!0,forced:ut!==/./.exec},{exec:ut});var ct=F("species"),st=!o(function(){var t=/./;return t.exec=function(){var t=[];return t.groups={a:"7"},t},"7"!=="".replace(t,"$<a>")}),at=function(){var t=/(?:)/,e=t.exec;t.exec=function(){return e.apply(this,arguments)};var n="ab".split(t);return 2===n.length&&"a"===n[0]&&"b"===n[1]}(),lt=Math.max,ft=Math.min,ht=Math.floor,vt=/\$([$&`']|\d\d?|<[^>]*>)/g,pt=/\$([$&`']|\d\d?)/g;!function(t,e,n){var r=F(t),i=!o(function(){var e={};return e[r]=function(){return 7},7!=""[t](e)}),u=i?!o(function(){var e=!1,n=/a/;return n.exec=function(){return e=!0,null},"split"===t&&(n.constructor={},n.constructor[ct]=function(){return n}),n[r](""),!e}):void 0;if(!i||!u||"replace"===t&&!st||"split"===t&&!at){var c=/./[r],s=n(w,r,""[t],function(t,e,n,r,o){return e.exec===ut?i&&!o?{done:!0,value:c.call(e,n,r)}:{done:!0,value:t.call(n,e,r)}:{done:!1}}),a=s[0],l=s[1];b(String.prototype,t,a),p(RegExp.prototype,r,2==e?function(t,e){return l.call(t,this,e)}:function(t){return l.call(t,this)})}}("replace",2,function(t,e,n,r){return[function(r,i){var o=t(this),u=null==r?void 0:r[e];return void 0!==u?u.call(r,o,i):n.call(String(o),r,i)},function(t,e){var u=r(n,t,this,e);if(u.done)return u.value;var c=i(t),s=String(this),a="function"==typeof e;a||(e=String(e));var l=c.global;if(l){var f=c.unicode;c.lastIndex=0}for(var h=[];;){var v=Z(c,s);if(null===v)break;if(h.push(v),!l)break;""===String(v[0])&&(c.lastIndex=X(s,P(c.lastIndex),f))}for(var p,d="",y=0,m=0;m<h.length;m++){v=h[m];for(var g=String(v[0]),_=lt(ft(T(v.index),s.length),0),b=[],S=1;S<v.length;S++)b.push(void 0===(p=v[S])?p:String(p));var k=v.groups;if(a){var x=[g].concat(b,_,s);void 0!==k&&x.push(k);var E=String(e.apply(void 0,x))}else E=o(g,s,_,b,k,e);_>=y&&(d+=s.slice(y,_)+E,y=_+g.length)}return d+s.slice(y)}];function o(t,e,r,i,o,u){var c=r+t.length,s=i.length,a=pt;return void 0!==o&&(o=O(o),a=vt),n.call(u,a,function(n,u){var a;switch(u.charAt(0)){case"$":return"$";case"&":return t;case"`":return e.slice(0,r);case"'":return e.slice(c);case"<":a=o[u.slice(1,-1)];break;default:var l=+u;if(0===l)return n;if(l>s){var f=ht(l/10);return 0===f?n:f<=s?void 0===i[f-1]?u.charAt(1):i[f-1]+u.charAt(1):n}a=i[l-1]}return void 0===a?"":a})}});var dt,yt=function(t,e){return{value:e,done:!!t}},mt={},gt=function(t){return L(w(t))},_t=Math.max,bt=Math.min,St=R("keys"),kt=function(t){return St[t]||(St[t]=_(t))},xt=(dt=!1,function(t,e,n){var r,i=gt(t),o=P(i.length),u=function(t,e){return(t=T(t))<0?_t(t+e,0):bt(t,e)}(n,o);if(dt&&e!=e){for(;o>u;)if((r=i[u++])!=r)return!0}else for(;o>u;u++)if((dt||u in i)&&i[u]===e)return dt||u||0;return!dt&&-1}),Et=kt("IE_PROTO"),It="constructor,hasOwnProperty,isPrototypeOf,propertyIsEnumerable,toLocaleString,toString,valueOf".split(","),Lt=Object.keys||function(t){return function(t,e){var n,r=gt(t),i=0,o=[];for(n in r)n!=Et&&y(r,n)&&o.push(n);for(;e.length>i;)y(r,n=e[i++])&&(~xt(o,n)||o.push(n));return o}(t,It)},wt=u?Object.defineProperties:function(t,e){i(t);for(var n,r=Lt(e),o=r.length,u=0;o>u;)h.f(t,n=r[u++],e[n]);return t},Ot=e.document,Ct=Ot&&Ot.documentElement,jt=kt("IE_PROTO"),Tt=function(){},At=function(){var t,e=a("iframe"),n=It.length;for(e.style.display="none",Ct.appendChild(e),e.src="javascript:",(t=e.contentWindow.document).open(),t.write("<script>document.F=Object<\/script>"),t.close(),At=t.F;n--;)delete At.prototype[It[n]];return At()},Pt=Object.create||function(t,e){var n;return null!==t?(Tt.prototype=i(t),n=new Tt,Tt.prototype=null,n[jt]=t):n=At(),void 0===e?n:wt(n,e)},Mt=h.f,Rt=F("toStringTag"),Ft=function(t,e,n){t&&!y(t=n?t:t.prototype,Rt)&&Mt(t,Rt,{configurable:!0,value:e})},Nt={};p(Nt,F("iterator"),function(){return this});var Gt=function(t,e,n){t.prototype=Pt(Nt,{next:v(1,n)}),Ft(t,e+" Iterator")},Ht=kt("IE_PROTO"),$t=Object.prototype,Vt=Object.getPrototypeOf||function(t){return t=O(t),y(t,Ht)?t[Ht]:"function"==typeof t.constructor&&t instanceof t.constructor?t.constructor.prototype:t instanceof Object?$t:null},Dt=F("iterator"),qt=!([].keys&&"next"in[].keys()),Bt=function(){return this},Ut=function(t,e,n,r,i,o,u){Gt(n,e,r);var c,s,a,l=function(t){if(!qt&&t in d)return d[t];switch(t){case"keys":case"values":return function(){return new n(this,t)}}return function(){return new n(this,t)}},f=e+" Iterator",h="values"==i,v=!1,d=t.prototype,y=d[Dt]||d["@@iterator"]||i&&d[i],m=y||l(i),g=i?h?l("entries"):m:void 0,_="Array"==e&&d.entries||y;if(_&&(a=Vt(_.call(new t)))!==Object.prototype&&a.next&&(Ft(a,f,!0),"function"!=typeof a[Dt]&&p(a,Dt,Bt)),h&&y&&"values"!==y.name&&(v=!0,m=function(){return y.call(this)}),(qt||v||!d[Dt])&&p(d,Dt,m),mt[e]=m,mt[f]=Bt,i)if(c={values:h?m:l("values"),keys:o?m:l("keys"),entries:g},u)for(s in c)s in d||b(d,s,c[s]);else x(x.P+x.F*(qt||v),e,c);return c}(Array,"Array",function(t,e){this._t=gt(t),this._i=0,this._k=e},function(){var t=this._t,e=this._k,n=this._i++;return!t||n>=t.length?(this._t=void 0,yt(1)):yt(0,"keys"==e?n:"values"==e?t[n]:[n,t[n]])},"values");mt.Arguments=mt.Array,D("keys"),D("values"),D("entries");for(var Wt=F("iterator"),zt=F("toStringTag"),Kt=mt.Array,Xt={CSSRuleList:!0,CSSStyleDeclaration:!1,CSSValueList:!1,ClientRectList:!1,DOMRectList:!1,DOMStringList:!1,DOMTokenList:!0,DataTransferItemList:!1,FileList:!1,HTMLAllCollection:!1,HTMLCollection:!1,HTMLFormElement:!1,HTMLSelectElement:!1,MediaList:!0,MimeTypeArray:!1,NamedNodeMap:!1,NodeList:!0,PaintRequestList:!1,Plugin:!1,PluginArray:!1,SVGLengthList:!1,SVGNumberList:!1,SVGPathSegList:!1,SVGPointList:!1,SVGStringList:!1,SVGTransformList:!1,SourceBufferList:!1,StyleSheetList:!0,TextTrackCueList:!1,TextTrackList:!1,TouchList:!1},Jt=Lt(Xt),Qt=0;Qt<Jt.length;Qt++){var Yt,Zt=Jt[Qt],te=Xt[Zt],ee=e[Zt],ne=ee&&ee.prototype;if(ne&&(ne[Wt]||p(ne,Wt,Kt),ne[zt]||p(ne,zt,Zt),mt[Zt]=Kt,te))for(Yt in Ut)ne[Yt]||b(ne,Yt,Ut[Yt],!0)}function re(t){return(re="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function ie(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}u&&"g"!=/./g.flags&&h.f(RegExp.prototype,"flags",{configurable:!0,get:tt});var oe=/./.toString,ue=function(t){b(RegExp.prototype,"toString",t,!0)};o(function(){return"/a/b"!=oe.call({source:"a",flags:"b"})})?ue(function(){var t=i(this);return"/".concat(t.source,"/","flags"in t?t.flags:!u&&t instanceof RegExp?tt.call(t):void 0)}):"toString"!=oe.name&&ue(function(){return oe.call(this)});var ce=h.f,se=Function.prototype,ae=/^\s*function ([^ (]*)/;"name"in se||u&&ce(se,"name",{configurable:!0,get:function(){try{return(""+this).match(ae)[1]}catch(t){return""}}});var le=H(5),fe=!0;"find"in[]&&Array(1).find(function(){fe=!1}),x(x.P+x.F*fe,"Array",{find:function(t){return le(this,t,arguments.length>1?arguments[1]:void 0)}}),D("find");var he={f:Object.getOwnPropertySymbols},ve={f:{}.propertyIsEnumerable},pe=Object.assign,de=!pe||o(function(){var t={},e={},n=Symbol(),r="abcdefghijklmnopqrst";return t[n]=7,r.split("").forEach(function(t){e[t]=t}),7!=pe({},t)[n]||Object.keys(pe({},e)).join("")!=r})?function(t,e){for(var n=O(t),r=arguments.length,i=1,o=he.f,u=ve.f;r>i;)for(var c,s=L(arguments[i++]),a=o?Lt(s).concat(o(s)):Lt(s),l=a.length,f=0;l>f;)u.call(s,c=a[f++])&&(n[c]=s[c]);return n}:pe;x(x.S+x.F,"Object",{assign:de});var ye=document,me={items:[],current:null,parent:null,maxHeight:0,proposal:"Add {X} to the list?",sort:!0,order:"desc",removalIcon:"×"};return function(){function t(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.options=Object.assign({},me,n),this.dom={el:this._setElement(e)},this.options.items=this._convertItems(n.items),this.current=n.current?this._convertItem(n.current):{},this.__found=null,this.options.sort&&this._sortItems(),this._renderInit(),this._events=[],this._bindEvents()}var e,n,r;return e=t,(n=[{key:"_bindEvents",value:function(){var t=this,e=function(e){("Escape"===e.key||27===e.keyCode||e.target.contains(t.dom.el))&&t.toggle(!1)};this.on("input",this._search),this.on("click",this._handleClick),this.on("keyup",this._handleKey),this.on("focusin",function(){return t._renderListItems().toggle(!0)},this.dom.input),this.on("keyup",e,ye),this.on("click",e,ye)}},{key:"on",value:function(t,e){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;e=e.bind(this),(n||this.dom.el).addEventListener(t,e,!1),this._events.push({name:t,fn:e,el:n})}},{key:"toggle",value:function(){var t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];this.dom.el.firstElementChild.classList[t?"remove":"add"]("si-hide"),t||this.dom.input.blur()}},{key:"getElement",value:function(){return this.dom.el}},{key:"getItems",value:function(){return this.options.items}},{key:"getCurrent",value:function(){var t=Object.assign({},this.current);return delete t._lc,t}},{key:"findItem",value:function(t){return t=t.nodeName?t.dataset.value:t,this.options.items.find(function(e){return e.value===t})}},{key:"remove",value:function(){var t=this;this._events=this._events.filter(function(e){return(e.el||t.dom.el).removeEventListener(e.name,e.fn,!1)}),this.dom.el.parentNode.removeChild(this.dom.el),this.dom=null}},{key:"_setCurrent",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;return this.current=t,this.dom.input.value=t.value.toString(),this._setSelected(t,e),this}},{key:"_clearCurrent",value:function(){this.current={},this.dom.input.value="",this._clearSelected()}},{key:"_trigger",value:function(t){var e,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;"function"==typeof CustomEvent?e=new CustomEvent(t,{detail:n||this.current}):(e=ye.createEvent("Event")).initEvent(t,!0,!0),this.dom.el.dispatchEvent(e)}},{key:"_setElement",value:function(t){if(!t&&!t.nodeType&&"string"!=typeof t)throw new Error("Wrong element type provided!");return t.nodeType?t:(this.options.parent||ye).querySelector(t)}},{key:"_setSelected",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;this._clearSelected(),(e=e||this.dom.list.querySelector('li[data-value="'.concat(t.value,'"]')))&&e.classList.add("si-current")}},{key:"_clearSelected",value:function(){var t=this.dom.list.querySelector(".si-current");t&&t.classList.remove("si-current")}},{key:"_convertItems",value:function(){var t=this;return(arguments.length>0&&void 0!==arguments[0]?arguments[0]:[]).map(function(e){return t._convertItem(e)})}},{key:"_convertItem",value:function(t){return(t="object"!==re(t)?{value:t}:t)._lc=t.value.toString().toLowerCase(),t}},{key:"_renderInit",value:function(){var t=ye.createElement("div");return t.className="si-wrap si-hide",this.dom.input=t.appendChild(this._renderInput()),this.dom.list=t.appendChild(this._renderList()).firstChild,this.current.value&&(this.dom.input.value=this.current.value),this.dom.el.appendChild(t)}},{key:"_renderInput",value:function(){var t=ye.createElement("input");return t.type="text",t.autocomplete="false",t.spellcheck=!1,t}},{key:"_renderList",value:function(){var t=ye.createElement("div"),e=ye.createElement("ul"),n=this.options.maxHeight;return t.className="si-list",n&&(t.style.maxHeight=n+"px"),t.appendChild(e),t}},{key:"_createListItems",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[],e="",n=this.current.value,r="",i=this._createRemovalButton();return t.forEach(function(t){r=n&&t.value===n?" si-current":"",e+='<li class="si-item'.concat(r,'" data-value="').concat(t.value,'">').concat(t.value).concat(i,"</li>")}),e}},{key:"_renderListItems",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"";return this.dom.list.innerHTML=t||this._createListItems(this.options.items),this}},{key:"_createRemovalButton",value:function(){return'<button type="button" class="si-removal">'.concat(this.options.removalIcon,"</button>")}},{key:"_search",value:function(t){var e=null,n=t.target.value,r=n.toLowerCase(),i=this.options.items.filter(function(t){return-1!==t._lc.indexOf(r)}),o=this._createListItems(i),u=i[0],c=i.length;1===c&&u&&(e=u),(!u||c&&r&&r!==u._lc)&&(o+=this._proposeItem(n)),this.__found=e,this._renderListItems(o)}},{key:"_proposeItem",value:function(t){var e=this.options.proposal.replace("{X}","<span>".concat(t,"</span>"));return'<li class="si-item si-proposal" data-term="'.concat(t,'">').concat(e,"</li>")}},{key:"_handleClick",value:function(t){var e=t.target;return e.classList.contains("si-proposal")?(this._setCurrent(this._createItem(e),e).toggle(),void this._trigger("created")):e.classList.contains("si-item")?(this._setCurrent(this.findItem(e),e).toggle(),void this._trigger("selected")):void(e.classList.contains("si-removal")&&this._trigger("removed",this._sliceItem(e.parentNode)))}},{key:"_handleKey",value:function(t){var e=t.target.value,n="selected";!e||13!==t.keyCode&&13!==t.which&&"Enter"!==t.key||(this.__found?this._setCurrent(this.__found):(this._setCurrent(this._createItem(e)),n="created"),this.toggle(),this._trigger(n))}},{key:"_createItem",value:function(t){var e=this._convertItem(t.nodeName?t.dataset.term:t);return this.options.items.push(e),this.options.sort&&this._sortItems(),e}},{key:"_sortItems",value:function(){var t="desc"===this.options.order?1:-1;this.options.items.sort(function(e,n){return e.value<n.value?-t:e.value>n.value?t:0})}},{key:"_sliceItem",value:function(t){var e,n=this.options.items,r=t.dataset.value.toLowerCase(),i=this.current;return this.dom.list.removeChild(t),e=n.splice(n.findIndex(function(t){return t._lc===r}),1).shift(),i&&e._lc===i._lc&&this._clearCurrent(),e}}])&&ie(e.prototype,n),r&&ie(e,r),t}()}); | ||
| !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t=t||self).SelectInput=e()}(this,function(){"use strict";function t(t,e){return t(e={exports:{}},e.exports),e.exports}var e=t(function(t){var e=t.exports="undefined"!=typeof window&&window.Math==Math?window:"undefined"!=typeof self&&self.Math==Math?self:Function("return this")();"number"==typeof __g&&(__g=e)}),n=t(function(t){var e=t.exports={version:"2.6.3"};"number"==typeof __e&&(__e=e)}),r=(n.version,function(t){return"object"==typeof t?null!==t:"function"==typeof t}),i=function(t){if(!r(t))throw TypeError(t+" is not an object!");return t},o=function(t){try{return!!t()}catch(t){return!0}},u=!o(function(){return 7!=Object.defineProperty({},"a",{get:function(){return 7}}).a}),c=e.document,a=r(c)&&r(c.createElement),s=function(t){return a?c.createElement(t):{}},l=!u&&!o(function(){return 7!=Object.defineProperty(s("div"),"a",{get:function(){return 7}}).a}),f=Object.defineProperty,p={f:u?Object.defineProperty:function(t,e,n){if(i(t),e=function(t,e){if(!r(t))return t;var n,i;if(e&&"function"==typeof(n=t.toString)&&!r(i=n.call(t)))return i;if("function"==typeof(n=t.valueOf)&&!r(i=n.call(t)))return i;if(!e&&"function"==typeof(n=t.toString)&&!r(i=n.call(t)))return i;throw TypeError("Can't convert object to primitive value")}(e,!0),i(n),l)try{return f(t,e,n)}catch(t){}if("get"in n||"set"in n)throw TypeError("Accessors not supported!");return"value"in n&&(t[e]=n.value),t}},h=function(t,e){return{enumerable:!(1&t),configurable:!(2&t),writable:!(4&t),value:e}},v=u?function(t,e,n){return p.f(t,e,h(1,n))}:function(t,e,n){return t[e]=n,t},d={}.hasOwnProperty,y=function(t,e){return d.call(t,e)},m=0,g=Math.random(),_=function(t){return"Symbol(".concat(void 0===t?"":t,")_",(++m+g).toString(36))},b=t(function(t){var r=_("src"),i=Function.toString,o=(""+i).split("toString");n.inspectSource=function(t){return i.call(t)},(t.exports=function(t,n,i,u){var c="function"==typeof i;c&&(y(i,"name")||v(i,"name",n)),t[n]!==i&&(c&&(y(i,r)||v(i,r,t[n]?""+t[n]:o.join(String(n)))),t===e?t[n]=i:u?t[n]?t[n]=i:v(t,n,i):(delete t[n],v(t,n,i)))})(Function.prototype,"toString",function(){return"function"==typeof this&&this[r]||i.call(this)})}),S=function(t,e,n){if(function(t){if("function"!=typeof t)throw TypeError(t+" is not a function!")}(t),void 0===e)return t;switch(n){case 1:return function(n){return t.call(e,n)};case 2:return function(n,r){return t.call(e,n,r)};case 3:return function(n,r,i){return t.call(e,n,r,i)}}return function(){return t.apply(e,arguments)}},k=function(t,r,i){var o,u,c,a,s=t&k.F,l=t&k.G,f=t&k.S,p=t&k.P,h=t&k.B,d=l?e:f?e[r]||(e[r]={}):(e[r]||{}).prototype,y=l?n:n[r]||(n[r]={}),m=y.prototype||(y.prototype={});for(o in l&&(i=r),i)c=((u=!s&&d&&void 0!==d[o])?d:i)[o],a=h&&u?S(c,e):p&&"function"==typeof c?S(Function.call,c):c,d&&b(d,o,c,t&k.U),y[o]!=c&&v(y,o,a),p&&m[o]!=c&&(m[o]=c)};e.core=n,k.F=1,k.G=2,k.S=4,k.P=8,k.B=16,k.W=32,k.U=64,k.R=128;var x=k,E={}.toString,I=function(t){return E.call(t).slice(8,-1)},O=Object("z").propertyIsEnumerable(0)?Object:function(t){return"String"==I(t)?t.split(""):Object(t)},C=function(t){if(null==t)throw TypeError("Can't call method on "+t);return t},w=function(t){return Object(C(t))},L=Math.ceil,j=Math.floor,T=function(t){return isNaN(t=+t)?0:(t>0?j:L)(t)},A=Math.min,P=function(t){return t>0?A(T(t),9007199254740991):0},M=Array.isArray||function(t){return"Array"==I(t)},R=t(function(t){var r=e["__core-js_shared__"]||(e["__core-js_shared__"]={});(t.exports=function(t,e){return r[t]||(r[t]=void 0!==e?e:{})})("versions",[]).push({version:n.version,mode:"global",copyright:"© 2019 Denis Pushkarev (zloirock.ru)"})}),F=t(function(t){var n=R("wks"),r=e.Symbol,i="function"==typeof r;(t.exports=function(t){return n[t]||(n[t]=i&&r[t]||(i?r:_)("Symbol."+t))}).store=n}),N=F("species"),D=function(t,e){return new(function(t){var e;return M(t)&&("function"!=typeof(e=t.constructor)||e!==Array&&!M(e.prototype)||(e=void 0),r(e)&&null===(e=e[N])&&(e=void 0)),void 0===e?Array:e}(t))(e)},H=function(t,e){var n=1==t,r=2==t,i=3==t,o=4==t,u=6==t,c=5==t||u,a=e||D;return function(e,s,l){for(var f,p,h=w(e),v=O(h),d=S(s,l,3),y=P(v.length),m=0,g=n?a(e,y):r?a(e,0):void 0;y>m;m++)if((c||m in v)&&(p=d(f=v[m],m,h),t))if(n)g[m]=p;else if(p)switch(t){case 3:return!0;case 5:return f;case 6:return m;case 2:g.push(f)}else if(o)return!1;return u?-1:i||o?o:g}},G=F("unscopables"),$=Array.prototype;null==$[G]&&v($,G,{});var V=function(t){$[G][t]=!0},q=H(6),B="findIndex",U=!0;B in[]&&Array(1)[B](function(){U=!1}),x(x.P+x.F*U,"Array",{findIndex:function(t){return q(this,t,arguments.length>1?arguments[1]:void 0)}}),V(B);var W=p.f,z=Function.prototype,K=/^\s*function ([^ (]*)/;"name"in z||u&&W(z,"name",{configurable:!0,get:function(){try{return(""+this).match(K)[1]}catch(t){return""}}});var X,J,Q=function(t){return function(e,n){var r,i,o=String(C(e)),u=T(n),c=o.length;return u<0||u>=c?t?"":void 0:(r=o.charCodeAt(u))<55296||r>56319||u+1===c||(i=o.charCodeAt(u+1))<56320||i>57343?t?o.charAt(u):r:t?o.slice(u,u+2):i-56320+(r-55296<<10)+65536}}(!0),Y=function(t,e,n){return e+(n?Q(t,e).length:1)},Z=F("toStringTag"),tt="Arguments"==I(function(){return arguments}()),et=RegExp.prototype.exec,nt=function(t,e){var n,r,i,o,u=t.exec;if("function"==typeof u){var c=u.call(t,e);if("object"!=typeof c)throw new TypeError("RegExp exec method returned something other than an Object or null");return c}if("RegExp"!==(void 0===(n=t)?"Undefined":null===n?"Null":"string"==typeof(i=function(t,e){try{return t[e]}catch(t){}}(r=Object(n),Z))?i:tt?I(r):"Object"==(o=I(r))&&"function"==typeof r.callee?"Arguments":o))throw new TypeError("RegExp#exec called on incompatible receiver");return et.call(t,e)},rt=function(){var t=i(this),e="";return t.global&&(e+="g"),t.ignoreCase&&(e+="i"),t.multiline&&(e+="m"),t.unicode&&(e+="u"),t.sticky&&(e+="y"),e},it=RegExp.prototype.exec,ot=String.prototype.replace,ut=it,ct=(X=/a/,J=/b*/g,it.call(X,"a"),it.call(J,"a"),0!==X.lastIndex||0!==J.lastIndex),at=void 0!==/()??/.exec("")[1];(ct||at)&&(ut=function(t){var e,n,r,i,o=this;return at&&(n=new RegExp("^"+o.source+"$(?!\\s)",rt.call(o))),ct&&(e=o.lastIndex),r=it.call(o,t),ct&&r&&(o.lastIndex=o.global?r.index+r[0].length:e),at&&r&&r.length>1&&ot.call(r[0],n,function(){for(i=1;i<arguments.length-2;i++)void 0===arguments[i]&&(r[i]=void 0)}),r});var st=ut;x({target:"RegExp",proto:!0,forced:st!==/./.exec},{exec:st});var lt=F("species"),ft=!o(function(){var t=/./;return t.exec=function(){var t=[];return t.groups={a:"7"},t},"7"!=="".replace(t,"$<a>")}),pt=function(){var t=/(?:)/,e=t.exec;t.exec=function(){return e.apply(this,arguments)};var n="ab".split(t);return 2===n.length&&"a"===n[0]&&"b"===n[1]}(),ht=Math.max,vt=Math.min,dt=Math.floor,yt=/\$([$&`']|\d\d?|<[^>]*>)/g,mt=/\$([$&`']|\d\d?)/g;!function(t,e,n){var r=F(t),i=!o(function(){var e={};return e[r]=function(){return 7},7!=""[t](e)}),u=i?!o(function(){var e=!1,n=/a/;return n.exec=function(){return e=!0,null},"split"===t&&(n.constructor={},n.constructor[lt]=function(){return n}),n[r](""),!e}):void 0;if(!i||!u||"replace"===t&&!ft||"split"===t&&!pt){var c=/./[r],a=n(C,r,""[t],function(t,e,n,r,o){return e.exec===st?i&&!o?{done:!0,value:c.call(e,n,r)}:{done:!0,value:t.call(n,e,r)}:{done:!1}}),s=a[0],l=a[1];b(String.prototype,t,s),v(RegExp.prototype,r,2==e?function(t,e){return l.call(t,this,e)}:function(t){return l.call(t,this)})}}("replace",2,function(t,e,n,r){return[function(r,i){var o=t(this),u=null==r?void 0:r[e];return void 0!==u?u.call(r,o,i):n.call(String(o),r,i)},function(t,e){var u=r(n,t,this,e);if(u.done)return u.value;var c=i(t),a=String(this),s="function"==typeof e;s||(e=String(e));var l=c.global;if(l){var f=c.unicode;c.lastIndex=0}for(var p=[];;){var h=nt(c,a);if(null===h)break;if(p.push(h),!l)break;""===String(h[0])&&(c.lastIndex=Y(a,P(c.lastIndex),f))}for(var v,d="",y=0,m=0;m<p.length;m++){h=p[m];for(var g=String(h[0]),_=ht(vt(T(h.index),a.length),0),b=[],S=1;S<h.length;S++)b.push(void 0===(v=h[S])?v:String(v));var k=h.groups;if(s){var x=[g].concat(b,_,a);void 0!==k&&x.push(k);var E=String(e.apply(void 0,x))}else E=o(g,a,_,b,k,e);_>=y&&(d+=a.slice(y,_)+E,y=_+g.length)}return d+a.slice(y)}];function o(t,e,r,i,o,u){var c=r+t.length,a=i.length,s=mt;return void 0!==o&&(o=w(o),s=yt),n.call(u,s,function(n,u){var s;switch(u.charAt(0)){case"$":return"$";case"&":return t;case"`":return e.slice(0,r);case"'":return e.slice(c);case"<":s=o[u.slice(1,-1)];break;default:var l=+u;if(0===l)return n;if(l>a){var f=dt(l/10);return 0===f?n:f<=a?void 0===i[f-1]?u.charAt(1):i[f-1]+u.charAt(1):n}s=i[l-1]}return void 0===s?"":s})}});var gt,_t=function(t,e){return{value:e,done:!!t}},bt={},St=function(t){return O(C(t))},kt=Math.max,xt=Math.min,Et=R("keys"),It=function(t){return Et[t]||(Et[t]=_(t))},Ot=(gt=!1,function(t,e,n){var r,i=St(t),o=P(i.length),u=function(t,e){return(t=T(t))<0?kt(t+e,0):xt(t,e)}(n,o);if(gt&&e!=e){for(;o>u;)if((r=i[u++])!=r)return!0}else for(;o>u;u++)if((gt||u in i)&&i[u]===e)return gt||u||0;return!gt&&-1}),Ct=It("IE_PROTO"),wt="constructor,hasOwnProperty,isPrototypeOf,propertyIsEnumerable,toLocaleString,toString,valueOf".split(","),Lt=Object.keys||function(t){return function(t,e){var n,r=St(t),i=0,o=[];for(n in r)n!=Ct&&y(r,n)&&o.push(n);for(;e.length>i;)y(r,n=e[i++])&&(~Ot(o,n)||o.push(n));return o}(t,wt)},jt=u?Object.defineProperties:function(t,e){i(t);for(var n,r=Lt(e),o=r.length,u=0;o>u;)p.f(t,n=r[u++],e[n]);return t},Tt=e.document,At=Tt&&Tt.documentElement,Pt=It("IE_PROTO"),Mt=function(){},Rt=function(){var t,e=s("iframe"),n=wt.length;for(e.style.display="none",At.appendChild(e),e.src="javascript:",(t=e.contentWindow.document).open(),t.write("<script>document.F=Object<\/script>"),t.close(),Rt=t.F;n--;)delete Rt.prototype[wt[n]];return Rt()},Ft=Object.create||function(t,e){var n;return null!==t?(Mt.prototype=i(t),n=new Mt,Mt.prototype=null,n[Pt]=t):n=Rt(),void 0===e?n:jt(n,e)},Nt=p.f,Dt=F("toStringTag"),Ht=function(t,e,n){t&&!y(t=n?t:t.prototype,Dt)&&Nt(t,Dt,{configurable:!0,value:e})},Gt={};v(Gt,F("iterator"),function(){return this});var $t=function(t,e,n){t.prototype=Ft(Gt,{next:h(1,n)}),Ht(t,e+" Iterator")},Vt=It("IE_PROTO"),qt=Object.prototype,Bt=Object.getPrototypeOf||function(t){return t=w(t),y(t,Vt)?t[Vt]:"function"==typeof t.constructor&&t instanceof t.constructor?t.constructor.prototype:t instanceof Object?qt:null},Ut=F("iterator"),Wt=!([].keys&&"next"in[].keys()),zt=function(){return this},Kt=function(t,e,n,r,i,o,u){$t(n,e,r);var c,a,s,l=function(t){if(!Wt&&t in d)return d[t];switch(t){case"keys":case"values":return function(){return new n(this,t)}}return function(){return new n(this,t)}},f=e+" Iterator",p="values"==i,h=!1,d=t.prototype,y=d[Ut]||d["@@iterator"]||i&&d[i],m=y||l(i),g=i?p?l("entries"):m:void 0,_="Array"==e&&d.entries||y;if(_&&(s=Bt(_.call(new t)))!==Object.prototype&&s.next&&(Ht(s,f,!0),"function"!=typeof s[Ut]&&v(s,Ut,zt)),p&&y&&"values"!==y.name&&(h=!0,m=function(){return y.call(this)}),(Wt||h||!d[Ut])&&v(d,Ut,m),bt[e]=m,bt[f]=zt,i)if(c={values:p?m:l("values"),keys:o?m:l("keys"),entries:g},u)for(a in c)a in d||b(d,a,c[a]);else x(x.P+x.F*(Wt||h),e,c);return c}(Array,"Array",function(t,e){this._t=St(t),this._i=0,this._k=e},function(){var t=this._t,e=this._k,n=this._i++;return!t||n>=t.length?(this._t=void 0,_t(1)):_t(0,"keys"==e?n:"values"==e?t[n]:[n,t[n]])},"values");bt.Arguments=bt.Array,V("keys"),V("values"),V("entries");for(var Xt=F("iterator"),Jt=F("toStringTag"),Qt=bt.Array,Yt={CSSRuleList:!0,CSSStyleDeclaration:!1,CSSValueList:!1,ClientRectList:!1,DOMRectList:!1,DOMStringList:!1,DOMTokenList:!0,DataTransferItemList:!1,FileList:!1,HTMLAllCollection:!1,HTMLCollection:!1,HTMLFormElement:!1,HTMLSelectElement:!1,MediaList:!0,MimeTypeArray:!1,NamedNodeMap:!1,NodeList:!0,PaintRequestList:!1,Plugin:!1,PluginArray:!1,SVGLengthList:!1,SVGNumberList:!1,SVGPathSegList:!1,SVGPointList:!1,SVGStringList:!1,SVGTransformList:!1,SourceBufferList:!1,StyleSheetList:!0,TextTrackCueList:!1,TextTrackList:!1,TouchList:!1},Zt=Lt(Yt),te=0;te<Zt.length;te++){var ee,ne=Zt[te],re=Yt[ne],ie=e[ne],oe=ie&&ie.prototype;if(oe&&(oe[Xt]||v(oe,Xt,Qt),oe[Jt]||v(oe,Jt,ne),bt[ne]=Qt,re))for(ee in Kt)oe[ee]||b(oe,ee,Kt[ee],!0)}function ue(t){return(ue="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function ce(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function ae(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,r.key,r)}}function se(t,e,n){return e&&ae(t.prototype,e),n&&ae(t,n),t}function le(t){return(le=Object.setPrototypeOf?Object.getPrototypeOf:function(t){return t.__proto__||Object.getPrototypeOf(t)})(t)}function fe(t,e){return(fe=Object.setPrototypeOf||function(t,e){return t.__proto__=e,t})(t,e)}function pe(t,e){return!e||"object"!=typeof e&&"function"!=typeof e?function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(t):e}u&&"g"!=/./g.flags&&p.f(RegExp.prototype,"flags",{configurable:!0,get:rt});var he=/./.toString,ve=function(t){b(RegExp.prototype,"toString",t,!0)};o(function(){return"/a/b"!=he.call({source:"a",flags:"b"})})?ve(function(){var t=i(this);return"/".concat(t.source,"/","flags"in t?t.flags:!u&&t instanceof RegExp?rt.call(t):void 0)}):"toString"!=he.name&&ve(function(){return he.call(this)});var de=H(5),ye=!0;"find"in[]&&Array(1).find(function(){ye=!1}),x(x.P+x.F*ye,"Array",{find:function(t){return de(this,t,arguments.length>1?arguments[1]:void 0)}}),V("find");var me={f:Object.getOwnPropertySymbols},ge={f:{}.propertyIsEnumerable},_e=Object.assign,be=!_e||o(function(){var t={},e={},n=Symbol(),r="abcdefghijklmnopqrst";return t[n]=7,r.split("").forEach(function(t){e[t]=t}),7!=_e({},t)[n]||Object.keys(_e({},e)).join("")!=r})?function(t,e){for(var n=w(t),r=arguments.length,i=1,o=me.f,u=ge.f;r>i;)for(var c,a=O(arguments[i++]),s=o?Lt(a).concat(o(a)):Lt(a),l=s.length,f=0;l>f;)u.call(a,c=s[f++])&&(n[c]=a[c]);return n}:_e;x(x.S+x.F,"Object",{assign:be});var Se=document,ke=function(){function t(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};ce(this,t),this.options=Object.assign({},r,n),this._events=[],this.dom={el:this._setElement(e)}}return se(t,[{key:"on",value:function(t,e){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:null;return(n||this.dom.el).addEventListener(t,e=e.bind(this),!0),this._events.push({name:t,fn:e,el:n}),this}},{key:"getElement",value:function(){return this.dom.el}},{key:"remove",value:function(){var t=this;this._events=this._events.filter(function(e){return(e.el||t.dom.el).removeEventListener(e.name,e.fn,!0)}),this.dom.el.parentNode.removeChild(this.dom.el),this.dom=this.options=null}},{key:"_setElement",value:function(t){if(!t&&!t.nodeType&&"string"!=typeof t)throw new Error("Wrong element type provided!");return t.nodeType?t:(this.options.parent||Se).querySelector(t)}},{key:"_trigger",value:function(t){var e,n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;"function"==typeof CustomEvent?e=new CustomEvent(t,{detail:n}):(e=Se.createEvent("Event")).initEvent(t,!0,!0),this.dom.el.dispatchEvent(e)}}]),t}(),xe={items:[],current:null,parent:null,maxHeight:0,proposal:"Add {X} to the list?",sort:!0,order:"desc",removalIcon:"×",placeHolder:"Type to search",onDelete:null,onCreate:null},Ee=document;return function(t){function e(t){var n,r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return ce(this,e),(n=pe(this,le(e).call(this,t,r,xe))).options.items=n._convertItems(r.items),n.current=r.current?n._convertItem(r.current):{},n.__found=null,n.options.sort&&n._sortItems(),n._renderInit(),n._bindEvents(),n}return function(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),e&&fe(t,e)}(e,ke),se(e,[{key:"_bindEvents",value:function(){var t=this,e=function(e){"Escape"!==e.key&&27!==e.keyCode&&t.dom.el.contains(e.target)||t.toggle(!1)};this.on("input",this._search),this.on("click",this._handleClick),this.on("keyup",this._handleKey),this.on("focusin",function(){return t._renderListItems().toggle(!0)},this.dom.input),this.on("keyup",e,Ee),this.on("click",e,Ee)}},{key:"onDelete",value:function(t){return this.options.onDelete=t,this}},{key:"onCreate",value:function(t){return this.options.onCreate=t,this}},{key:"toggle",value:function(){var t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return this.dom.el.firstElementChild.classList[t?"remove":"add"]("si-hide"),t||this.dom.input.blur(),this}},{key:"getItems",value:function(){return this.options.items}},{key:"getCurrent",value:function(){var t=Object.assign({},this.current);return delete t._lc,t}},{key:"clearCurrent",value:function(){this.current={},this.dom.input.value="",this._clearSelected()}},{key:"findItem",value:function(t){return t=t.nodeName?t.dataset.value:t,this.options.items.find(function(e){return e.value===t})}},{key:"_setCurrent",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;return this.current=t,this.dom.input.value=t.value.toString(),this._setSelected(t,e),this}},{key:"_setSelected",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;this._clearSelected(),(e=e||this.dom.list.querySelector('li[data-value="'.concat(t.value,'"]')))&&e.classList.add("si-current")}},{key:"_clearSelected",value:function(){var t=this.dom.list.querySelector(".si-current");t&&t.classList.remove("si-current")}},{key:"_convertItems",value:function(){var t=this;return(arguments.length>0&&void 0!==arguments[0]?arguments[0]:[]).map(function(e){return t._convertItem(e)})}},{key:"_convertItem",value:function(t){return(t="object"!==ue(t)?{value:t}:t)._lc=t.value.toString().toLowerCase(),t}},{key:"_renderInit",value:function(){var t=Ee.createElement("div");return t.className="si-wrap si-hide",this.dom.input=t.appendChild(this._renderInput()).firstChild,this.dom.list=t.appendChild(this._renderList()).firstChild,this.current.value&&(this.dom.input.value=this.current.value),this.dom.el.appendChild(t)}},{key:"_renderInput",value:function(){var t=Ee.createElement("div"),e=Ee.createElement("input");return t.className="si-input",e.type="text",e.autocomplete="false",e.spellcheck=!1,e.placeholder=this.options.placeHolder,t.appendChild(e),t}},{key:"_renderList",value:function(){var t=Ee.createElement("div"),e=Ee.createElement("ul"),n=this.options.maxHeight;return t.className="si-list",n&&(t.style.maxHeight=n+"px"),t.appendChild(e),t}},{key:"_createListItems",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:[],e="",n=this.current.value,r="",i=this._createRemovalButton();return t.forEach(function(t){r=n&&t.value===n?" si-current":"",e+='<li class="si-item'.concat(r,'" data-value="').concat(t.value,'">').concat(t.value).concat(i,"</li>")}),e}},{key:"_renderListItems",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:"";return this.dom.list.innerHTML=t||this._createListItems(this.options.items),this}},{key:"_createRemovalButton",value:function(){return'<button type="button" class="si-removal">'.concat(this.options.removalIcon,"</button>")}},{key:"_search",value:function(t){var e=null,n=t.target.value,r=n.toLowerCase(),i=this.options.items.filter(function(t){return-1!==t._lc.indexOf(r)}),o=this._createListItems(i),u=i[0],c=i.length;1===c&&u&&(e=u),(!u||c&&r&&r!==u._lc)&&(o+=this._proposeItem(n)),this.__found=e,this._renderListItems(o)}},{key:"_proposeItem",value:function(t){var e=this.options.proposal.replace("{X}","<span>".concat(t,"</span>"));return'<li class="si-item si-proposal" data-term="'.concat(t,'">').concat(e,"</li>")}},{key:"_handleClick",value:function(t){var e=t.target,n=e.classList;n.contains("si-proposal")?this._tryCreateItem(e.dataset.term)&&this.toggle()._trigger("created",this.current):n.contains("si-item")?this._setCurrent(this.findItem(e),e).toggle()._trigger("selected",this.current):n.contains("si-removal")&&(e=e.parentNode,this._fireCallback("onDelete",this.findItem(e))&&this._trigger("removed",this._sliceItem(e)))}},{key:"_fireCallback",value:function(t,e){return"function"!=typeof this.options[t]||this.options[t](e)}},{key:"_handleKey",value:function(t){var e,n=t.target.value,r=this.__found;n&&13!==t.keyCode&&"Enter"!==t.key||(!r&&n?e=this._tryCreateItem(n)?"created":null:r&&(e="selected",this._setCurrent(r)),e&&this.toggle()._trigger(e,this.current))}},{key:"_tryCreateItem",value:function(t){var e=this._convertItem(t.trim());return!(this.findItem(t)||!this._fireCallback("onCreate",e))&&(this._setCurrent(this._insertItem(e)),!0)}},{key:"_insertItem",value:function(t){return this.options.items.push(t),this.options.sort&&this._sortItems(),t}},{key:"_sortItems",value:function(){var t="desc"===this.options.order?1:-1;this.options.items.sort(function(e,n){return e._lc<n._lc?-t:e._lc>n._lc?t:0})}},{key:"_sliceItem",value:function(t){var e,n=this.options.items,r=t.dataset.value.toLowerCase(),i=this.current;return this.dom.list.removeChild(t),e=n.splice(n.findIndex(function(t){return t._lc===r}),1).shift(),i&&e._lc===i._lc&&this.clearCurrent(),e}}]),e}()}); | ||
| //# sourceMappingURL=select-input-umd.js.map |
| { | ||
| "name": "@dotburo/select-input", | ||
| "version": "1.0.0", | ||
| "version": "1.1.1", | ||
| "description": "Lightweight & dynamic select dropdown with an input field, without dependencies", | ||
@@ -8,4 +8,6 @@ "main": "dist/select-input-min.js", | ||
| "scripts": { | ||
| "build": "rollup -c && cleancss -o dist/base.min.css src/base.css", | ||
| "build": "rollup -c && npm run build:css && npm run copy:docs", | ||
| "build:css": "cleancss -o dist/base.min.css src/base.css", | ||
| "build:babel": "rollup --config rollup.config-babel.js", | ||
| "copy:docs": "cp ./dist/select-input-umd.js ./docs && cp ./dist/base.min.css ./docs", | ||
| "watch": "rollup -c -w" | ||
@@ -12,0 +14,0 @@ }, |
@@ -1,8 +0,8 @@ | ||
| # SelectInput  | ||
| # SelectInput  [](https://codeclimate.com/github/pecuchet/select-input/maintainability) | ||
| Minimal vanilla Javascript select box/dropdown with an input field. (ie11+) | ||
| Single-purpose select box/dropdown with an input field—without dependencies (ie11+). | ||
| <br> | ||
| [> demo](https://pecuchet.github.io/select-input/) | ||
| <a href="https://pecuchet.github.io/select-input/" target="_blank" rel="noopener">>_demo</a> | ||
| ## Installation | ||
| ## Install with [npm](https://www.npmjs.com/package/@dotburo/select-input) | ||
| ``` | ||
@@ -22,6 +22,7 @@ npm i -D @dotburo/select-input | ||
| // Listen to the selected event | ||
| selectInput.on('selected', e => { | ||
| console.log(e.detail); | ||
| }); | ||
| // Listen to events, add a callback and show the list | ||
| selectInput.on('selected', e => console.log(e.detail)) | ||
| .on('created', e => selectInput.getCurrent()) | ||
| .onDelete(item => window.confirm('Sure?')) | ||
| .toggle(true); | ||
| ``` | ||
@@ -31,12 +32,13 @@ | ||
| ``` | ||
| { | ||
| items: [], # Array of strings/numbers or of {value: String|Number} objects | ||
| current: null, # Item to select on instantiation | ||
| parent: null, # Parent element, to | ||
| maxHeight: 0, # Maximum height of the dropdown, `0` means no constraint | ||
| proposal: 'Add {X} to the list?', # Message to add an item to the list, {X} will be replaced | ||
| sort: true, # Whether to sort the list | ||
| order: 'desc', # Sort order | ||
| removalIcon: '×' # HTML for deletion button in each item li-element | ||
| } | ||
| items: [] # Array of strings/numbers or of {value: String|Number} objects | ||
| current: null # Item to select on instantiation | ||
| parent: null # Parent element, to | ||
| maxHeight: 0 # Maximum height of the dropdown, `0` means no constraint | ||
| proposal: 'Add {X} to the list?' # Message to add an item to the list, {X} will be replaced | ||
| sort: true # Whether to sort the list | ||
| order: 'desc' # Sort order | ||
| removalIcon: '×' # HTML for deletion button in each item li-element | ||
| placeHolder: 'Type to search' # Input field place holder | ||
| onDelete: null # Callable, fired before deleting an item; return `false` to prevent deletion | ||
| onCreate: null # Callable, fired before creatng an item; return `false` to prevent creation | ||
| ``` | ||
@@ -56,22 +58,28 @@ | ||
| ### instance.on(event, fn, el = null) | ||
| ### instance.on(event, fn, el = null): instance | ||
| Listen to events, pass in and event name (`String`), a subscriber (`Function`) and optionally and event target (`Element`). | ||
| If the latter is omitted, events are delegated to `instance.getElement()`. | ||
| ### instance.toggle(show = false) | ||
| ### instance.onDelete(fn): instance | ||
| Pass a function to be called before deleting an item. If the function returns false, the item will not be removed. | ||
| ### instance.onCreate(fn): instance | ||
| Pass a function to be called before creating an item. If the function returns false, the item will not be created. | ||
| ### instance.toggle(show = false): instance | ||
| Show or hide the list | ||
| ### instance.getElement() | ||
| ### instance.getElement(): HTMLElement | ||
| Return SelectInput's outermost element | ||
| ### instance.getItems() | ||
| ### instance.getItems(): array | ||
| Get all the items in the list as an array of objects | ||
| ### instance.getCurrent() | ||
| ### instance.getCurrent(): object | ||
| Return the currently selected item of the list | ||
| ### instance.findItem(value) | ||
| ### instance.findItem(value): object | ||
| Find an item in the list by its value (`String|Number`) | ||
| ### instance.remove() | ||
| ### instance.remove(): void | ||
| Unbind all events and clean up the DOM |
@@ -1,22 +0,10 @@ | ||
| const | ||
| d = document, | ||
| defaults = { | ||
| items: [], | ||
| current: null, | ||
| parent: null, | ||
| maxHeight: 0, | ||
| proposal: 'Add {X} to the list?', | ||
| sort: true, | ||
| order: 'desc', | ||
| removalIcon: '×' | ||
| }; | ||
| import DomHelper from "./dom-component.js"; | ||
| import defaults from "./defaults.js"; | ||
| export default class { | ||
| const d = document; | ||
| export default class SelectInput extends DomHelper { | ||
| constructor(element, options = {}) { | ||
| this.options = Object.assign({}, defaults, options); | ||
| super(element, options, defaults); | ||
| this.dom = { | ||
| el: this._setElement(element) | ||
| }; | ||
| this.options.items = this._convertItems(options.items); | ||
@@ -32,3 +20,2 @@ this.current = options.current ? this._convertItem(options.current) : {}; | ||
| this._events = []; | ||
| this._bindEvents(); | ||
@@ -38,3 +25,3 @@ } | ||
| /** | ||
| * Bind the (delegated) dom events | ||
| * Bind all (delegated) DOM events | ||
| * @private | ||
@@ -44,3 +31,3 @@ */ | ||
| let closeOnEvent = e => { | ||
| if ((e.key === 'Escape' || e.keyCode === 27) ||e.target.contains(this.dom.el)) { | ||
| if ((e.key === 'Escape' || e.keyCode === 27) || !this.dom.el.contains(e.target)) { | ||
| this.toggle(false) | ||
@@ -55,3 +42,3 @@ } | ||
| // close the list on `Escape` or on a click outside the component | ||
| // Close the list on `Escape` or on a click outside the main element | ||
| this.on('keyup', closeOnEvent, d); | ||
@@ -62,20 +49,25 @@ this.on('click', closeOnEvent, d); | ||
| /** | ||
| * Bind a delegated event | ||
| * @param {String} event | ||
| * Store the deletion callback | ||
| * @param {Function} fn | ||
| * @param {HTMLElement|Document} el | ||
| * @return SelectInput | ||
| */ | ||
| on(event, fn, el = null) { | ||
| fn = fn.bind(this); | ||
| (el || this.dom.el).addEventListener(event, fn, false); | ||
| this._events.push({ | ||
| name: event, | ||
| fn: fn, | ||
| el: el | ||
| }) | ||
| onDelete(fn) { | ||
| this.options.onDelete = fn; | ||
| return this; | ||
| } | ||
| /** | ||
| * Store the creation callback | ||
| * @param {Function} fn | ||
| * @return SelectInput | ||
| */ | ||
| onCreate(fn) { | ||
| this.options.onCreate = fn; | ||
| return this; | ||
| } | ||
| /** | ||
| * Show/hide the dropdown | ||
| * @param {Boolean} show | ||
| * @return DomHelper | ||
| */ | ||
@@ -85,13 +77,6 @@ toggle(show = false) { | ||
| if (!show) this.dom.input.blur(); | ||
| return this; | ||
| } | ||
| /** | ||
| * Return the main wrapping element | ||
| * @return {Element} | ||
| */ | ||
| getElement() { | ||
| return this.dom.el; | ||
| } | ||
| /** | ||
| * Get all items in the list | ||
@@ -106,3 +91,3 @@ * @return {Object[]} | ||
| * Return the current field value object | ||
| * @return {{}|null} | ||
| * @return {{value: String|Number}|null} | ||
| */ | ||
@@ -116,4 +101,15 @@ getCurrent() { | ||
| /** | ||
| * Clear the current value | ||
| * @return void | ||
| * @private | ||
| */ | ||
| clearCurrent() { | ||
| this.current = {}; | ||
| this.dom.input.value = ''; | ||
| this._clearSelected(); | ||
| } | ||
| /** | ||
| * Find an item in the list | ||
| * @param {HTMLElement|String|Number} value | ||
| * @param {EventTarget|HTMLElement|String|Number} value | ||
| * @return {{}} | ||
@@ -127,16 +123,6 @@ */ | ||
| /** | ||
| * Unbind all events and clear cached properties | ||
| * @return void | ||
| */ | ||
| remove() { | ||
| this._events = this._events.filter(event => (event.el || this.dom.el).removeEventListener(event.name, event.fn, false)); | ||
| this.dom.el.parentNode.removeChild(this.dom.el); | ||
| this.dom = null; | ||
| } | ||
| /** | ||
| * Set the current value of the field | ||
| * @param {HTMLElement|null} el | ||
| * @param {EventTarget|null} el | ||
| * @param {Object} item | ||
| * @return this | ||
| * @return SelectInput | ||
| * @private | ||
@@ -152,50 +138,5 @@ */ | ||
| /** | ||
| * Set the current value of the field | ||
| * @private | ||
| */ | ||
| _clearCurrent() { | ||
| this.current = {}; | ||
| this.dom.input.value = ''; | ||
| this._clearSelected(); | ||
| } | ||
| /** | ||
| * Communicate changes | ||
| * @param {String} name | ||
| * @param {Object} item | ||
| * @private | ||
| */ | ||
| _trigger(name, item = null) { | ||
| let event; | ||
| if (typeof CustomEvent === 'function') { | ||
| event = new CustomEvent(name, { | ||
| detail: (item || this.current) | ||
| }); | ||
| } else { | ||
| event = d.createEvent('Event'); | ||
| event.initEvent(name, true, true); | ||
| } | ||
| this.dom.el.dispatchEvent(event); | ||
| } | ||
| /** | ||
| * Query the element in the dom if its a string | ||
| * @param {Element|String} el | ||
| * @return {Element|null} | ||
| * @private | ||
| */ | ||
| _setElement(el) { | ||
| if (!el && !el.nodeType && typeof el !== 'string') { | ||
| throw new Error('Wrong element type provided!'); | ||
| } | ||
| if (el.nodeType) return el; | ||
| return (this.options.parent || d).querySelector(el); | ||
| } | ||
| /** | ||
| * Updated selected item in the html list | ||
| * @param {Object} item | ||
| * @param {HTMLElement|null} el | ||
| * @param {EventTarget|HTMLElement|null} el | ||
| * @private | ||
@@ -210,3 +151,3 @@ */ | ||
| /** | ||
| * Remove classname | ||
| * Remove the classname of current `<li>` | ||
| * @private | ||
@@ -220,3 +161,3 @@ */ | ||
| /** | ||
| * Make an array of object if needed | ||
| * Make an array of objects | ||
| * @param {Array} items | ||
@@ -231,5 +172,5 @@ * @return {Object[]} | ||
| /** | ||
| * Normalize an item to object | ||
| * @param {{value: String|Number, _lc: string|String} item | ||
| * @return {{value: String|Number, _lc: string}} | ||
| * Normalize an item as an usable object | ||
| * @param {String|Number|{value: String|Number, _lc: String}} item | ||
| * @return {{value: String|Number, _lc: String}} | ||
| * @private | ||
@@ -253,3 +194,3 @@ */ | ||
| this.dom.input = wrap.appendChild(this._renderInput()); | ||
| this.dom.input = wrap.appendChild(this._renderInput()).firstChild; | ||
| this.dom.list = wrap.appendChild(this._renderList()).firstChild; | ||
@@ -264,11 +205,15 @@ | ||
| * Create the input element | ||
| * @return {HTMLInputElement} | ||
| * @return {HTMLDivElement} | ||
| * @private | ||
| */ | ||
| _renderInput() { | ||
| let el = d.createElement('input'); | ||
| let wrap = d.createElement('div'), | ||
| el = d.createElement('input'); | ||
| wrap.className = 'si-input'; | ||
| el.type = 'text'; | ||
| el.autocomplete = 'false'; | ||
| el.spellcheck = false; | ||
| return el; | ||
| el.placeholder = this.options.placeHolder; | ||
| wrap.appendChild(el); | ||
| return wrap; | ||
| } | ||
@@ -316,3 +261,3 @@ | ||
| * @param html | ||
| * @return this | ||
| * @return SelectInput | ||
| * @private | ||
@@ -379,18 +324,24 @@ */ | ||
| _handleClick(e) { | ||
| let el = e.target; | ||
| let el = e.target, | ||
| classList = el.classList; | ||
| if (el.classList.contains('si-proposal')) { | ||
| this._setCurrent(this._createItem(el), el).toggle(); | ||
| this._trigger('created'); | ||
| if (classList.contains('si-proposal')) { | ||
| if (this._tryCreateItem(el.dataset.term)) { | ||
| this.toggle()._trigger('created', this.current); | ||
| } | ||
| return; | ||
| } | ||
| if (el.classList.contains('si-item')) { | ||
| this._setCurrent(this.findItem(el), el).toggle(); | ||
| this._trigger('selected'); | ||
| if (classList.contains('si-item')) { | ||
| this._setCurrent(this.findItem(el), el) | ||
| .toggle() | ||
| ._trigger('selected', this.current); | ||
| return; | ||
| } | ||
| if (el.classList.contains('si-removal')) { | ||
| this._trigger('removed', this._sliceItem(el.parentNode)); | ||
| if (classList.contains('si-removal')) { | ||
| el = el.parentNode; | ||
| if (this._fireCallback('onDelete', this.findItem(el))) { | ||
| this._trigger('removed', this._sliceItem(el)); | ||
| } | ||
| } | ||
@@ -400,3 +351,17 @@ } | ||
| /** | ||
| * Handle `Enter` | ||
| * The `onCreate` and `onDelete` callbacks allow to prevent their respective actions | ||
| * @param {String} name | ||
| * @param {Object} item | ||
| * @return {Boolean} | ||
| * @private | ||
| */ | ||
| _fireCallback(name, item) { | ||
| if (typeof this.options[name] === 'function') { | ||
| return this.options[name](item); | ||
| } | ||
| return true; | ||
| } | ||
| /** | ||
| * Handle `Enter` when there is a value in the field | ||
| * @param {KeyboardEvent} e | ||
@@ -407,14 +372,32 @@ * @private | ||
| let value = e.target.value, | ||
| item = this.__found, | ||
| event; | ||
| if (!!value && (e.keyCode !== 13 && e.key !== 'Enter')) { | ||
| return; | ||
| } | ||
| if (!item && value) { | ||
| event = this._tryCreateItem(value) ? 'created' : null; | ||
| } else if (item) { | ||
| event = 'selected'; | ||
| this._setCurrent(item); | ||
| } | ||
| if (value && (e.keyCode === 13 || e.which === 13 || e.key === 'Enter')) { | ||
| if (this.__found) { | ||
| this._setCurrent(this.__found); | ||
| } else { | ||
| this._setCurrent(this._createItem(value)); | ||
| event = 'created'; | ||
| } | ||
| this.toggle(); | ||
| this._trigger(event); | ||
| if (event) this.toggle()._trigger(event, this.current); | ||
| } | ||
| /** | ||
| * If the value doesn't exist and the callback returns true, create and set as current | ||
| * @param value | ||
| * @return {boolean} | ||
| * @private | ||
| */ | ||
| _tryCreateItem(value) { | ||
| let item = this._convertItem(value.trim()); | ||
| if (!this.findItem(value) && this._fireCallback('onCreate', item)) { | ||
| this._setCurrent(this._insertItem(item)); | ||
| return true; | ||
| } | ||
| return false; | ||
| } | ||
@@ -424,8 +407,7 @@ | ||
| * Insert a new item in the list | ||
| * @param {String|HTMLElement|Number} el | ||
| * @return {{value: String|Number, _lc: string}} | ||
| * @param {{value: String|Number, _lc: String}} item | ||
| * @return {{value: String|Number, _lc: String}} | ||
| * @private | ||
| */ | ||
| _createItem(el) { | ||
| let item = this._convertItem(el.nodeName ? el.dataset.term : el); | ||
| _insertItem(item) { | ||
| this.options.items.push(item); | ||
@@ -443,4 +425,4 @@ if (this.options.sort) this._sortItems(); | ||
| this.options.items.sort((a, b) => { | ||
| if (a.value < b.value) return -order; | ||
| if (a.value > b.value) return order; | ||
| if (a._lc < b._lc) return -order; | ||
| if (a._lc > b._lc) return order; | ||
| return 0; | ||
@@ -453,3 +435,3 @@ }); | ||
| * @param {HTMLElement|Node} el | ||
| * @return {{value: String|Number, _lc: string}} | ||
| * @return {{value: String|Number, _lc: String}} | ||
| * @private | ||
@@ -464,5 +446,5 @@ */ | ||
| item = items.splice(items.findIndex(item => item._lc === needle), 1).shift(); | ||
| if (current && item._lc === current._lc) this._clearCurrent(); | ||
| if (current && item._lc === current._lc) this.clearCurrent(); | ||
| return item; | ||
| } | ||
| } |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
No alert changes
Improved metrics
- Total package byte prevSize
- increased by19.87%
215512
- Number of package files
- increased by38.46%
18
- Lines of code
- increased by31.09%
759
- Number of lines in readme file
- increased by10.67%
83
No dependency changes