slim-select 2.0.0 → 2.0.2

package/docs/assets/index5.js

@@ -0,0 +1,11 @@
+import{d as n,S as f,_ as o,o as c,c as i,l as h,g as m,a as e,h as u,w as $,f as p}from"./index.js";const S=n({name:"SlimSelect",props:{settings:{type:Object}},data(){return{slim:null}},mounted(){let t={select:this.$refs.slim};this.settings&&(t.settings=this.settings),this.slim=new f(t)},beforeUnmount(){this.slim&&this.slim.destroy()}}),v={ref:"slim"};function g(t,r,a,l,_,d){return c(),i("select",v,[h(t.$slots,"default")],512)}const V=o(S,[["render",g]]),x=n({name:"Vue",components:{SlimSelect:V}}),w={id:"error",class:"content"},O=e("h2",{class:"header"},"Vue",-1),k={class:"row"},B=e("option",{value:"1"},"Option 1",-1),C=e("option",{value:"2"},"Option 2",-1),E=e("option",{value:"3"},"Option 3",-1),N=e("pre",null,[p("      "),e("code",{class:"language-javascript"},`
+        var select = new SlimSelect({
+          select: '#selectElement',
+          events: {
+            error: function(err) {
+              console.error(err)
+            }
+          }
+        })
+      `),p(`
+    `)],-1);function b(t,r,a,l,_,d){const s=m("SlimSelect");return c(),i("div",w,[O,e("div",k,[u(s,null,{default:$(()=>[B,C,E]),_:1})]),N])}const j=o(x,[["render",b]]),y=n({name:"Events",components:{Vue:j}}),T={id:"frameworks",class:"contents"};function U(t,r,a,l,_,d){const s=m("Vue");return c(),i("div",T,[u(s)])}const z=o(y,[["render",U]]);export{z as default};

package/docs/assets/install.js

