slim-select 2.2.0 → 2.2.2

package/docs/assets/index4.js

@@ -1,60 +0,0 @@
-import{d as u,S as i,_ as r,o,c as a,a as e,f as l,t as $,i as g,e as y,r as c,b as d,w}from"./index.js";const M=u({name:"GetSelected",data(){return{selectedSingle:null,selectedSingleValue:[],selectedMultiple:null,selectedMultipleValue:[]}},mounted(){this.selectedSingle=new i({select:this.$refs.selectedSingle}),this.selectedMultiple=new i({select:this.$refs.selectedMultiple})},methods:{getSelected(){this.selectedSingleValue=this.selectedSingle.getSelected(),this.selectedMultipleValue=this.selectedMultiple.getSelected()}}}),E={id:"getSelected",class:"content"},k=e("h2",{class:"header"},"getSelected",-1),O=e("p",null,"The getSelected method will return an array of the currently selected value strings.",-1),C=e("div",{class:"alert info"}," Whether or not its a single or multiple select, getSelected will always return an array. ",-1),G={class:"row"},T={ref:"selectedSingle"},j=e("option",{value:"value1"},"Value 1",-1),N=e("option",{value:"value2"},"Value 2",-1),B=e("option",{value:"value3"},"Value 3",-1),W=[j,N,B],I={key:0,class:"pad-t-m pad-b-m"},A=e("b",null,"Single Select Value:",-1),J={ref:"selectedMultiple",multiple:""},P=e("option",{value:"value1"},"Value 1",-1),Y=e("option",{value:"value2",selected:""},"Value 2",-1),q=e("option",{value:"value3",selected:""},"Value 3",-1),z=[P,Y,q],F={key:0,class:"pad-t-m pad-b-m"},H=e("b",null,"Multi Select Value:",-1),K=e("pre",null,[l("      "),e("code",{class:"language-javascript"},`
-        var select = new SlimSelect({
-          select: '#selectElement'
-        })
-        var values = select.getSelected() // Will return an array of strings
-        console.log(values)
-      `),l(`
-    `)],-1);function L(t,s,h,p,_,v){return o(),a("div",E,[k,O,C,e("div",G,[e("div",{class:"btn",onClick:s[0]||(s[0]=(...n)=>t.getSelected&&t.getSelected(...n))},"Get Selected"),e("div",null,[e("select",T,W,512),t.selectedSingleValue.length?(o(),a("div",I,[A,l(" "+$(t.selectedSingleValue),1)])):g("",!0)]),e("div",null,[e("select",J,z,512),t.selectedMultipleValue.length?(o(),a("div",F,[H,l(" "+$(t.selectedMultipleValue),1)])):g("",!0)])]),K])}const Q=r(M,[["render",L]]),R=u({name:"SetSelected",data(){return{selectedSingle:null,selectedMultiple:null}},mounted(){this.selectedSingle=new i({select:this.$refs.selectedSingle}),this.selectedMultiple=new i({select:this.$refs.selectedMultiple})},methods:{setSelected(){this.selectedSingle.open(),this.selectedSingle.setSelected("value2"),this.selectedMultiple.open(),this.selectedMultiple.setSelected(["value1","value3"]),setTimeout(()=>{this.selectedSingle.close(),this.selectedMultiple.close()},1e3)}}}),U={id:"setSelected",class:"content"},X=e("h2",{class:"header"},"setSelected",-1),Z=e("p",null,"The setSelected method will set the selected value(s) of the select.",-1),x=e("p",null,"setSelected will accept both string or array of strings.",-1),ee={class:"row"},te={ref:"selectedSingle"},se=e("option",{value:"value1"},"Value 1",-1),le=e("option",{value:"value2"},"Value 2",-1),ne=e("option",{value:"value3"},"Value 3",-1),oe=[se,le,ne],ae={ref:"selectedMultiple",multiple:""},ie=e("option",{value:"value1"},"Value 1",-1),ce=e("option",{value:"value2"},"Value 2",-1),de=e("option",{value:"value3"},"Value 3",-1),ue=[ie,ce,de],re=e("pre",null,[l("      "),e("code",{class:"language-javascript"},`
-        var select = new SlimSelect({
-          select: '#selectElement'
-        })
-        select.setSelected('value1' /* or */ ['value1', 'value3'])
-        console.log(select.getSelected())
-      `),l(`
-    `)],-1);function he(t,s,h,p,_,v){return o(),a("div",U,[X,Z,x,e("div",ee,[e("div",{class:"btn",onClick:s[0]||(s[0]=(...n)=>t.setSelected&&t.setSelected(...n))},"Set Selected"),e("select",te,oe,512),e("select",ae,ue,512)]),re])}const pe=r(R,[["render",he]]),_e=u({name:"GetData",data(){return{getDataOptions:null,getDataOptionsValue:[],getDataOptgroups:null,getDataOptgroupsValue:[]}},mounted(){this.getDataOptions=new i({select:this.$refs.getDataOptions}),this.getDataOptgroups=new i({select:this.$refs.getDataOptgroups})},methods:{getData(){this.getDataOptionsValue=this.getDataOptions.getData(),this.getDataOptgroupsValue=this.getDataOptgroups.getData()}}}),ve={id:"getData",class:"content"},$e=e("h2",{class:"header"},"getData",-1),ge=e("p",null,"The getData method will return an array of the full data set.",-1),Se={class:"row"},me={ref:"getDataOptions"},fe=e("option",{value:"value1"},"Value 1",-1),be=e("option",{value:"value2"},"Value 2",-1),De=e("option",{value:"value3"},"Value 3",-1),Ve=[fe,be,De],ye={key:0,class:"pad-t-m pad-b-m"},we=e("b",null,"Option Data:",-1),Me={ref:"getDataOptgroups",multiple:""},Ee=y('<optgroup label="Group 1"><option value="value1">Value 1</option><option value="value2">Value 2</option><option value="value3">Value 3</option></optgroup><optgroup label="Group 2"><option value="value4">Value 4</option><option value="value5">Value 5</option><option value="value6">Value 6</option></optgroup>',2),ke=[Ee],Oe={key:0,class:"pad-t-m pad-b-m"},Ce=e("b",null,"Optgroup Data:",-1),Ge=e("pre",null,[l("      "),e("code",{class:"language-javascript"},`
-        var select = new SlimSelect({
-          select: '#selectElement'
-        })
-        var data = select.getData() // Will return an array of options and optgroups
-        console.log(data)
-      `),l(`
-    `)],-1);function Te(t,s,h,p,_,v){return o(),a("div",ve,[$e,ge,e("div",Se,[e("div",{class:"btn",onClick:s[0]||(s[0]=(...n)=>t.getData&&t.getData(...n))},"Get Data"),e("div",null,[e("select",me,Ve,512),t.getDataOptionsValue.length?(o(),a("div",ye,[we,l(" "+$(t.getDataOptionsValue),1)])):g("",!0)]),e("div",null,[e("select",Me,ke,512),t.getDataOptgroupsValue.length?(o(),a("div",Oe,[Ce,l(" "+$(t.getDataOptgroupsValue),1)])):g("",!0)])]),Ge])}const je=r(_e,[["render",Te]]),Ne=u({name:"SetData",data(){return{setDataSingle:null,setDataMultiple:null}},mounted(){this.setDataSingle=new i({select:this.$refs.setDataSingle,events:{error:t=>{console.error(t)}}}),this.setDataMultiple=new i({select:this.$refs.setDataMultiple,events:{error:t=>{console.error(t)}}})},methods:{setData(){fetch("https://api.gofakeit.com/json",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({type:"array",rowcount:10,indent:!1,fields:[{name:"text",function:"generate",params:{str:"{firstname} {lastname}"}},{name:"selected",function:"bool"}]})}).then(t=>t.json()).then(t=>{this.setDataSingle.setData(t),this.setDataMultiple.setData(t)}).catch(t=>console.error(t))}}}),Be={id:"setData",class:"content"},We=e("h2",{class:"header"},"setData",-1),Ie=e("p",null," The setData method can take in an array of objects. This will set the options of the original select and rerender slim select. ",-1),Ae=e("div",{class:"alert info"}," If you use a single select but an option is not selected it will select the first option. ",-1),Je=e("div",{class:"alert info"}," If you use a single select but pass in data with multiple selected options, the first option will be selected. ",-1),Pe={class:"alert info"},Ye={class:"row"},qe={ref:"setDataSingle"},ze={ref:"setDataMultiple",multiple:""},Fe=e("pre",null,[l("      "),e("code",{class:"language-javascript"},`
-        var select = new SlimSelect({
-          select: '#selectElement'
-        })
-
-        // Array of objects
-        select.setData([
-          {text: 'Value 1', value: 'value1'},
-          {text: 'Value 2', value: 'value2'},
-          {
-            label: 'Group 1',
-            options: [
-              {text: 'Value 3', value: 'value3'},
-              {text: 'Value 4', value: 'value4'},
-            ]
-          }
-        ])
-      `),l(`
-    `)],-1);function He(t,s,h,p,_,v){const n=c("router-link");return o(),a("div",Be,[We,Ie,Ae,Je,e("div",Pe,[l(" To get a better break down of possible data options see "),d(n,{to:"/data#types"},{default:w(()=>[l("data")]),_:1})]),e("div",Ye,[e("div",{class:"btn",onClick:s[0]||(s[0]=(...S)=>t.setData&&t.setData(...S))},"Set Data"),e("select",qe,null,512),e("select",ze,null,512)]),Fe])}const Ke=r(Ne,[["render",He]]),Le=u({name:"EnableDisable",data(){return{setEnableSingle:null,setEnableMultiple:null}},mounted(){this.setEnableSingle=new i({select:this.$refs.setEnableSingle}),this.setEnableMultiple=new i({select:this.$refs.setEnableMultiple})},methods:{setEnable(){this.setEnableSingle.enable(),this.setEnableMultiple.enable()},setDisable(){this.setEnableSingle.disable(),this.setEnableMultiple.disable()}}}),Qe={id:"enableDisable",class:"content"},Re=e("h2",{class:"header"},"enable / disable",-1),Ue=e("p",null,[l(" These methods will enable or disable the select dropdown. "),e("br"),l(" You may also set disabled on your original select and slim-select will pick that up. ")],-1),Xe={class:"row"},Ze={ref:"setEnableSingle",disabled:""},xe=e("option",{value:"value1"},"Value 1",-1),et=e("option",{value:"value2"},"Value 2",-1),tt=e("option",{value:"value3"},"Value 3",-1),st=[xe,et,tt],lt={ref:"setEnableMultiple",multiple:"",disabled:""},nt=e("option",{value:"value1"},"Value 1",-1),ot=e("option",{value:"value2"},"Value 2",-1),at=e("option",{value:"value3"},"Value 3",-1),it=[nt,ot,at],ct=e("pre",null,[l("      "),e("code",{class:"language-javascript"},`
-        var select = new SlimSelect({
-          select: '#selectElement'
-        })
-        select.enable()
-        // or
-        select.disable()
-      `),l(`
-    `)],-1);function dt(t,s,h,p,_,v){return o(),a("div",Qe,[Re,Ue,e("div",Xe,[t.setEnableSingle&&!t.setEnableSingle.settings.isEnabled?(o(),a("div",{key:0,class:"btn",onClick:s[0]||(s[0]=(...n)=>t.setEnable&&t.setEnable(...n))},"Enable")):(o(),a("div",{key:1,class:"btn",onClick:s[1]||(s[1]=(...n)=>t.setDisable&&t.setDisable(...n))},"Disable")),e("select",Ze,st,512),e("select",lt,it,512)]),ct])}const ut=r(Le,[["render",dt]]),rt=u({name:"Search",data(){return{searchSingle:null,searchMultiple:null}},mounted(){this.searchSingle=new i({select:this.$refs.searchSingle}),this.searchMultiple=new i({select:this.$refs.searchMultiple})},methods:{setSearch(){this.searchSingle.open(),this.searchSingle.search("value 2"),this.searchMultiple.open(),this.searchMultiple.search("value 2")}}}),ht={id:"search",class:"content"},pt=e("h2",{class:"header"},"search",-1),_t=e("p",null,"The search method will update the search input field and search the data against that value.",-1),vt={class:"row"},$t={ref:"searchSingle"},gt=e("option",{value:"value1"},"Value 1",-1),St=e("option",{value:"value2"},"Value 2",-1),mt=e("option",{value:"value3"},"Value 3",-1),ft=[gt,St,mt],bt={ref:"searchMultiple",multiple:""},Dt=e("option",{value:"value1"},"Value 1",-1),Vt=e("option",{value:"value2"},"Value 2",-1),yt=e("option",{value:"value3"},"Value 3",-1),wt=[Dt,Vt,yt],Mt=e("pre",null,[l("      "),e("code",{class:"language-javascript"},`
-        var select = new SlimSelect({
-          select: '#selectElement'
-        })
-        select.search('value')
-      `),l(`
-    `)],-1);function Et(t,s,h,p,_,v){return o(),a("div",ht,[pt,_t,e("div",vt,[e("div",{class:"btn",onClick:s[0]||(s[0]=(...n)=>t.setSearch&&t.setSearch(...n))},"Set Search"),e("select",$t,ft,512),e("select",bt,wt,512)]),Mt])}const kt=r(rt,[["render",Et]]),Ot=u({name:"Destroy",data(){return{destroySingle:null,destroyMultiple:null}},mounted(){this.create()},methods:{create(){this.destroySingle=new i({select:this.$refs.destroySingle}),this.destroyMultiple=new i({select:this.$refs.destroyMultiple})},destroy(){this.destroySingle.destroy(),this.destroySingle=null,this.destroyMultiple.destroy(),this.destroyMultiple=null}}}),Ct={id:"destroy",class:"content"},Gt=e("h2",{class:"header"},"destroy",-1),Tt=e("p",null,"The destroy method will remove slim-select and display your original select.",-1),jt={class:"row"},Nt={ref:"destroySingle"},Bt=e("option",{value:"value1"},"Value 1",-1),Wt=e("option",{value:"value2"},"Value 2",-1),It=e("option",{value:"value3"},"Value 3",-1),At=[Bt,Wt,It],Jt={ref:"destroyMultiple",multiple:""},Pt=e("option",{value:"value1"},"Value 1",-1),Yt=e("option",{value:"value2"},"Value 2",-1),qt=e("option",{value:"value3"},"Value 3",-1),zt=[Pt,Yt,qt],Ft=e("pre",null,[l("      "),e("code",{class:"language-javascript"},`
-        var select = new SlimSelect({
-          select: '#selectElement'
-        })
-        select.destroy()
-      `),l(`
-    `)],-1);function Ht(t,s,h,p,_,v){return o(),a("div",Ct,[Gt,Tt,e("div",jt,[t.destroySingle?(o(),a("div",{key:1,class:"btn",onClick:s[1]||(s[1]=(...n)=>t.destroy&&t.destroy(...n))},"Destroy")):(o(),a("div",{key:0,class:"btn",onClick:s[0]||(s[0]=(...n)=>t.create&&t.create(...n))},"Create")),e("select",Nt,At,512),e("select",Jt,zt,512)]),Ft])}const Kt=r(Ot,[["render",Ht]]),Lt=u({name:"Methods",components:{GetSelected:Q,SetSelected:pe,GetData:je,SetData:Ke,EnableDisable:ut,Search:kt,Destroy:Kt}}),Qt={id:"methods",class:"contents"};function Rt(t,s,h,p,_,v){const n=c("GetSelected"),S=c("SetSelected"),m=c("GetData"),f=c("SetData"),b=c("EnableDisable"),D=c("Search"),V=c("Destroy");return o(),a("div",Qt,[d(n),d(S),d(m),d(f),d(b),d(D),d(V)])}const Xt=r(Lt,[["render",Rt]]);export{Xt as default};

