vue-textarea-autosize
Version:
Vue component provides textarea with automatically adjustable height and without any wrappers and dependencies
6 lines • 3.16 kB
JavaScript
/*!
* vue-textarea-autosize v1.1.1
* (c) 2019 Saymon
* Released under the MIT License.
*/
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t=t||self,t.VueTextareaAutosize=e())}(this,function(){"use strict";function t(t,e,i,n,o,r,a,s,u,c){"boolean"!=typeof a&&(u=s,s=a,a=!1);var h="function"==typeof i?i.options:i;t&&t.render&&(h.render=t.render,h.staticRenderFns=t.staticRenderFns,h._compiled=!0,o&&(h.functional=!0)),n&&(h._scopeId=n);var l;if(r?(l=function(t){t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,t||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),e&&e.call(this,u(t)),t&&t._registeredComponents&&t._registeredComponents.add(r)},h._ssrRegister=l):e&&(l=a?function(){e.call(this,c(this.$root.$options.shadowRoot))}:function(t){e.call(this,s(t))}),l)if(h.functional){var d=h.render;h.render=function(t,e){return l.call(e),d(t,e)}}else{var f=h.beforeCreate;h.beforeCreate=f?[].concat(f,l):[l]}return i}var e={name:"TextareaAutosize",props:{value:{type:[String,Number],default:""},autosize:{type:Boolean,default:!0},minHeight:{type:[Number],default:null},maxHeight:{type:[Number],default:null},important:{type:[Boolean,Array],default:!1}},data:function(){return{val:null,maxHeightScroll:!1,height:"auto"}},computed:{computedStyles:function(){return this.autosize?{resize:this.isResizeImportant?"none !important":"none",height:this.height,overflow:this.maxHeightScroll?"auto":this.isOverflowImportant?"hidden !important":"hidden"}:{}},isResizeImportant:function(){var t=this.important;return!0===t||Array.isArray(t)&&t.includes("resize")},isOverflowImportant:function(){var t=this.important;return!0===t||Array.isArray(t)&&t.includes("overflow")},isHeightImportant:function(){var t=this.important;return!0===t||Array.isArray(t)&&t.includes("height")}},watch:{value:function(t){this.val=t},val:function(t){this.$nextTick(this.resize),this.$emit("input",t)},minHeight:function(){this.$nextTick(this.resize)},maxHeight:function(){this.$nextTick(this.resize)},autosize:function(t){t&&this.resize()}},methods:{resize:function(){var t=this,e=this.isHeightImportant?"important":"";return this.height="auto".concat(e?" !important":""),this.$nextTick(function(){var i=t.$el.scrollHeight+1;t.minHeight&&(i=i<t.minHeight?t.minHeight:i),t.maxHeight&&(i>t.maxHeight?(i=t.maxHeight,t.maxHeightScroll=!0):t.maxHeightScroll=!1);var n=i+"px";t.height="".concat(n).concat(e?" !important":"")}),this}},created:function(){this.val=this.value},mounted:function(){this.resize()}},i=t;const n=e;var o=function(){var t=this,e=t.$createElement;return(t._self._c||e)("textarea",{directives:[{name:"model",rawName:"v-model",value:t.val,expression:"val"}],style:t.computedStyles,domProps:{value:t.val},on:{focus:t.resize,input:function(e){e.target.composing||(t.val=e.target.value)}}})},r=[];var a=i({render:o,staticRenderFns:r},void 0,n,void 0,!1,void 0,void 0,void 0),s=function(t){t.component("TextareaAutosize",a)},u={install:s,version:"1.1.1"};return"undefined"!=typeof window&&window.Vue&&window.Vue.use(u),u});