@@ -1,6 +1,6 @@
-import{e as N,d as $,_ as O,o as V,c as I,a as n,f as L,t as R,b as M}from"./index.js";var U={exports:{}};(function(d,y){(function(w,g){d.exports=g()})(N,function(){return function w(g,j,_){var o=window,p="application/octet-stream",c=_||p,e=g,a=!j&&!_&&e,s=document.createElement("a"),k=function(t){return String(t)},i=o.Blob||o.MozBlob||o.WebKitBlob||k,m=j||"download",l,S;if(i=i.call?i.bind(o):Blob,String(this)==="true"&&(e=[e,c],c=e[0],e=e[1]),a&&a.length<2048&&(m=a.split("/").pop().split("?")[0],s.href=a,s.href.indexOf(a)!==-1)){var u=new XMLHttpRequest;return u.open("GET",a,!0),u.responseType="blob",u.onload=function(t){w(t.target.response,m,p)},setTimeout(function(){u.send()},0),u}if(/^data:([\w+-]+\/[\w+.-]+)?[,;]/.test(e))if(e.length>1024*1024*1.999&&i!==k)e=B(e),c=e.type||p;else return navigator.msSaveBlob?navigator.msSaveBlob(B(e),m):f(e);else if(/([\x80-\xff])/.test(e)){var b=0,x=new Uint8Array(e.length),A=x.length;for(b;b<A;++b)x[b]=e.charCodeAt(b);e=new i([x],{type:c})}l=e instanceof i?e:new i([e],{type:c});function B(t){var r=t.split(/[:;,]/),h=r[1],E=r[2]=="base64"?atob:decodeURIComponent,C=E(r.pop()),T=C.length,v=0,D=new Uint8Array(T);for(v;v<T;++v)D[v]=C.charCodeAt(v);return new i([D],{type:h})}function f(t,r){if("download"in s)return s.href=t,s.setAttribute("download",m),s.className="download-js-link",s.innerHTML="downloading...",s.style.display="none",document.body.appendChild(s),setTimeout(function(){s.click(),document.body.removeChild(s),r===!0&&setTimeout(function(){o.URL.revokeObjectURL(s.href)},250)},66),!0;if(/(Version)\/(\d+)\.(\d+)(?:\.(\d+))?.*Safari\//.test(navigator.userAgent))return/^data:/.test(t)&&(t="data:"+t.replace(/^data:([\w\/\-\+]+)/,p)),window.open(t)||confirm(`Displaying New Document
+import{e as M,d as $,_ as I,o as O,c as V,a as o,f as B,t as E,b as L}from"./index.js";var R={exports:{}};(function(d,w){(function(y,v){d.exports=v()})(M,function(){return function y(v,j,k){var n=window,m="application/octet-stream",r=k||m,e=v,c=!j&&!k&&e,t=document.createElement("a"),_=function(s){return String(s)},i=n.Blob||n.MozBlob||n.WebKitBlob||_,p=j||"download",l,S;if(i=i.call?i.bind(n):Blob,String(this)==="true"&&(e=[e,r],r=e[0],e=e[1]),c&&c.length<2048&&(p=c.split("/").pop().split("?")[0],t.href=c,t.href.indexOf(c)!==-1)){var u=new XMLHttpRequest;return u.open("GET",c,!0),u.responseType="blob",u.onload=function(s){y(s.target.response,p,m)},setTimeout(function(){u.send()},0),u}if(/^data:([\w+-]+\/[\w+.-]+)?[,;]/.test(e))if(e.length>1024*1024*1.999&&i!==_)e=x(e),r=e.type||m;else return navigator.msSaveBlob?navigator.msSaveBlob(x(e),p):f(e);else if(/([\x80-\xff])/.test(e)){var b=0,C=new Uint8Array(e.length),N=C.length;for(b;b<N;++b)C[b]=e.charCodeAt(b);e=new i([C],{type:r})}l=e instanceof i?e:new i([e],{type:r});function x(s){var a=s.split(/[:;,]/),h=a[1],A=a[2]=="base64"?atob:decodeURIComponent,D=A(a.pop()),U=D.length,g=0,T=new Uint8Array(U);for(g;g<U;++g)T[g]=D.charCodeAt(g);return new i([T],{type:h})}function f(s,a){if("download"in t)return t.href=s,t.setAttribute("download",p),t.className="download-js-link",t.innerHTML="downloading...",t.style.display="none",document.body.appendChild(t),setTimeout(function(){t.click(),document.body.removeChild(t),a===!0&&setTimeout(function(){n.URL.revokeObjectURL(t.href)},250)},66),!0;if(/(Version)\/(\d+)\.(\d+)(?:\.(\d+))?.*Safari\//.test(navigator.userAgent))return/^data:/.test(s)&&(s="data:"+s.replace(/^data:([\w\/\-\+]+)/,m)),window.open(s)||confirm(`Displaying New Document
 
-Use Save As... to download, then click back to return to this page.`)&&(location.href=t),!0;var h=document.createElement("iframe");document.body.appendChild(h),!r&&/^data:/.test(t)&&(t="data:"+t.replace(/^data:([\w\/\-\+]+)/,p)),h.src=t,setTimeout(function(){document.body.removeChild(h)},333)}if(navigator.msSaveBlob)return navigator.msSaveBlob(l,m);if(o.URL)f(o.URL.createObjectURL(l),!0);else{if(typeof l=="string"||l.constructor===k)try{return f("data:"+c+";base64,"+o.btoa(l))}catch{return f("data:"+c+","+encodeURIComponent(l))}S=new FileReader,S.onload=function(t){f(this.result)},S.readAsDataURL(l)}return!0}})})(U);const H=U.exports,G="slim-select",q="Slim advanced select dropdown",z="1.27.1",J="Brian Voelker <brian@webiswhatido.com> (http://webiswhatido.com)",K="https://slimselectjs.com",W="MIT",X={url:"https://github.com/brianvoe/slim-select/issues"},F="dist/slimselect.min.js",P="dist/slimselect.esm.js",Q="dist/slimselect.min.js",Y="dist/index.d.ts",Z="dist/index.d.ts",ee="dist/slimselect.min.css",te="src/slim-select/slimselect.scss",se={type:"git",url:"git+https://github.com/brianvoe/slim-select.git"},ne=["select","vanilla","dropdown","search","multiselect"],oe={jestinit:"ts-jest config:init",dev:"vite --port=1111",format:'prettier --write --cache --parser typescript "src/**/*.ts"',build:"npm run build:clean && npm run build:docs && npm run build:library","build:clean":"rimraf ./dist/*","build:docs":"vite build","build:library":"npm run build:library:js && npm run build:library:css","build:library:js":"cd src/slim-select && rollup --config ./rollup.config.mjs && cd ../../","build:library:css":"cd src/slim-select && sass ./slimselect.scss ../../dist/slimselect.css --style=compressed && cd ../../",test:"jest"},ie={"@jest/globals":"^29.3.1","@rollup/plugin-typescript":"^9.0.2","@types/downloadjs":"^1.4.3","@vitejs/plugin-vue":"^3.2.0",clipboard:"^2.0.11",downloadjs:"^1.4.7",jest:"^29.3.1","jest-environment-jsdom":"^29.3.1",prettier:"^2.7.1",prismjs:"^1.29.0",rimraf:"^3.0.2",rollup:"^2.79.1","rollup-plugin-terser":"^7.0.2",sass:"^1.56.1","ts-jest":"^29.0.3",tslib:"^2.4.1",typescript:"^4.9.3",vite:"^3.2.4",vue:"^3.2.45","vue-router":"^4.1.6","vue-tsc":"^1.0.9",vuex:"^4.0.2"},le={name:G,description:q,version:z,author:J,homepage:K,license:W,bugs:X,main:F,module:P,unpkg:Q,types:Y,typings:Z,style:ee,sass:te,repository:se,keywords:ne,scripts:oe,devDependencies:ie},ce=$({name:"Install",data:()=>({version:le.version}),methods:{downloadLink(){H(`https://cdnjs.cloudflare.com/ajax/libs/slim-select/${this.version}/slimselect.min.js`)}}}),ae={id:"install",class:"contents"},re=M(`<div id="npm" class="content"><h2>Npm</h2><p>Most common usage is npm</p><pre class="install-code">        <code class="language-bash">
+Use Save As... to download, then click back to return to this page.`)&&(location.href=s),!0;var h=document.createElement("iframe");document.body.appendChild(h),!a&&/^data:/.test(s)&&(s="data:"+s.replace(/^data:([\w\/\-\+]+)/,m)),h.src=s,setTimeout(function(){document.body.removeChild(h)},333)}if(navigator.msSaveBlob)return navigator.msSaveBlob(l,p);if(n.URL)f(n.URL.createObjectURL(l),!0);else{if(typeof l=="string"||l.constructor===_)try{return f("data:"+r+";base64,"+n.btoa(l))}catch{return f("data:"+r+","+encodeURIComponent(l))}S=new FileReader,S.onload=function(s){f(this.result)},S.readAsDataURL(l)}return!0}})})(R);const H=R.exports,G="slim-select",J="Slim advanced select dropdown",q="2.0.1",z="Brian Voelker <brian@webiswhatido.com> (http://webiswhatido.com)",F="https://slimselectjs.com",K="MIT",W={url:"https://github.com/brianvoe/slim-select/issues"},X="dist/slimselect.cjs.js",P="dist/slimselect.umd.js",Q="dist/slimselect.es.js",Y="dist/slimselect.umd.min.js",Z="dist/index.d.ts",ee="dist/index.d.ts",se="dist/slimselect.css",te="src/slim-select/slimselect.scss",ne={type:"git",url:"git+https://github.com/brianvoe/slim-select.git"},oe=["select","vanilla","dropdown","search","multiselect"],ie={dev:"vite --port=1111",format:'prettier --write --cache --parser typescript "src/**/*.ts"',build:"npm run build:clean && npm run build:docs && npm run build:library","build:clean":"rimraf ./dist/*","build:docs":"vite build","build:library":"npm run build:library:js && npm run build:library:css","build:library:js":"cd src/slim-select && rollup --config ./rollup.config.mjs && cd ../../","build:library:css":"cd src/slim-select && sass ./slimselect.scss ../../dist/slimselect.css --style=compressed && cd ../../",test:"jest"},le={"@jest/globals":"^29.3.1","@rollup/plugin-babel":"^6.0.2","@rollup/plugin-commonjs":"^23.0.2","@rollup/plugin-node-resolve":"^15.0.1","@rollup/plugin-terser":"^0.1.0","@rollup/plugin-typescript":"^9.0.2","@types/downloadjs":"^1.4.3","@vitejs/plugin-vue":"^3.2.0",clipboard:"^2.0.11",downloadjs:"^1.4.7",jest:"^29.3.1","jest-environment-jsdom":"^29.3.1",prettier:"^2.7.1",prismjs:"^1.29.0",rimraf:"^3.0.2",rollup:"^2.79.1",sass:"^1.56.1","ts-jest":"^29.0.3",tslib:"^2.4.1",typescript:"^4.9.3",vite:"^3.2.4",vue:"^3.2.45","vue-router":"^4.1.6","vue-tsc":"^1.0.9",vuex:"^4.0.2"},re={name:G,description:J,version:q,author:z,homepage:F,license:K,bugs:W,main:X,browser:P,module:Q,unpkg:Y,types:Z,typings:ee,style:se,sass:te,repository:ne,keywords:oe,scripts:ie,devDependencies:le},ce=$({name:"Install",data:()=>({version:re.version}),methods:{downloadLink(){H(`https://cdnjs.cloudflare.com/ajax/libs/slim-select/${this.version}/slimselect.min.js`)}}}),ae={id:"install",class:"contents"},de=L(`<div id="npm" class="content"><h2>Npm</h2><p>Most common usage is npm</p><pre class="install-code">        <code class="language-bash">
           npm install slim-select
         </code>
       </pre><pre class="example-code">        <code class="language-javascript">
@@ -10,11 +10,11 @@ Use Save As... to download, then click back to return to this page.`)&&(location
             select: &#39;#selectElement&#39;
           })
         </code>
-      </pre></div>`,1),de={id:"cdn",class:"content"},pe=n("h2",null,"Cdn",-1),me=n("p",null,"Cdn has a url link you can grab.",-1),ue=n("div",{class:"alert info"},"New releases may be delayed until the next time its indexed",-1),be={class:"install-code"},fe={class:"language-html"},he={id:"download",class:"content"},ve=n("h2",null,"Download",-1),ge=n("p",null,"Download the latest minified version of slim select",-1);function ye(d,y,w,g,j,_){return V(),I("div",ae,[re,n("div",de,[pe,me,ue,n("pre",be,[L("        "),n("code",fe,`
+      </pre></div>`,1),me={id:"cdn",class:"content"},pe=L('<h2>Cdn</h2><p> Cdn has a url link you can grab. Cdn exists on both <a target="_blank" href="https://cdnjs.com">cdnjs.com</a> and <a target="_blank" href="https://unpkg.com">unpkg.com</a></p><p> See full list of available options.<br><strong>cdnjs</strong> - <a target="_blank" href="https://cdnjs.com/libraries/slim-select">cdnjs.com/libraries/slim-select</a><br><strong>unpkg</strong> - <a target="_blank" href="https://unpkg.com/browse/slim-select/dist/">https://unpkg.com/browse/slim-select/dist/</a></p><ul><li>slimselct.js - UMD unminified</li><li>slimselct.min.js - UMD minified</li><li>slimselect.cjs.js - CommonJS (for Node) and ES module (for bundlers) build</li><li>slimselect.umd.js - UMD build for browsers</li><li>slimselect.es.js - ES module build for modern browsers</li><li>slimselect.global.js - IIFE build for modern browsers</li></ul><div class="alert info">New releases may be delayed until the next time its indexed</div>',5),ue={class:"install-code"},be={class:"language-html"},fe={id:"download",class:"content"},he=o("h2",null,"Download",-1),ge=o("p",null,"Download the latest minified umd version of slim select",-1),ve=o("p",null,[B(" See full list of available downloadable options. "),o("a",{target:"_blank",href:"https://cdnjs.com/libraries/slim-select"},"cdnjs.com/libraries/slim-select")],-1);function we(d,w,y,v,j,k){return O(),V("div",ae,[de,o("div",me,[pe,o("pre",ue,[B("        "),o("code",be,`
           <html>
             <head>
-              <script src="https://cdnjs.cloudflare.com/ajax/libs/slim-select/`+R(d.version)+`/slimselect.min.js"><\/script>
-              <link href="https://cdnjs.cloudflare.com/ajax/libs/slim-select/`+R(d.version)+`/slimselect.min.css" rel="stylesheet"></link>
+              <script src="unpkg.com/slim-select@`+E(d.version)+`/dist/slimselect.min.js"><\/script>
+              <link href="unpkg.com/slim-select@`+E(d.version)+`/dist/slimselect.css" rel="stylesheet"></link>
               
               <script>
                 new SlimSelect({
@@ -30,5 +30,5 @@ Use Save As... to download, then click back to return to this page.`)&&(location
               </select>
             </body>
           </html>
-        `,1),L(`
-      `)])]),n("div",he,[ve,ge,n("div",{class:"btn",onClick:y[0]||(y[0]=o=>d.downloadLink())},"Click Here To Download")])])}const je=O(ce,[["render",ye]]);export{je as default};
+        `,1),B(`
+      `)])]),o("div",fe,[he,ge,ve,o("div",{class:"btn",onClick:w[0]||(w[0]=n=>d.downloadLink())},"Click Here To Download")])])}const je=I(ce,[["render",we]]);export{je as default};

package/docs/index.html

@@ -5,14 +5,32 @@
     <link rel="icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Slim Select</title>
+    <meta name="description" content="Advanced select dropdown" />
+    <meta property="og:type" content="article" />
+    <meta property="og:title" content="Slim Select" />
+    <meta property="og:description" content="Advanced select dropdown" />
     <script type="module" crossorigin src="/assets/index.js"></script>
     <link rel="stylesheet" href="/assets/index.css">
   </head>
   <body>
     <noscript>
-      <strong>We're sorry but this site doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+      <strong
+        >We're sorry but this site doesn't work properly without JavaScript enabled. Please enable it to
+        continue.</strong
+      >
     </noscript>
     <div id="app"></div>
     
+    <!-- Google tag (gtag.js) -->
+    <script async src="https://www.googletagmanager.com/gtag/js?id=G-14PMXQVXTC"></script>
+    <script>
+      window.dataLayer = window.dataLayer || []
+      function gtag() {
+        dataLayer.push(arguments)
+      }
+      gtag('js', new Date())
+
+      gtag('config', 'G-14PMXQVXTC')
+    </script>
   </body>
-</html>
+</html>

package/index.html

@@ -5,12 +5,30 @@
     <link rel="icon" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Slim Select</title>
+    <meta name="description" content="Advanced select dropdown" />
+    <meta property="og:type" content="article" />
+    <meta property="og:title" content="Slim Select" />
+    <meta property="og:description" content="Advanced select dropdown" />
   </head>
   <body>
     <noscript>
-      <strong>We're sorry but this site doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+      <strong
+        >We're sorry but this site doesn't work properly without JavaScript enabled. Please enable it to
+        continue.</strong
+      >
     </noscript>
     <div id="app"></div>
     <script type="module" src="/src/docs/main.ts"></script>
+    <!-- Google tag (gtag.js) -->
+    <script async src="https://www.googletagmanager.com/gtag/js?id=G-14PMXQVXTC"></script>
+    <script>
+      window.dataLayer = window.dataLayer || []
+      function gtag() {
+        dataLayer.push(arguments)
+      }
+      gtag('js', new Date())
+
+      gtag('config', 'G-14PMXQVXTC')
+    </script>
   </body>
-</html>
+</html>

package/package.json

@@ -1,16 +1,17 @@
 {
   "name": "slim-select",
   "description": "Slim advanced select dropdown",
-  "version": "2.0.0",
+  "version": "2.0.2",
   "author": "Brian Voelker <brian@webiswhatido.com> (http://webiswhatido.com)",
   "homepage": "https://slimselectjs.com",
   "license": "MIT",
   "bugs": {
     "url": "https://github.com/brianvoe/slim-select/issues"
   },
-  "main": "dist/slimselect.js",
+  "main": "dist/slimselect.cjs.js",
+  "browser": "dist/slimselect.umd.js",
   "module": "dist/slimselect.es.js",
-  "unpkg": "dist/slimselect.js",
+  "unpkg": "dist/slimselect.umd.min.js",
   "types": "dist/index.d.ts",
   "typings": "dist/index.d.ts",
   "style": "dist/slimselect.css",
@@ -27,7 +28,6 @@
     "multiselect"
   ],
   "scripts": {
-    "jestinit": "ts-jest config:init",
     "dev": "vite --port=1111",
     "format": "prettier --write --cache --parser typescript \"src/**/*.ts\"",
     "build": "npm run build:clean && npm run build:docs && npm run build:library",
@@ -40,6 +40,10 @@
   },
   "devDependencies": {
     "@jest/globals": "^29.3.1",
+    "@rollup/plugin-babel": "^6.0.2",
+    "@rollup/plugin-commonjs": "^23.0.2",
+    "@rollup/plugin-node-resolve": "^15.0.1",
+    "@rollup/plugin-terser": "^0.1.0",
     "@rollup/plugin-typescript": "^9.0.2",
     "@types/downloadjs": "^1.4.3",
     "@vitejs/plugin-vue": "^3.2.0",
@@ -51,7 +55,6 @@
     "prismjs": "^1.29.0",
     "rimraf": "^3.0.2",
     "rollup": "^2.79.1",
-    "rollup-plugin-terser": "^7.0.2",
     "sass": "^1.56.1",
     "ts-jest": "^29.0.3",
     "tslib": "^2.4.1",

package/public/404.html

@@ -1,8 +1,8 @@
 <!DOCTYPE html>
 <html>
   <head>
-    <meta charset="utf-8">
-    <title>Single Page Apps for GitHub Pages</title>
+    <meta charset="utf-8" />
+    <title>Slim Select</title>
     <script type="text/javascript">
       // Single Page Apps for GitHub Pages
       // https://github.com/rafrex/spa-github-pages
@@ -20,17 +20,23 @@
       // https://username.github.io/repo-name/one/two?a=b&c=d#qwe becomes
       // https://username.github.io/repo-name/?p=/one/two&q=a=b~and~c=d#qwe
       // Otherwise, leave pathPrefix as false.
-      var pathPrefix = false;
-      var l = window.location;
+      var pathPrefix = false
+      var l = window.location
       l.replace(
-        l.protocol + '//' + l.hostname + (l.port ? ':' + l.port : '') +
-        l.pathname.split('/').slice(0, 2 * pathPrefix).join('/') + '/?p=/' +
-        l.pathname.slice(1).split('/').slice(pathPrefix).join('/').replace(/&/g, '~and~') +
-        (l.search ? '&q=' + l.search.slice(1).replace(/&/g, '~and~') : '') +
-        l.hash
-      );
+        l.protocol +
+          '//' +
+          l.hostname +
+          (l.port ? ':' + l.port : '') +
+          l.pathname
+            .split('/')
+            .slice(0, 2 * pathPrefix)
+            .join('/') +
+          '/?p=/' +
+          l.pathname.slice(1).split('/').slice(pathPrefix).join('/').replace(/&/g, '~and~') +
+          (l.search ? '&q=' + l.search.slice(1).replace(/&/g, '~and~') : '') +
+          l.hash,
+      )
     </script>
   </head>
-  <body>
-  </body>
+  <body></body>
 </html>

package/src/docs/app.vue

@@ -1,7 +1,9 @@
 <script lang="ts">
 import { defineComponent } from 'vue'
 
-import SlimSelect, { debounce, Settings } from '../slim-select'
+import SlimSelect from '../slim-select'
+import Settings from '../slim-select/settings'
+import { debounce } from '../slim-select/helpers'
 
 export default defineComponent({
   name: 'App',
@@ -75,6 +77,10 @@ export default defineComponent({
         { text: 'enableDisable', value: 'methods#enableDisable', class: 'mar-l-l' },
         { text: 'search', value: 'methods#search', class: 'mar-l-l' },
         { text: 'destroy', value: 'methods#destroy', class: 'mar-l-l' },
+
+        // Frameworks
+        // { text: 'Frameworks', value: 'frameworks', class: 'label' },
+        // { text: 'vue', value: 'frameworks#vue', class: 'mar-l-l' },
       ],
     }
   },
@@ -88,6 +94,18 @@ export default defineComponent({
     })
 
     this.$router.afterEach(() => {
+      if (this.$route.query.p) {
+        // Delay router push to allow for
+        // other things to happen first
+        setTimeout(() => {
+          if (this.$route.query.p) {
+            this.$router.push({ path: this.$route.query.p.toString(), hash: this.$route.hash })
+          }
+        }, 200)
+
+        return
+      }
+
       // After route change get the hash and scroll to element in main
       setTimeout(() => {
         const hash = this.$route.hash
@@ -113,7 +131,7 @@ export default defineComponent({
             })
           }
         }
-      }, 100)
+      }, 200)
     })
 
     this.setDemensions()
@@ -121,6 +139,8 @@ export default defineComponent({
   },
   unmounted() {
     window.removeEventListener('resize', this.navDebounce)
+
+    this.nav?.destroy()
   },
   watch: {
     width() {
@@ -172,7 +192,7 @@ export default defineComponent({
   <header>
     <div class="top">
       <div class="text">
-        <h1 class="logo">Slim Select</h1>
+        <h1 class="logo">Slim Select <small>2.0</small></h1>
       </div>
       <div class="socials">
         <a href="https://github.com/brianvoe/slim-select" target="_blank">

package/src/docs/assets/scss/_variables.scss

@@ -10,7 +10,7 @@
   --color-alert-info-border: #b6d4fe;
 
   // Sizes
-  --width-max: 1200px;
+  --width-max: 1000px;
   --height-header: 90px;
   --width-nav: 200px;
   --height-nav: 30px;

package/src/docs/pages/frameworks/index.vue

@@ -0,0 +1,18 @@
+<script lang="ts">
+import { defineComponent } from 'vue'
+
+import Vue from './vue.vue'
+
+export default defineComponent({
+  name: 'Events',
+  components: {
+    Vue,
+  },
+})
+</script>
+
+<template>
+  <div id="frameworks" class="contents">
+    <Vue />
+  </div>
+</template>

package/src/docs/pages/frameworks/vue.vue

@@ -0,0 +1,39 @@
+<script lang="ts">
+import { defineComponent } from 'vue'
+
+import SlimSelect from '../../../vue/slimselect.vue'
+
+export default defineComponent({
+  name: 'Vue',
+  components: {
+    SlimSelect,
+  },
+})
+</script>
+
+<template>
+  <div id="error" class="content">
+    <h2 class="header">Vue</h2>
+
+    <div class="row">
+      <SlimSelect>
+        <option value="1">Option 1</option>
+        <option value="2">Option 2</option>
+        <option value="3">Option 3</option>
+      </SlimSelect>
+    </div>
+
+    <pre>
+      <code class="language-javascript">
+        var select = new SlimSelect({
+          select: '#selectElement',
+          events: {
+            error: function(err) {
+              console.error(err)
+            }
+          }
+        })
+      </code>
+    </pre>
+  </div>
+</template>

package/src/docs/pages/home.vue

@@ -5,44 +5,78 @@ import SlimSelect from '../../slim-select'
 
 export default defineComponent({
   name: 'Home',
+  data() {
+    return {
+      single: null as SlimSelect | null,
+      multiple: null as SlimSelect | null,
+    }
+  },
   mounted() {
-    const single = new SlimSelect({
+    this.single = new SlimSelect({
       select: this.$refs.slimSingle as HTMLSelectElement,
     })
-    const multiple = new SlimSelect({
+    this.multiple = new SlimSelect({
       select: this.$refs.slimMulti as HTMLSelectElement,
     })
 
     setTimeout(() => {
-      single.open()
+      if (this.single) {
+        this.single.open()
+      }
       setTimeout(() => {
-        single.setSelected('best')
+        if (this.single) {
+          this.single.setSelected('best')
+        }
       }, 500)
       setTimeout(() => {
-        single.setSelected('select')
+        if (this.single) {
+          this.single.setSelected('select')
+        }
       }, 1000)
       setTimeout(() => {
-        single.setSelected('ever')
+        if (this.single) {
+          this.single.setSelected('ever')
+        }
       }, 1500)
       setTimeout(() => {
-        single.close()
+        if (this.single) {
+          this.single.close()
+        }
       }, 2000)
 
-      multiple.open()
+      if (this.multiple) {
+        this.multiple.open()
+      }
       setTimeout(() => {
-        multiple.setSelected(['best'])
+        if (this.multiple) {
+          this.multiple.setSelected(['best'])
+        }
       }, 500)
       setTimeout(() => {
-        multiple.setSelected(['best', 'select'])
+        if (this.multiple) {
+          this.multiple.setSelected(['best', 'select'])
+        }
       }, 1000)
       setTimeout(() => {
-        multiple.setSelected(['best', 'select', 'ever'])
+        if (this.multiple) {
+          this.multiple.setSelected(['best', 'select', 'ever'])
+        }
       }, 1500)
       setTimeout(() => {
-        multiple.close()
+        if (this.multiple) {
+          this.multiple.close()
+        }
       }, 2000)
     }, 500)
   },
+  unmounted() {
+    if (this.single) {
+      this.single.destroy()
+    }
+    if (this.multiple) {
+      this.multiple.destroy()
+    }
+  },
 })
 </script>
 

package/src/docs/pages/install.vue

@@ -43,15 +43,36 @@ export default defineComponent({
 
     <div id="cdn" class="content">
       <h2>Cdn</h2>
-      <p>Cdn has a url link you can grab.</p>
+      <p>
+        Cdn has a url link you can grab. Cdn exists on both
+        <a target="_blank" href="https://cdnjs.com">cdnjs.com</a> and
+        <a target="_blank" href="https://unpkg.com">unpkg.com</a>
+      </p>
+      <p>
+        See full list of available options.<br />
+        <strong>cdnjs</strong> -
+        <a target="_blank" href="https://cdnjs.com/libraries/slim-select">cdnjs.com/libraries/slim-select</a><br />
+        <strong>unpkg</strong> -
+        <a target="_blank" href="https://unpkg.com/browse/slim-select/dist/"
+          >https://unpkg.com/browse/slim-select/dist/</a
+        >
+      </p>
+      <ul>
+        <li>slimselct.js - UMD unminified</li>
+        <li>slimselct.min.js - UMD minified</li>
+        <li>slimselect.cjs.js - CommonJS (for Node) and ES module (for bundlers) build</li>
+        <li>slimselect.umd.js - UMD build for browsers</li>
+        <li>slimselect.es.js - ES module build for modern browsers</li>
+        <li>slimselect.global.js - IIFE build for modern browsers</li>
+      </ul>
       <div class="alert info">New releases may be delayed until the next time its indexed</div>
 
       <pre class="install-code">
         <code class="language-html">
           &lt;html&gt;
             &lt;head&gt;
-              &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/slim-select/{{version}}/slimselect.min.js"&gt;&lt;/script&gt;
-              &lt;link href="https://cdnjs.cloudflare.com/ajax/libs/slim-select/{{version}}/slimselect.min.css" rel="stylesheet"&gt;&lt;/link&gt;
+              &lt;script src="unpkg.com/slim-select@{{version}}/dist/slimselect.min.js"&gt;&lt;/script&gt;
+              &lt;link href="unpkg.com/slim-select@{{version}}/dist/slimselect.css" rel="stylesheet"&gt;&lt;/link&gt;
               
               &lt;script&gt;
                 new SlimSelect({
@@ -73,7 +94,11 @@ export default defineComponent({
 
     <div id="download" class="content">
       <h2>Download</h2>
-      <p>Download the latest minified version of slim select</p>
+      <p>Download the latest minified umd version of slim select</p>
+      <p>
+        See full list of available downloadable options.
+        <a target="_blank" href="https://cdnjs.com/libraries/slim-select">cdnjs.com/libraries/slim-select</a>
+      </p>
       <div class="btn" @click="downloadLink()">Click Here To Download</div>
     </div>
   </div>

package/src/docs/router.ts

@@ -39,6 +39,11 @@ const router = createRouter({
       name: 'Methods',
       component: () => import('./pages/methods/index.vue'),
     },
+    {
+      path: '/frameworks',
+      name: 'Frameworks',
+      component: () => import('./pages/frameworks/index.vue'),
+    },
   ],
 })
 

package/src/slim-select/index.ts

@@ -1,19 +1,9 @@
-import { debounce, hasClassInTree } from './helper'
+import { debounce, hasClassInTree } from './helpers'
 import Render from './render'
 import Select from './select'
 import Settings, { SettingsPartial } from './settings'
 import Store, { DataArray, DataArrayPartial, Option, OptionOptional } from './store'
 
-// Export everything except the "export default"
-export * from './helper'
-export * from './settings'
-export * from './select'
-export * from './store'
-export * from './render'
-
-// Export all "export defaults"
-export { Settings, Select, Store, Render }
-
 export interface Config {
   select: string | Element
   data?: DataArrayPartial

package/src/slim-select/render.ts

@@ -1,4 +1,4 @@
-import { debounce } from './helper'
+import { debounce } from './helpers'
 import Settings from './settings'
 import Store, { DataArray, Optgroup, Option, OptionOptional } from './store'