package/docs/assets/index5.js

@@ -1,149 +0,0 @@
-import{d as m,S as O,_,o as c,c as d,l as y,r as g,a as e,b as s,w as i,f as n,t as r,i as C,F as S,h as f}from"./index.js";const b=m({name:"SlimSelect",props:{data:{type:Array},settings:{type:Object},events:{type:Object}},data(){return{slim:null}},mounted(){let t={select:this.$refs.slim};this.data&&(t.data=this.data),this.settings&&(t.settings=this.settings),this.events&&(t.events=this.events),this.slim=new O(t)},beforeUnmount(){this.slim&&this.slim.destroy()},watch:{data:{handler:function(t){this.slim&&this.slim.setData(t)},deep:!0}},methods:{getSlimSelect(){return this.slim}}}),w={ref:"slim"};function D(t,o,p,u,h,v){return c(),d("select",w,[y(t.$slots,"default")],512)}const $=_(b,[["render",D]]),V=m({name:"Vue",components:{SlimSelect:$},data(){return{settings:{showSearch:!1},data:[{value:"value1",text:"Value 1"},{value:"value2",text:"Value 2"},{value:"value3",text:"Value 3"}],dynamicData:[],afterChangeData:[],events:{afterChange:this.afterChange}}},mounted(){},methods:{changeData(){this.$refs.dataSingle.getSlimSelect().open(),this.$refs.dataMultiple.getSlimSelect().open(),setTimeout(()=>{this.data=[{value:"value4",text:"Value 4"},{value:"value5",text:"Value 5"},{value:"value6",text:"Value 6"}]},500)},afterChange(t){this.afterChangeData=t},randomDynamicData(){fetch("https://api.gofakeit.com/json",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({type:"array",rowcount:20,indent:!1,fields:[{name:"key",function:"password",params:{lower:!0,upper:!0,numeric:!0,special:!1,space:!1,length:10}},{name:"first_name",function:"firstname",params:{}},{name:"last_name",function:"lastname",params:{}},{name:"selected",function:"number",params:{min:1,max:10}}]})}).then(t=>t.json()).then(t=>{this.dynamicData=t.map(o=>({id:o.id,text:`${o.first_name} ${o.last_name}`,value:`${o.first_name} ${o.last_name}`,selected:o.selected>=8}))})}}}),j={id:"vue",class:"content"},x=e("h2",{class:"header"},"Vue",-1),k=e("h3",null,"Install",-1),M=e("p",null,"The vue component is in a sub package under SlimSelect",-1),T=e("pre",null,[n("      "),e("code",{class:"language-bash"},`
-        npm install @slim-select/vue
-      `),n(`
-    `)],-1),N=e("br",null,null,-1),B=e("h3",null,"Simple example",-1),E={class:"row"},F=e("option",{value:"1"},"Option 1",-1),R=e("option",{value:"2"},"Option 2",-1),A=e("option",{value:"3"},"Option 3",-1),I=e("option",{value:"1"},"Option 1",-1),J=e("option",{value:"2"},"Option 2",-1),L=e("option",{value:"3"},"Option 3",-1),P=e("pre",null,[n("      "),e("code",{class:"language-javascript"},`
-        import { defineComponent } from 'vue'
-        import SlimSelect from '@slim-select/vue'
-
-        export default defineComponent({
-          components: {
-            SlimSelect,
-          },
-        })
-      `),n(`
-    `)],-1),U=e("pre",null,[n("      "),e("code",{class:"language-html"},`
-        <SlimSelect>
-          <option value="1">Option 1</option>
-          <option value="2">Option 2</option>
-          <option value="3">Option 3</option>
-        </SlimSelect>
-
-        <SlimSelect multiple>
-          <option value="1">Option 1</option>
-          <option value="2">Option 2</option>
-          <option value="3">Option 3</option>
-        </SlimSelect>
-      `),n(`
-    `)],-1),Y=e("br",null,null,-1),q=e("div",{class:"separator"},null,-1),z=e("br",null,null,-1),G=e("h3",null,"Settings",-1),H=e("p",null," Settings just like its passed as an object in normal SlimSelct will also be passed as an object to the component prop ",-1),K={class:"row"},Q=e("option",{value:"1"},"Option 1",-1),W=e("option",{value:"2"},"Option 2",-1),X=e("option",{value:"3"},"Option 3",-1),Z=e("option",{value:"1"},"Option 1",-1),ee=e("option",{value:"2"},"Option 2",-1),te=e("option",{value:"3"},"Option 3",-1),ne=e("pre",null,[n("      "),e("code",{class:"language-javascript"},`
-        import { defineComponent } from 'vue'
-        import SlimSelect from '@slim-select/vue'
-
-        export default defineComponent({
-          components: {
-            SlimSelect,
-          },
-          data() {
-            return {
-              settings: {
-                showSearch: false,
-              }
-            }
-          },
-        })
-      `),n(`
-    `)],-1),oe=e("pre",null,[n("      "),e("code",{class:"language-html"},`
-        <SlimSelect :settings="settings">
-          <option value="1">Option 1</option>
-          <option value="2">Option 2</option>
-          <option value="3">Option 3</option>
-        </SlimSelect>
-
-        <SlimSelect :settings="settings" multiple>
-          <option value="1">Option 1</option>
-          <option value="2">Option 2</option>
-          <option value="3">Option 3</option>
-        </SlimSelect>
-      `),n(`
-    `)],-1),le=e("br",null,null,-1),ae=e("div",{class:"separator"},null,-1),se=e("br",null,null,-1),ie=e("h3",null,"Data",-1),ce=e("p",null," Data just like its passed as an array in normal SlimSelct will also be passed as an array to the component prop. ",-1),de=e("div",{class:"alert info"}," You may pass data as a prop if you would like. But you can also have reactive options that when options change the select will update as well. See Reactivity below for more info. ",-1),pe={class:"row"},ue=e("pre",null,[n("      "),e("code",{class:"language-javascript"},`
-        import { defineComponent } from 'vue'
-        import SlimSelect from '@slim-select/vue'
-
-        export default defineComponent({
-          components: {
-            SlimSelect,
-          },
-          data() {
-            return {
-              data: [
-                { value: 'value1', text: 'Value 1' },
-                { value: 'value2', text: 'Value 2' },
-                { value: 'value3', text: 'Value 3' },
-              ],
-            }
-          },
-        })
-      `),n(`
-    `)],-1),re=e("pre",null,[n("      "),e("code",{class:"language-html"},`
-        <SlimSelect :data="data" />
-
-        <SlimSelect :data="data" multiple />
-      `),n(`
-    `)],-1),me=e("br",null,null,-1),_e=e("div",{class:"separator"},null,-1),he=e("br",null,null,-1),ve=e("h3",null,"Events",-1),Se=e("p",null," Events just like its passed as an object in normal SlimSelct will also be passed as an object to the component prop. ",-1),fe={key:0},ge=e("strong",null,"afterChange:",-1),Oe={class:"row"},ye=e("option",{value:"1"},"Option 1",-1),Ce=e("option",{value:"2"},"Option 2",-1),be=e("option",{value:"3"},"Option 3",-1),we=e("option",{value:"1"},"Option 1",-1),De=e("option",{value:"2"},"Option 2",-1),$e=e("option",{value:"3"},"Option 3",-1),Ve=e("pre",null,[n("      "),e("code",{class:"language-javascript"},`
-        import { defineComponent } from 'vue'
-        import SlimSelect from '@slim-select/vue'
-
-        export default defineComponent({
-          components: {
-            SlimSelect,
-          },
-          data() {
-            return {
-              events: {
-                afterChange: this.afterChange,
-              },
-            }
-          },
-          methods: {
-            afterChange(newVal) {
-              console.log(newVal)
-            },
-          },
-        })
-      `),n(`
-    `)],-1),je=e("pre",null,[n("      "),e("code",{class:"language-html"},`
-        <SlimSelect :events="events">
-          <option value="1">Option 1</option>
-          <option value="2">Option 2</option>
-          <option value="3">Option 3</option>
-        </SlimSelect>
-
-        <SlimSelect :events="events" multiple>
-          <option value="1">Option 1</option>
-          <option value="2">Option 2</option>
-          <option value="3">Option 3</option>
-        </SlimSelect>
-      `),n(`
-    `)],-1),xe=e("br",null,null,-1),ke=e("div",{class:"separator"},null,-1),Me=e("br",null,null,-1),Te=e("h3",null,"Reactivity",-1),Ne=e("p",null," Slim select will look out for any options changes that happen to the select options and SlimSelect will update accordingly. This is done via mutation observers. ",-1),Be={class:"row"},Ee=["value","selected"],Fe=["value","selected"],Re=e("pre",null,[n("      "),e("code",{class:"language-javascript"},`
-        import { defineComponent } from 'vue'
-        import SlimSelect from '@slim-select/vue'
-
-        export default defineComponent({
-          components: {
-            SlimSelect,
-          },
-          data() {
-            return {
-              dynamicData: []
-            }
-          },
-          methods: {
-            changeData() {
-              this.dynamicData = [
-                { id: 1, value: 1, text: 'Option 1', selected: true },
-                { id: 2, value: 2, text: 'Option 2', selected: false },
-                { id: 3, value: 3, text: 'Option 3', selected: false },
-              ]
-            },
-          },
-        })
-      `),n(`
-    `)],-1),Ae=e("pre",null,[n("      "),e("code",{class:"language-html"},`
-        <SlimSelect :events="events">
-          <option v-for="d in dynamicData" :key="d.id" :value="d.value" :selected="d.selected">{{ d.text }}</option>
-        </SlimSelect>
-
-        <SlimSelect :events="events" multiple>
-          <option v-for="d in dynamicData" :value="d.value" :selected="d.selected">{{ d.text }}</option>
-        </SlimSelect>
-      `),n(`
-    `)],-1);function Ie(t,o,p,u,h,v){const l=g("SlimSelect");return c(),d("div",j,[x,k,M,T,N,B,e("div",E,[s(l,null,{default:i(()=>[F,R,A]),_:1}),s(l,{multiple:""},{default:i(()=>[I,J,L]),_:1})]),P,U,Y,q,z,G,H,e("div",K,[s(l,{settings:t.settings},{default:i(()=>[Q,W,X]),_:1},8,["settings"]),s(l,{settings:t.settings,multiple:""},{default:i(()=>[Z,ee,te]),_:1},8,["settings"])]),ne,oe,le,ae,se,ie,ce,de,e("div",pe,[e("div",{class:"btn info",onClick:o[0]||(o[0]=(...a)=>t.changeData&&t.changeData(...a))},"Change data"),s(l,{ref:"dataSingle",data:t.data},null,8,["data"]),s(l,{ref:"dataMultiple",data:t.data,multiple:""},null,8,["data"])]),ue,re,me,_e,he,ve,Se,t.afterChangeData.length?(c(),d("div",fe,[ge,n(" "+r(t.afterChangeData),1)])):C("",!0),e("div",Oe,[s(l,{events:t.events},{default:i(()=>[ye,Ce,be]),_:1},8,["events"]),s(l,{events:t.events,multiple:""},{default:i(()=>[we,De,$e]),_:1},8,["events"])]),Ve,je,xe,ke,Me,Te,Ne,e("div",Be,[e("div",{class:"btn info",onClick:o[1]||(o[1]=(...a)=>t.randomDynamicData&&t.randomDynamicData(...a))},"Change data"),s(l,{ref:"randomDynamic"},{default:i(()=>[(c(!0),d(S,null,f(t.dynamicData,a=>(c(),d("option",{key:a.id,value:a.value,selected:a.selected},r(a.text),9,Ee))),128))]),_:1},512),s(l,{multiple:""},{default:i(()=>[(c(!0),d(S,null,f(t.dynamicData,a=>(c(),d("option",{value:a.value,selected:a.selected},r(a.text),9,Fe))),256))]),_:1})]),Re,Ae])}const Je=_(V,[["render",Ie]]),Le=m({name:"Events",components:{Vue:Je}}),Pe={id:"frameworks",class:"contents"};function Ue(t,o,p,u,h,v){const l=g("Vue");return c(),d("div",Pe,[s(l)])}const qe=_(Le,[["render",Ue]]);export{qe as default};

