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