vue-amazing-ui/lib/inputsearch/InputSearch.vue2.cjs

An Amazing Vue3 UI Components Library, Using TypeScript.

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),V=require("../button/index.cjs"),h=require("../utils/index.cjs"),x={key:0,class:"input-search-prefix"},z=["value","placeholder","maxlength","disabled","onKeydown"],$={key:1,class:"input-search-suffix"},M={key:1,class:"input-search-count"},I={key:2,class:"suffix-item"},K=["onKeydown"],P=e.defineComponent({__name:"InputSearch",props:{width:{default:"100%"},icon:{type:Boolean,default:!0},search:{default:void 0},searchProps:{default:()=>({})},size:{default:"middle"},allowClear:{type:Boolean,default:!1},addonBefore:{default:void 0},prefix:{default:void 0},suffix:{default:void 0},loading:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},placeholder:{default:void 0},maxlength:{default:void 0},showCount:{type:Boolean,default:!1},value:{default:void 0},valueModifiers:{default:()=>({})}},emits:["update:value","change","search"],setup(m,{emit:v}){const a=m,r=e.ref(null),{colorPalettes:s,shadowColor:g}=h.useInject("InputSearch"),n=v,l=h.useSlotsExist(["prefix","suffix","addonBefore"]),y=e.computed(()=>typeof a.width=="number"?`${a.width}px`:a.width),u=e.computed(()=>!a.disabled&&a.allowClear),w=e.computed(()=>a.maxlength?(a.value?a.value.length:0)+" / "+a.maxlength:a.value?a.value.length:0),C=e.computed(()=>l.prefix||a.prefix),i=e.computed(()=>l.suffix||a.suffix),B=e.computed(()=>u.value||a.showCount||i.value),d=e.computed(()=>l.addonBefore||a.addonBefore),c=e.computed(()=>"lazy"in a.valueModifiers);function k(t){const o=t.target;c.value||(n("update:value",o.value),n("change",t))}function S(t){const o=t.target;o.value!==a.value&&(n("update:value",o.value),n("change",t))}function b(){var t;n("update:value",""),(t=r.value)==null||t.focus()}async function E(t){var p;const o=t.target;if(n("search",o.value,t),c.value){const N=new Event("change");(p=t.target)==null||p.dispatchEvent(N)}}function f(t){n("search",a.value,t)}return(t,o)=>(e.openBlock(),e.createElementBlock("div",{class:"m-input-search",style:e.normalizeStyle(`
      --input-search-width: ${y.value};
      --input-search-primary-color-hover: ${e.unref(s)[4]};
      --input-search-primary-color-focus: ${e.unref(s)[4]};
      --input-search-primary-shadow-color: ${e.unref(g)};
    `)},[d.value?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["input-search-addon-before",`addon-before-${t.size}`])},[e.renderSlot(t.$slots,"addonBefore",{},()=>[e.createTextVNode(e.toDisplayString(t.addonBefore),1)],!0)],2)):e.createCommentVNode("",!0),e.createElementVNode("div",{tabindex:"1",class:e.normalizeClass(["input-search-wrap",[`input-search-${t.size}`,{"input-search-before":d.value,"input-search-disabled":t.disabled}]])},[C.value?(e.openBlock(),e.createElementBlock("span",x,[e.renderSlot(t.$slots,"prefix",{},()=>[e.createTextVNode(e.toDisplayString(t.prefix),1)],!0)])):e.createCommentVNode("",!0),e.createElementVNode("input",{ref_key:"inputRef",ref:r,class:"input-search",type:"text",value:t.value,placeholder:t.placeholder,maxlength:t.maxlength,disabled:t.disabled,onInput:k,onChange:S,onKeydown:e.withKeys(e.withModifiers(E,["prevent"]),["enter"])},null,40,z),B.value?(e.openBlock(),e.createElementBlock("span",$,[u.value?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["input-search-clear",{"clear-hidden":!t.value}]),onClick:b},o[0]||(o[0]=[e.createElementVNode("svg",{class:"clear-svg",focusable:"false","data-icon":"close-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},[e.createElementVNode("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 01-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"})],-1)]),2)):e.createCommentVNode("",!0),t.showCount?(e.openBlock(),e.createElementBlock("span",M,e.toDisplayString(w.value),1)):e.createCommentVNode("",!0),i.value?(e.openBlock(),e.createElementBlock("span",I,[e.renderSlot(t.$slots,"suffix",{},()=>[e.createTextVNode(e.toDisplayString(t.suffix),1)],!0)])):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],2),e.createElementVNode("span",{class:"input-search-button",onClick:f,onKeydown:e.withKeys(e.withModifiers(f,["prevent"]),["enter"])},[e.renderSlot(t.$slots,"search",{},()=>[e.createVNode(e.unref(V.default),e.mergeProps({class:"search-btn",size:t.size,disabled:t.disabled,loading:t.loading},t.searchProps),e.createSlots({default:e.withCtx(()=>[e.createTextVNode(" "+e.toDisplayString(t.search),1)]),_:2},[t.icon?{name:"icon",fn:e.withCtx(()=>[e.renderSlot(t.$slots,"icon",{},()=>[o[1]||(o[1]=e.createElementVNode("svg",{focusable:"false","data-icon":"search",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},[e.createElementVNode("path",{d:"M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"})],-1))],!0)]),key:"0"}:void 0]),1040,["size","disabled","loading"])],!0)],40,K)],4))}});exports.default=P;