package/docs/assets/install.js

@@ -1,34 +0,0 @@
-import{g as M,d as $,_ as I,o as O,c as V,a as o,f as B,t as E,e as L}from"./index.js";var R={exports:{}};(function(d,w){(function(y,v){d.exports=v()})(M,function(){return function y(v,k,j){var n=window,p="application/octet-stream",r=j||p,e=v,c=!k&&!j&&e,t=document.createElement("a"),_=function(s){return String(s)},i=n.Blob||n.MozBlob||n.WebKitBlob||_,m=k||"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&&(m=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,m,p)},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||p;else return navigator.msSaveBlob?navigator.msSaveBlob(x(e),m):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",m),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\/\-\+]+)/,p)),window.open(s)||confirm(`Displaying New Document
-
-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\/\-\+]+)/,p)),h.src=s,setTimeout(function(){document.body.removeChild(h)},333)}if(navigator.msSaveBlob)return navigator.msSaveBlob(l,m);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.2.0",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.ssr.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=["src/vue"],oe={type:"git",url:"git+https://github.com/brianvoe/slim-select.git"},ie=["select","vanilla","dropdown","search","multiselect"],le={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 && npm run build:frameworks","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 ../../","build:frameworks":"npm run build --workspaces",publish:"npm publish && npm publish --workspace=src/vue --access public",test:"jest"},re={"@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","@slim-select/vue":"workspace:src/vue","@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-typescript2":"^0.34.1","rollup-plugin-vue":"^6.0.0",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"},ce={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,workspaces:ne,repository:oe,keywords:ie,scripts:le,devDependencies:re},ae=$({name:"Install",data:()=>({version:ce.version}),methods:{downloadLink(){H(`https://cdnjs.cloudflare.com/ajax/libs/slim-select/${this.version}/slimselect.min.js`)}}}),de={id:"install",class:"contents"},pe=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">
-          import SlimSelect from &#39;slim-select&#39;
-
-          new SlimSelect({
-            select: &#39;#selectElement&#39;
-          })
-        </code>
-      </pre></div>`,1),me={id:"cdn",class:"content"},ue=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),be={class:"install-code"},fe={class:"language-html"},he={id:"download",class:"content"},ge=o("h2",null,"Download",-1),ve=o("p",null,"Download the latest minified umd version of slim select",-1),we=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 ye(d,w,y,v,k,j){return O(),V("div",de,[pe,o("div",me,[ue,o("pre",be,[B("        "),o("code",fe,`
-          <html>
-            <head>
-              <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({
-                  select: '#selectElement'
-                })
-              <script>
-            </head>
-            <body>
-              <select id="selectElement">
-                <option>Option 1</option>
-                <option>Option 2</option>
-                <option>Option 3</option>
-              </select>
-            </body>
-          </html>
-        `,1),B(`
-      `)])]),o("div",he,[ge,ve,we,o("div",{class:"btn",onClick:w[0]||(w[0]=n=>d.downloadLink())},"Click Here To Download")])])}const je=I(ae,[["render",ye]]);export{je as default};

package/docs/assets/selects.js

@@ -1,55 +0,0 @@
-import{d as c,S as p,_ as v,o as a,c as s,a as e,F as n,h as i,f as l,t as r}from"./index.js";const b=c({name:"Selects",data(){return{states:[{abv:"AL",state:"Alabama"},{abv:"AK",state:"Alaska"},{abv:"AZ",state:"Arizona"},{abv:"AR",state:"Arkansas"},{abv:"CA",state:"California"},{abv:"CO",state:"Colorado"},{abv:"CT",state:"Connecticut"},{abv:"DE",state:"Delaware"},{abv:"FL",state:"Florida"},{abv:"GA",state:"Georgia"},{abv:"HI",state:"Hawaii"},{abv:"ID",state:"Idaho"},{abv:"IL",state:"Illinois"},{abv:"IN",state:"Indiana"},{abv:"IA",state:"Iowa"},{abv:"KS",state:"Kansas"},{abv:"KY",state:"Kentucky"},{abv:"LA",state:"Louisiana"},{abv:"ME",state:"Maine"},{abv:"MD",state:"Maryland"},{abv:"MA",state:"Massachusetts"},{abv:"MI",state:"Michigan"},{abv:"MN",state:"Minnesota"},{abv:"MS",state:"Mississippi"},{abv:"MO",state:"Missouri"},{abv:"MT",state:"Montana"},{abv:"NE",state:"Nebraska"},{abv:"NV",state:"Nevada"},{abv:"NH",state:"New Hampshire"},{abv:"NJ",state:"New Jersey"},{abv:"NM",state:"New Mexico"},{abv:"NY",state:"New York"},{abv:"NC",state:"North Carolina"},{abv:"ND",state:"North Dakota"},{abv:"OH",state:"Ohio"},{abv:"OK",state:"Oklahoma"},{abv:"OR",state:"Oregon"},{abv:"PA",state:"Pennsylvania"},{abv:"RI",state:"Rhode Island"},{abv:"SC",state:"South Carolina"},{abv:"SD",state:"South Dakota"},{abv:"TN",state:"Tennessee",selected:!0},{abv:"TX",state:"Texas"},{abv:"UT",state:"Utah"},{abv:"VT",state:"Vermont"},{abv:"VA",state:"Virginia"},{abv:"WA",state:"Washington"},{abv:"WV",state:"West Virginia"},{abv:"WI",state:"Wisconsin"},{abv:"WY",state:"Wyoming"}],foods:[{label:"Dairy",options:["Milk","Cheese","Butter","Ice Cream"]},{label:"Meat",options:["Beef","Ham","Pork","Sausage","Chicken","Turkey"]},{label:"Fruits",options:["Apple","Banana","Grape","Orange","Strawberry","Blueberry","Raspberry"]},{label:"Vegetables",options:["Carrot","Tomato","Broccoli","Celery","Corn","Pumpkin","Kale","Spinach"]}]}},mounted(){new p({select:this.$refs.single}),new p({select:this.$refs.singleOptgroup}),new p({select:this.$refs.multiple}),new p({select:this.$refs.multipleOptgroup}).setSelected(["Cheese","Apple","Corn"])}}),d={id:"selects",class:"contents"},h={id:"single",class:"content"},_=e("h2",{class:"header"},"Single",-1),g=e("p",null," Basic single select usage with Slim Select is extremely easy. Just set the select value to your select element. ",-1),m={class:"row"},V=e("h4",null,"Options",-1),y={ref:"single"},k=["value","selected"],M=e("h4",null,"Optgroups",-1),S={ref:"singleOptgroup"},N=["label"],O=["value"],f=e("pre",null,[l("        "),e("code",{class:"language-javascript"},`
-          new SlimSelect({
-            select: '#single'
-          })
-        `),l(`
-      `)],-1),C=e("pre",null,[l("        "),e("code",{class:"language-html"},`
-          <!-- Options -->
-          <select id="single">
-            <option value="value 1">Value 1</option>
-            <option value="value 2">Value 2</option>
-            <option value="value 3">Value 3</option>
-          </select>
-
-          <!-- Optgroups -->
-          <select id="single-optgroups">
-            <optgroup label="Label 1">
-              <option value="value 1">Value 1</option>
-              <option value="value 2">Value 2</option>
-              <option value="value 3">Value 3</option>
-            </optgroup>
-            <optgroup label="Label 2">
-              <option value="value 21">Value 1</option>
-              <option value="value 22">Value 2</option>
-              <option value="value 23">Value 3</option>
-            </optgroup>
-          </select>
-        `),l(`
-      `)],-1),w={id:"multiple",class:"content"},A=e("h2",{class:"header"},"Multiple",-1),I=e("p",null," Multi selects work just the same as a single select. The only difference is setting the multiple attribute on your select. ",-1),T={class:"row"},D=e("h4",null,"Options",-1),L={ref:"multiple",multiple:""},B=["value","selected"],W=e("h4",null,"Optgroups",-1),$={ref:"multipleOptgroup",multiple:""},K=["label"],H=["value"],F=e("pre",null,[l("        "),e("code",{class:"language-javascript"},`
-          new SlimSelect({
-            select: '#multiple'
-          })
-        `),l(`
-      `)],-1),G=e("pre",null,[l("        "),e("code",{class:"language-html"},`
-          <!-- Options -->
-          <select id="multiple" multiple>
-            <option value="value 1">Value 1</option>
-            <option value="value 2">Value 2</option>
-            <option value="value 3">Value 3</option>
-          </select>
-
-          <!-- Optgroups -->
-          <select id="multiple-optgroups" multiple>
-            <optgroup label="Label 1">
-              <option value="value 1">Value 1</option>
-              <option value="value 2">Value 2</option>
-              <option value="value 3">Value 3</option>
-            </optgroup>
-            <optgroup label="Label 2">
-              <option value="value 21">Value 1</option>
-              <option value="value 22">Value 2</option>
-              <option value="value 23">Value 3</option>
-            </optgroup>
-          </select>
-        `),l(`
-      `)],-1);function R(u,E,P,Y,j,x){return a(),s("div",d,[e("div",h,[_,g,e("div",m,[e("div",null,[V,e("select",y,[(a(!0),s(n,null,i(u.states,t=>(a(),s("option",{key:t.abv,value:t.abv,selected:t.selected},r(t.state),9,k))),128))],512)]),e("div",null,[M,e("select",S,[(a(!0),s(n,null,i(u.foods,t=>(a(),s("optgroup",{key:t.label,label:t.label},[(a(!0),s(n,null,i(t.options,o=>(a(),s("option",{key:o,value:o},r(o),9,O))),128))],8,N))),128))],512)])]),f,C]),e("div",w,[A,I,e("div",T,[e("div",null,[D,e("select",L,[(a(!0),s(n,null,i(u.states,t=>(a(),s("option",{value:t.abv,key:t.abv,selected:t.selected},r(t.state),9,B))),128))],512)]),e("div",null,[W,e("select",$,[(a(!0),s(n,null,i(u.foods,t=>(a(),s("optgroup",{key:t.label,label:t.label},[(a(!0),s(n,null,i(t.options,o=>(a(),s("option",{key:o,value:o},r(o),9,H))),128))],8,K))),128))],512)])]),F,G])])}const U=v(b,[["render",R]]);export{U as default};

package/docs/index.html

@@ -1,36 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <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
-      >
-    </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>

package/public/404.html

@@ -1,42 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <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
-      // Copyright (c) 2016 Rafael Pedicini, licensed under the MIT License
-      // ----------------------------------------------------------------------
-      // This script takes the current url and converts the path and query
-      // string into just a query string, and then redirects the browser
-      // to the new url with only a query string and hash fragment,
-      // e.g. http://www.foo.tld/one/two?a=b&c=d#qwe, becomes
-      // http://www.foo.tld/?p=/one/two&q=a=b~and~c=d#qwe
-      // Note: this 404.html file must be at least 512 bytes for it to work
-      // with Internet Explorer (it is currently > 512 bytes)
-      // If you're creating a Project Pages site and NOT using a custom domain,
-      // then set pathPrefix = true. This way the repo name will remain in the path:
-      // 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
-      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,
-      )
-    </script>
-  </head>
-  <body></body>
-</html>

package/public/CNAME

@@ -1 +0,0 @@
-slimselectjs.com