vuux/dist/lib/InputTag/src/index.vue.cjs

Vue3 Nuxt3 Nuxt4 组件库

"use strict";const e=require("vue"),g=require("../../Space/index.cjs"),v=require("./hook/useInputTag.cjs"),E=require("@vuux/icons"),w=["disabled","placeholder"],x=e.defineComponent({name:"InputTag",__name:"index",props:{modelValue:{},readonly:{type:Boolean},placeholder:{default:"请输入"},max:{default:0},limit:{default:10},gap:{default:5},disabled:{type:Boolean}},emits:["update:modelValue","delete","save"],setup(r,{emit:p}){const l=r,c=p,u=e.useTemplateRef("inputEl"),{onFocus:f,tagValue:o,show:m,classNames:k,values:y,handleRemove:B,onDelete:a,onEnter:s,onBlur:d}=v.useInputTag(l,u,c);return(V,n)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["app-input-tag",e.unref(k)])},[e.createVNode(e.unref(g.Space),{wrap:"",gap:l.gap,"full-width":""},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(y),(t,i)=>(e.openBlock(),e.createElementBlock("div",{key:i,class:"tag-item"},[e.createElementVNode("span",null,e.toDisplayString(t),1),l.readonly?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(e.unref(E.Icon),{key:0,name:"Icon9176904",size:13,color:"#fff",onClick:C=>e.unref(B)(i)},null,8,["onClick"]))]))),128)),!l.readonly&&e.unref(m)?e.withDirectives((e.openBlock(),e.createElementBlock("input",{key:0,ref_key:"inputEl",ref:u,"onUpdate:modelValue":n[0]||(n[0]=t=>e.isRef(o)?o.value=t:null),type:"text",disabled:l.disabled,placeholder:r.placeholder,onFocus:n[1]||(n[1]=t=>f.value=!0),onBlur:n[2]||(n[2]=(...t)=>e.unref(d)&&e.unref(d)(...t)),onKeyup:n[3]||(n[3]=e.withKeys((...t)=>e.unref(s)&&e.unref(s)(...t),["enter"])),onKeydown:n[4]||(n[4]=e.withKeys((...t)=>e.unref(a)&&e.unref(a)(...t),["delete"]))},null,40,w)),[[e.vModelText,e.unref(o)]]):e.createCommentVNode("",!0)]),_:1},8,["gap"])],2))}});module.exports=x;