UNPKG

vuux

Version:

Vue3 Nuxt3 Nuxt4 组件库

2 lines (1 loc) 1.82 kB
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("vue"),M=require("@vuux/utils"),S=(t,m,v)=>{const a=u.ref(""),r=u.ref(!1),c=u.ref(!1),s=u.ref([]),o=u.ref(-1),n=u.ref(0),g=u.computed(()=>t.maxVisible),b=u.computed(()=>s.value.slice(n.value,n.value+g.value)),d=new Map;let h=null;const y=()=>{a.value="",s.value=[],c.value=!1,o.value=-1,n.value=0,v("update:modelValue",null)},w=async e=>{if(!t.fetchOptions)return[];if(d.has(e))return d.get(e)||[];const l=await t.fetchOptions(e);return d.set(e,l),l},O=e=>{a.value=e[t.label??"name"],c.value=!1,o.value=-1,n.value=0,v("update:modelValue",e[t.value??"id"]),v("select",e)},I=async e=>{const l=!!t.fetchOptions;l&&(r.value=!0);let i=[];t.options&&(i=t.options.filter(A=>String(A[t.label??"name"]).includes(e)));let f=[];t.fetchOptions&&(f=await w(e));const q=[...i,...f];return l&&(r.value=!1),q},V=async()=>{const e=a.value.trim();if(!e){s.value=[],c.value=!1,o.value=-1,n.value=0,v("update:modelValue",null);return}const l=!!t.fetchOptions;l&&(r.value=!0),c.value=!0,s.value=await I(e),l&&(r.value=!1),o.value=-1,n.value=0},x=()=>{h&&clearTimeout(h),h=window.setTimeout(V,t.debounceTime)},C=e=>{a.value=e.target.value,x()},T=()=>{a.value.trim()&&s.value.length&&(c.value=!0)},k=e=>{const l=e[t.label??"name"],i=a.value;if(!i)return l;const f=new RegExp(`(${i})`,"gi");return l.replace(f,"<mark>$1</mark>")};return M.Utils.useClickOutside(m,()=>{c.value=!1,o.value=-1,n.value=0;const e=a.value.trim();s.value.find(i=>i[t.label??"name"]===e)||v("update:modelValue",null)}),u.watch(()=>t.modelValue,e=>{e||(a.value="")}),{inputValue:a,loading:r,showDropdown:c,filteredOptions:s,highlightIndex:o,startIndex:n,visibleOptions:b,clearInput:y,selectItem:O,onInputBox:C,onInputClick:T,highlightMatch:k}};exports.useAutoComplete=S;