vue-amazing-ui/lib/textarea/Textarea.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"),$=require("../utils/index.cjs"),B=["data-count"],E=["value","placeholder","maxlength","disabled"],k=e.defineComponent({__name:"Textarea",props:{width:{default:"100%"},allowClear:{type:Boolean,default:!1},autoSize:{type:[Boolean,Object],default:!1},disabled:{type:Boolean,default:!1},placeholder:{default:void 0},maxlength:{default:void 0},showCount:{type:Boolean,default:!1},value:{default:""},valueModifiers:{default:()=>({})}},emits:["update:value","compositionstart","compositionend","change","enter"],setup(v,{emit:h}){const a=v,r=e.ref(null),u=e.ref(!1),o=e.ref(),i=e.ref(32),{colorPalettes:s,shadowColor:m}=$.useInject("Textarea"),n=h,p=e.computed(()=>typeof a.width=="number"?`${a.width}px`:a.width),c=e.computed(()=>{if(typeof a.autoSize=="object"){const t={height:`${i.value}px`,resize:"none"};return"minRows"in a.autoSize&&(t["min-height"]=`${a.autoSize.minRows*22+10}px`),"maxRows"in a.autoSize&&(t["max-height"]=`${a.autoSize.maxRows*22+10}px`),t}if(typeof a.autoSize=="boolean")return a.autoSize?{height:`${i.value}px`,resize:"none"}:{}}),d=e.computed(()=>!a.disabled&&a.allowClear&&o.value),g=e.computed(()=>a.maxlength?`${o.value?o.value.length:0} / ${a.maxlength}`:o.value?o.value.length:0),x=e.computed(()=>"lazy"in a.valueModifiers);e.watch(()=>a.value,async t=>{o.value!==t&&(o.value=t),JSON.stringify(c.value)!=="{}"&&(i.value=32,await e.nextTick(),f())},{immediate:!0,flush:"post"}),e.onMounted(()=>{f()});function f(){i.value=r.value.scrollHeight+2}function w(t){u.value=!0,n("compositionstart",t)}function y(t){u.value=!1,n("compositionend",t);const l=new Event("change");t.target?.dispatchEvent(l)}function C(t){if(!u.value){const l=t.target;o.value=l.value,x.value||(n("update:value",l.value),n("change",t))}}function z(t){const l=t.target;l.value!==a.value&&(n("update:value",l.value),n("change",t))}function S(t){u.value||n("enter",t)}function b(){o.value="",n("update:value",""),r.value?.focus()}return(t,l)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["textarea-wrap",{"show-count":t.showCount}]),style:e.normalizeStyle(`
      --textarea-width: ${p.value};
      --textarea-primary-color-hover: ${e.unref(s)[4]};
      --textarea-primary-color-focus: ${e.unref(s)[4]};
      --textarea-primary-shadow-color: ${e.unref(m)};
    `),"data-count":g.value},[e.createElementVNode("textarea",{ref_key:"textareaRef",ref:r,type:"hidden",class:e.normalizeClass(["textarea-item",{"clear-class":d.value,"textarea-disabled":t.disabled}]),style:e.normalizeStyle(c.value),value:o.value,placeholder:t.placeholder,maxlength:t.maxlength,disabled:t.disabled,onCompositionstart:w,onCompositionend:y,onInput:C,onChange:z,onKeydown:e.withKeys(S,["enter"])},null,46,E),d.value?(e.openBlock(),e.createElementBlock("svg",{key:0,class:"clear-svg",onClick:b,focusable:"false","data-icon":"close-circle",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},[...l[0]||(l[0]=[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"},null,-1)])])):e.createCommentVNode("",!0)],14,B))}});exports.default=k;