vexip-ui/lib/components/auto-complete/auto-complete.vue2.cjs

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

"use strict";const e=require("vue");require("../icon/index.cjs");require("../select/index.cjs");require("../form/index.cjs");require("../renderer/index.cjs");const f=require("@vexip-ui/config"),R=require("@vexip-ui/hooks"),C=require("@vexip-ui/utils"),pe=require("./props.cjs"),ve=require("../form/helper.cjs"),ge=require("../select/select.vue2.cjs"),p=require("../renderer/renderer.cjs"),H=require("../icon/icon.cjs"),he=["autofocus","spellcheck","disabled","placeholder","readonly","name"],me=e.defineComponent({name:"AutoComplete",__name:"auto-complete",props:pe.autoCompleteProps,emits:["update:value"],setup(K,{expose:U,emit:W}){const o=e.ref(),u=e.ref(),{idFor:F,labelId:j,state:G,disabled:J,loading:Q,size:X,validateField:Y,clearField:Z,getFieldValue:_,setFieldValue:ee}=ve.useFieldStore(()=>{var l;return(l=u.value)==null?void 0:l.focus()}),k=f.useNameHelper("auto-complete"),le=K,n=f.useProps("autoComplete",le,{size:f.createSizeProp(X),state:f.createStateProp(G),locale:null,transfer:!1,value:{default:()=>_(),static:!0},options:{default:()=>[],static:!0},filter:!1,prefix:f.createIconProp(),prefixColor:"",suffix:f.createIconProp(),suffixColor:"",placeholder:null,disabled:()=>J.value,transitionName:()=>k.ns("drop"),dropDisabled:!1,placement:{default:"bottom",validator:l=>R.placementWhileList.includes(l)},clearable:!1,ignoreCase:!1,autofocus:!1,spellcheck:!1,keyConfig:()=>({}),loading:()=>Q.value,loadingIcon:f.createIconProp(),loadingLock:!1,loadingEffect:null,transparent:!1,debounce:!1,delay:null,showEmpty:!1,name:{default:"",static:!0},popperAlive:null,slots:()=>({}),shift:!0}),ne=W,T=e.useSlots(),te=f.useLocale("input",e.toRef(n,"locale")),{timer:re}=R.useSetTimeout(),a=e.ref(n.value),d=e.ref(-1),i=e.ref(!1),v=e.ref(!1);let x=!1,g=n.value,w=String(g);const y=e.computed(()=>n.loading&&n.loadingLock),z=e.computed(()=>{var l;return((l=o.value)==null?void 0:l.optionStates)||[]}),E=e.computed(()=>{var l;return((l=o.value)==null?void 0:l.visibleOptions)||[]}),ae=e.computed(()=>!!(T.prefix||n.prefix||n.slots.prefix)),A=e.computed(()=>!!(T.suffix||n.suffix||n.slots.suffix));e.watch(()=>n.value,l=>{a.value=l,g=l,w=String(l),u.value&&(u.value.value=String(l))}),e.watch(d,oe),e.watch(i,l=>{var t;l?(t=u.value)==null||t.focus():d.value=-1}),e.watch(a,l=>{n.filter&&o.value&&(o.value.currentFilter=`${l}`)}),e.watchEffect(()=>{!n.filter||!i.value||!o.value||(o.value.currentFilter=String(a.value))}),U({idFor:F,composing:v,select:o,control:u,focus:l=>{var t;return(t=u.value)==null?void 0:t.focus(l)},blur:()=>{var l;return(l=u.value)==null?void 0:l.blur()}}),e.onMounted(()=>{e.nextTick(()=>{u.value&&!C.isNull(a.value)&&(u.value.value=String(a.value))})});function oe(){const l=d.value;let t=-1;z.value.forEach(r=>{r.hidden?r.hitting=!1:(t+=1,r.hitting=l===t,r.hitting&&u.value&&(u.value.value=String(r.value)))}),u.value&&l<0&&(u.value.value=w)}let S=!1;function ue(l){S||(S=!0,f.emitEvent(n.onFocus,l))}function ie(l){S&&(S=!1,re.focus=setTimeout(()=>{S||(f.emitEvent(n.onBlur,l),h())},120))}function D(l,t){if(v.value||C.isNull(l))return;const r=a.value;a.value=l,f.emitEvent(n.onSelect,l,t),l!==r?(x=!0,h()):i.value=!1}function L(l){var r;const t=typeof l=="string"?l:l.target.value;a.value=t,x=!0,w=t,d.value!==-1&&(d.value=0),n.showEmpty&&(i.value=!n.dropDisabled,o.value&&(o.value.currentVisible=i.value)),f.emitEvent(n.onInput,t),e.nextTick($),(r=o.value)==null||r.updatePopper()}const B=C.toNumber(n.delay),V=n.debounce?C.debounce(L,B||100):C.throttle(L,B||16);function h(l=!0){if(!x||a.value===g)return;x=!1,g=a.value,w=String(g);const t=z.value.find(r=>r.value===g);o.value&&(o.value.currentValues.length=0,(a.value||a.value===0)&&o.value.currentValues.push(a.value)),ne("update:value",a.value),ee(a.value),f.emitEvent(n.onChange,a.value,(t==null?void 0:t.data)||null),l&&Y(),i.value=!1,u.value&&(u.value.value=String(g))}let m=!1,N=!1;function se(){n.disabled||y.value||(m=i.value,N=!0,o.value&&(o.value.currentFilter=String(a.value)))}function fe(){n.disabled||y.value||(N=!1,o.value&&(i.value=!0,m?o.value.currentVisible=!0:($(),m=i.value,m&&f.emitEvent(n.onToggle,m))))}function de(l){n.disabled||y.value||N||(i.value=l,l&&$(),m=i.value,i.value!==l&&f.emitEvent(n.onToggle,i.value),i.value||(d.value=-1))}function $(){i.value=!(n.dropDisabled||!n.showEmpty&&!E.value.length),o.value&&(o.value.currentVisible=i.value)}function ce(l){if(v.value){l.stopPropagation();return}const t=l.code||l.key;if(t==="Enter"||t==="NumpadEnter")I(l);else if(t==="ArrowDown"||t==="ArrowUp"){l.preventDefault(),l.stopPropagation();const r=E.value,s=r.length;if(!s)return;const c=t==="ArrowDown"?1:-1;let b=(Math.max(d.value+c,-1)+s)%s,q=r[b];for(let M=0;(q.disabled||q.group)&&M<s;++M)b+=c,b=(b+s)%s,q=r[b];d.value=b}else["Space"," "].includes(t)&&l.stopPropagation(),["Enter","ArrowLeft","ArrowRight"].includes(t)||(d.value=-1)}function I(l){if(l.stopPropagation(),!v.value){if(d.value>=0&&E.value.length){const t=E.value[d.value===-1?0:d.value];D(t.value,t.data)}else h();f.emitEvent(n.onEnter,a.value),i.value=!1}}function P(){var l;if(n.clearable){const t=a.value;a.value="",i.value=!1,!C.isNull(t)&&t!==a.value&&(x=!0),h(!1),f.emitEvent(n.onClear),e.nextTick(Z),(l=u.value)==null||l.focus()}}function O(){v.value&&(v.value=!1,u.value&&u.value.dispatchEvent(new Event("input")))}return(l,t)=>(e.openBlock(),e.createBlock(e.unref(ge),{id:e.unref(F),ref_key:"select",ref:o,visible:i.value,"onUpdate:visible":t[5]||(t[5]=r=>i.value=r),class:e.normalizeClass([e.unref(k).b(),e.unref(n).inherit&&e.unref(k).bm("inherit")]),inherit:e.unref(n).inherit,"label-id":e.unref(j),"list-class":e.unref(k).be("list"),value:a.value,size:e.unref(n).size,state:e.unref(n).state,clearable:e.unref(n).clearable,"transition-name":e.unref(n).transitionName,disabled:e.unref(n).disabled,transfer:e.unref(n).transfer,placement:e.unref(n).placement,"prefix-color":e.unref(n).prefixColor,"suffix-color":e.unref(n).suffixColor,"no-suffix":!A.value,placeholder:e.unref(n).placeholder,options:e.unref(n).options,"key-config":e.unref(n).keyConfig,loading:e.unref(n).loading,"loading-icon":e.unref(n).loadingIcon,"loading-lock":e.unref(n).loadingLock,"loading-effect":e.unref(n).loadingEffect,transparent:l.transparent,filter:e.unref(n).filter,"ignore-case":e.unref(n).ignoreCase,"popper-alive":e.unref(n).popperAlive,shift:e.unref(n).shift,onToggle:de,onSelect:D,onClear:P,onFocus:t[6]||(t[6]=r=>{var s;return(s=u.value)==null?void 0:s.focus()}),onOutsideClose:h,onClick:fe,onClickCapture:se},e.createSlots({control:e.withCtx(()=>[e.renderSlot(l.$slots,"control",{value:a.value,onInput:e.unref(V),onChange:h,onEnter:I,onClear:P},()=>[e.createVNode(e.unref(p),{renderer:e.unref(n).slots.control,data:{value:a.value,onInput:e.unref(V),onChange:h,onEnter:I,onClear:P}},{default:e.withCtx(()=>[e.createElementVNode("input",{ref_key:"control",ref:u,class:e.normalizeClass(e.unref(k).be("input")),autofocus:e.unref(n).autofocus,spellcheck:e.unref(n).spellcheck,disabled:e.unref(n).disabled,placeholder:e.unref(n).placeholder??e.unref(te).placeholder,readonly:y.value,name:e.unref(n).name,autocomplete:"off",tabindex:"-1",role:"combobox","aria-autocomplete":"list",onSubmit:t[0]||(t[0]=e.withModifiers(()=>{},["prevent"])),onInput:t[1]||(t[1]=(...r)=>e.unref(V)&&e.unref(V)(...r)),onKeydown:ce,onFocus:t[2]||(t[2]=r=>ue(r)),onBlur:t[3]||(t[3]=r=>ie(r)),onCompositionstart:t[4]||(t[4]=r=>v.value=!0),onCompositionend:O,onChange:O},null,42,he)]),_:1},8,["renderer","data"])])]),_:2},[ae.value?{name:"prefix",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"prefix",{},()=>[e.createVNode(e.unref(p),{renderer:e.unref(n).slots.prefix},{default:e.withCtx(()=>[e.createVNode(e.unref(H),{icon:e.unref(n).prefix},null,8,["icon"])]),_:1},8,["renderer"])])]),key:"0"}:void 0,A.value?{name:"suffix",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"suffix",{},()=>[e.createVNode(e.unref(p),{renderer:e.unref(n).slots.suffix},{default:e.withCtx(()=>[e.createVNode(e.unref(H),{icon:e.unref(n).suffix},null,8,["icon"])]),_:1},8,["renderer"])])]),key:"1"}:void 0,l.$slots.default||e.unref(n).slots.default?{name:"default",fn:e.withCtx(({option:r,index:s,selected:c})=>[e.renderSlot(l.$slots,"default",{option:r,index:s,selected:c},()=>[e.createVNode(e.unref(p),{renderer:e.unref(n).slots.default,data:{option:r,index:s,selected:c}},null,8,["renderer","data"])])]),key:"2"}:void 0,l.$slots.group||e.unref(n).slots.group?{name:"group",fn:e.withCtx(({option:r,index:s})=>[e.renderSlot(l.$slots,"group",{option:r,index:s},()=>[e.createVNode(e.unref(p),{renderer:e.unref(n).slots.group,data:{option:r,index:s}},null,8,["renderer","data"])])]),key:"3"}:void 0,l.$slots.prepend||e.unref(n).slots.prepend?{name:"prepend",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"prepend",{},()=>[e.createVNode(e.unref(p),{renderer:e.unref(n).slots.prepend},null,8,["renderer"])])]),key:"4"}:void 0,l.$slots.append||e.unref(n).slots.append?{name:"append",fn:e.withCtx(()=>[e.renderSlot(l.$slots,"append",{},()=>[e.createVNode(e.unref(p),{renderer:e.unref(n).slots.append},null,8,["renderer"])])]),key:"5"}:void 0,l.$slots.list||e.unref(n).slots.list?{name:"list",fn:e.withCtx(({options:r,isSelected:s,handleSelect:c})=>[e.renderSlot(l.$slots,"list",{options:r,isSelected:s,handleSelect:c},()=>[e.createVNode(e.unref(p),{renderer:e.unref(n).slots.list,data:{options:r,isSelected:s,handleSelect:c}},null,8,["renderer","data"])])]),key:"6"}:void 0]),1032,["id","visible","class","inherit","label-id","list-class","value","size","state","clearable","transition-name","disabled","transfer","placement","prefix-color","suffix-color","no-suffix","placeholder","options","key-config","loading","loading-icon","loading-lock","loading-effect","transparent","filter","ignore-case","popper-alive","shift"]))}});module.exports=me;
//# sourceMappingURL=auto-complete.vue2.cjs.map