UNPKG

@morpheme/autocomplete

Version:

Morpheme Autocomplete

2 lines (1 loc) 9.84 kB
var Dropdown=function(u,e,n,c,B,N){"use strict";const R="",g={class:"autocomplete-body"},w={class:"autocomplete-clearable"},E=["disabled"],T={key:0,class:"autocomplete-empty"},S={key:0,class:"autocomplete-item-selected"},D={key:1,class:"autocomplete-hint"},C=e.defineComponent({__name:"VAutocomplete",props:{modelValue:{default:void 0},searchBy:{default:"text"},displayText:{default:"text"},placeholder:{default:"Search..."},label:{default:""},items:{default:()=>[]},name:{default:""},rules:{default:""},notFoundText:{},noDataText:{default:"No data."},clearable:{type:Boolean,default:!1},errorClass:{default:"autocomplete-error"},wrapperClass:{default:""},validationMode:{default:"aggressive"},disabled:{type:Boolean},hideError:{type:Boolean},hint:{},shadow:{type:Boolean},readonly:{type:Boolean},error:{type:Boolean},transition:{default:"fade"}},emits:["update:modelValue","update:query","clear"],setup(V,{emit:f}){const s=V,{errorMessage:l,uncontrolledValue:d,clear:b}=B.useFormValue(s,f),{items:h}=e.toRefs(s),i=e.ref("");e.watch(i,o=>f("update:query",o));const y=e.computed(()=>i.value===""?h.value:h.value.filter(o=>String(o[s.searchBy]).toLowerCase().replace(/\s+/g,"").includes(i.value.toLowerCase().replace(/\s+/g,"")))),t=()=>{i.value="",b()};return(o,a)=>(e.openBlock(),e.createBlock(e.unref(n.Combobox),{modelValue:e.unref(d),"onUpdate:modelValue":a[1]||(a[1]=r=>e.isRef(d)?d.value=r:null),class:e.normalizeClass(["autocomplete",[o.wrapperClass,{"autocomplete--error":!!e.unref(l)||o.error,"autocomplete--selected":!!e.unref(d),"autocomplete--disabled":o.disabled,"autocomplete--readonly":o.readonly,"autocomplete--shadow":o.shadow}]]),as:"div"},{default:e.withCtx(()=>[o.label?(e.openBlock(),e.createBlock(e.unref(n.ComboboxLabel),{key:0,class:"autocomplete-label"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.label),1)]),_:1})):e.createCommentVNode("",!0),e.createElementVNode("div",g,[e.createElementVNode("div",{class:e.normalizeClass(["autocomplete-field",{"autocomplete-field--error":!!e.unref(l)||o.error}])},[e.createVNode(e.unref(n.ComboboxInput),{class:e.normalizeClass(["autocomplete-input",{"autocomplete-input--selected":!!e.unref(d)}]),"display-value":r=>r?.[o.displayText]||"",placeholder:o.placeholder,disabled:o.disabled,onChange:a[0]||(a[0]=r=>i.value=r.target.value)},null,8,["class","display-value","placeholder","disabled"]),e.createElementVNode("div",w,[o.clearable&&e.unref(d)?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button","aria-label":"Clear",class:"autocomplete-clearable-button",disabled:o.disabled,onClick:t},[e.createVNode(e.unref(c.Icon),{name:"heroicons:x-mark",class:"autocomplete-icon","aria-hidden":"true"})],8,E)):e.createCommentVNode("",!0),e.createVNode(e.unref(n.ComboboxButton),{disabled:o.disabled},{default:e.withCtx(()=>[e.createVNode(e.unref(c.Icon),{name:"heroicons:chevron-down",class:"autocomplete-icon","aria-hidden":"true"})]),_:1},8,["disabled"])])],2),e.createVNode(e.Transition,{name:o.transition},{default:e.withCtx(()=>[e.createVNode(e.unref(n.ComboboxOptions),{class:"autocomplete-options"},{default:e.withCtx(()=>[y.value.length===0?(e.openBlock(),e.createElementBlock("div",T,e.toDisplayString(o.noDataText),1)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(y.value,(r,m)=>(e.openBlock(),e.createBlock(e.unref(n.ComboboxOption),{key:m,as:"template",value:r},{default:e.withCtx(({selected:p,active:k})=>[e.createElementVNode("li",{class:e.normalizeClass(["autocomplete-item",{"autocomplete-item--active":k,"autocomplete-item--inactive":!k}])},[e.createElementVNode("span",{class:e.normalizeClass(["autocomplete-item-text",{"autocomplete-item-text--selected":p}])},e.toDisplayString(r[o.displayText]),3),p?(e.openBlock(),e.createElementBlock("span",S,[e.createVNode(e.unref(c.Icon),{name:"heroicons:check",class:"autocomplete-item-selected-icon","aria-hidden":"true"})])):e.createCommentVNode("",!0)],2)]),_:2},1032,["value"]))),128))]),_:1})]),_:1},8,["name"])]),o.hint?(e.openBlock(),e.createElementBlock("p",D,[e.renderSlot(o.$slots,"hint",{},()=>[e.createTextVNode(e.toDisplayString(o.hint),1)])])):e.createCommentVNode("",!0),e.unref(l)&&!o.hideError?(e.openBlock(),e.createElementBlock("div",{key:2,class:e.normalizeClass(o.errorClass)},e.toDisplayString(e.unref(l)),3)):e.createCommentVNode("",!0)]),_:3},8,["modelValue","class"]))}}),z={class:"autocomplete-body"},P={key:0,class:"autocomplete-selection"},L={class:"autocomplete-clearable"},I=["disabled"],F={key:0,class:"autocomplete-empty"},M={key:0,class:"autocomplete-item-selected"},A={key:1,class:"autocomplete-hint"},O={key:2,class:"autocomplete-error"},q=e.defineComponent({__name:"Autocomplete",props:{modelValue:{},items:{},multiple:{type:Boolean},itemText:{default:"text"},itemValue:{default:"value"},placeholder:{default:"Search..."},label:{},transition:{default:"dropdown"},error:{type:Boolean},disabled:{type:Boolean},clearable:{type:Boolean},emptyText:{default:"No results."},searchBy:{},displayValue:{},selectionItemProps:{},readonly:{type:Boolean},shadow:{type:Boolean},hint:{},errorMessage:{},hideError:{type:Boolean}},emits:["update:modelValue","clear"],setup(V,{emit:f}){const s=V,l=e.ref(s.modelValue);e.watch(()=>s.modelValue,t=>{l.value=t},{immediate:!0,deep:!0}),e.watch(l,t=>{f("update:modelValue",t)},{deep:!0});const d=e.ref(""),b=e.computed(()=>d.value===""?s.items:s.items.filter(t=>String(t[s.searchBy||s.itemText||s.itemValue]).toLowerCase().replace(/\s+/g,"").includes(d.value.toLowerCase().replace(/\s+/g,"")))),h=()=>{d.value="",l.value=void 0,f("clear")},i=t=>t?.[s.itemText]||"",y=e.computed(()=>s.displayValue??i);return(t,o)=>(e.openBlock(),e.createBlock(e.unref(n.Combobox),{modelValue:l.value,"onUpdate:modelValue":o[1]||(o[1]=a=>l.value=a),as:"div",class:e.normalizeClass(["autocomplete autocomplete-primary",{"autocomplete--error":t.error,"autocomplete--selected":!!l.value,"autocomplete--disabled":t.disabled,"autocomplete--readonly":t.readonly,"autocomplete--shadow":t.shadow}]),multiple:t.multiple},{default:e.withCtx(()=>[t.label?(e.openBlock(),e.createBlock(e.unref(n.ComboboxLabel),{key:0,class:"autocomplete-label"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.label),1)]),_:1})):e.createCommentVNode("",!0),e.createElementVNode("div",z,[e.createElementVNode("div",{class:e.normalizeClass(["autocomplete-field",{"autocomplete-field--error":t.error}])},[e.renderSlot(t.$slots,"selection",e.normalizeProps(e.guardReactiveProps({selected:l.value,multiple:t.multiple,itemValue:t.itemValue,itemText:t.itemText,selectionItemProps:t.selectionItemProps})),()=>[t.multiple&&l.value&&l.value.length>0?(e.openBlock(),e.createElementBlock("div",P,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.value,(a,r)=>e.renderSlot(t.$slots,"selection-item",e.normalizeProps(e.mergeProps({key:r},{item:a,idx:r,itemText:t.itemText,itemValue:t.itemValue,remove:()=>l.value?.splice(r,1)})),()=>[e.createVNode(e.unref(N),e.mergeProps({color:"primary",dismissable:"",onDismiss:m=>l.value.splice(r,1)},t.selectionItemProps),{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a[t.itemText]),1)]),_:2},1040,["onDismiss"])])),128))])):e.createCommentVNode("",!0)]),e.createVNode(e.unref(n.ComboboxInput),{class:e.normalizeClass(["autocomplete-input",{"autocomplete-input--selected":!!l.value}]),"display-value":y.value??i,placeholder:t.placeholder,disabled:t.disabled,onChange:o[0]||(o[0]=a=>d.value=a.target.value)},null,8,["class","display-value","placeholder","disabled"]),e.createElementVNode("div",L,[t.clearable&&l.value?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button","aria-label":"Clear",class:"autocomplete-clearable-button",disabled:t.disabled,onClick:h},[e.createVNode(e.unref(c),{name:"heroicons:x-mark",class:"autocomplete-icon","aria-hidden":"true"})],8,I)):e.createCommentVNode("",!0),e.createVNode(e.unref(n.ComboboxButton),{disabled:t.disabled},{default:e.withCtx(()=>[e.createVNode(e.unref(c),{name:"heroicons:chevron-down",class:"autocomplete-icon","aria-hidden":"true"})]),_:1},8,["disabled"])])],2),e.createVNode(e.Transition,{name:t.transition},{default:e.withCtx(()=>[e.createVNode(e.unref(n.ComboboxOptions),{class:"autocomplete-options"},{default:e.withCtx(()=>[b.value.length===0?(e.openBlock(),e.createElementBlock("div",F,e.toDisplayString(t.emptyText),1)):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(b.value,(a,r)=>(e.openBlock(),e.createBlock(e.unref(n.ComboboxOption),{key:r,as:"template",value:a},{default:e.withCtx(({selected:m,active:p})=>[e.renderSlot(t.$slots,"item",e.normalizeProps(e.guardReactiveProps({item:a,active:p,selected:m,itemText:t.itemText,itemValue:t.itemValue})),()=>[e.createElementVNode("li",{class:e.normalizeClass(["autocomplete-item",{"autocomplete-item--active":p,"autocomplete-item--inactive":!p}])},[e.createElementVNode("span",{class:e.normalizeClass(["autocomplete-item-text",{"autocomplete-item-text--selected":m}])},e.toDisplayString(a[t.itemText]),3),m?(e.openBlock(),e.createElementBlock("span",M,[e.createVNode(e.unref(c),{name:"heroicons:check",class:"autocomplete-item-selected-icon","aria-hidden":"true"})])):e.createCommentVNode("",!0)],2)])]),_:2},1032,["value"]))),128))]),_:3})]),_:3},8,["name"])]),t.hint?(e.openBlock(),e.createElementBlock("div",A,[e.renderSlot(t.$slots,"hint",{},()=>[e.createTextVNode(e.toDisplayString(t.hint),1)])])):e.createCommentVNode("",!0),t.error&&!t.hideError?(e.openBlock(),e.createElementBlock("div",O,e.toDisplayString(t.errorMessage),1)):e.createCommentVNode("",!0)]),_:3},8,["modelValue","multiple","class"]))}});return u.Autocomplete=q,u.VAutocomplete=C,u.default=C,Object.defineProperties(u,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}}),u}({},Vue,vue$1,VIcon,forms,VBadge);