@chenfengyuan/vue-number-input/dist/vue-number-input.esm.min.js

Number input component for Vue 3.

/*! vue-number-input v2.0.1 | (c) 2018-present Chen Fengyuan | MIT */
import{defineComponent as e,openBlock as t,createElementBlock as n,normalizeClass as u,createCommentVNode as a,createElementVNode as i,mergeProps as r}from"vue";const d=Number.isNaN||window.isNaN,o=/^-?(?:\d+|\d+\.\d+|\.\d+)(?:[eE][-+]?\d+)?$/,l=/\.\d*(?:0|9){10}\d*$/,s=(e,t=1e11)=>l.test(String(e))?Math.round(e*t)/t:e;var c=e({name:"VueNumberInput",props:{attrs:{type:Object,default:void 0},center:Boolean,controls:Boolean,disabled:Boolean,inputtable:{type:Boolean,default:!0},inline:Boolean,max:{type:Number,default:1/0},min:{type:Number,default:-1/0},name:{type:String,default:void 0},placeholder:{type:String,default:void 0},readonly:Boolean,rounded:Boolean,size:{type:String,default:void 0},step:{type:Number,default:1},modelValue:{type:Number,default:NaN}},emits:["update:modelValue"],data:()=>({value:NaN}),computed:{increasable(){return d(this.value)||this.value<this.max},decreasable(){return d(this.value)||this.value>this.min}},watch:{modelValue:{immediate:!0,handler(e,t){d(e)&&void 0===t||e===this.value||this.setValue(e)}}},methods:{isNaN:d,change(e){this.setValue(e.target.value)},paste(e){const t=e.clipboardData||window.clipboardData;t&&!o.test(t.getData("text"))&&e.preventDefault()},decrease(){if(this.decreasable){let{value:e}=this;d(e)&&(e=0),this.setValue(s(e-this.step))}},increase(){if(this.increasable){let{value:e}=this;d(e)&&(e=0),this.setValue(s(e+this.step))}},setValue(e){const t=this.value;let n="number"!=typeof e?parseFloat(e):e;d(n)||(this.min<=this.max&&(n=Math.min(this.max,Math.max(this.min,n))),this.rounded&&(n=Math.round(n))),this.value=n,n===t&&(this.$refs.input.value=String(n)),this.$emit("update:modelValue",n,t)}}});const p=["disabled"],b=["name","value","min","max","step","readonly","disabled","placeholder"],m=["disabled"];!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var u=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===n&&u.firstChild?u.insertBefore(a,u.firstChild):u.appendChild(a),a.styleSheet?a.styleSheet.cssText=e:a.appendChild(document.createTextNode(e))}}('.vue-number-input[data-v-188efc8c]{display:block;font-size:0;max-width:100%;overflow:hidden;position:relative}.vue-number-input__button[data-v-188efc8c]{background-color:#fff;border:0;border-radius:.25rem;bottom:1px;position:absolute;top:1px;width:2.5rem;z-index:1}.vue-number-input__button[data-v-188efc8c]:focus{outline:none}.vue-number-input__button[data-v-188efc8c]:hover:after,.vue-number-input__button[data-v-188efc8c]:hover:before{background-color:#0074d9}.vue-number-input__button[data-v-188efc8c]:disabled{opacity:.65}.vue-number-input__button[data-v-188efc8c]:disabled:after,.vue-number-input__button[data-v-188efc8c]:disabled:before{background-color:#ddd}.vue-number-input__button[data-v-188efc8c]:after,.vue-number-input__button[data-v-188efc8c]:before{background-color:#111;content:"";left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:background-color .15s}.vue-number-input__button[data-v-188efc8c]:before{height:1px;width:50%}.vue-number-input__button[data-v-188efc8c]:after{height:50%;width:1px}.vue-number-input__button--minus[data-v-188efc8c]{border-bottom-right-radius:0;border-right:1px solid #ddd;border-top-right-radius:0;left:1px}.vue-number-input__button--minus[data-v-188efc8c]:after{visibility:hidden}.vue-number-input__button--plus[data-v-188efc8c]{border-bottom-left-radius:0;border-left:1px solid #ddd;border-top-left-radius:0;right:1px}.vue-number-input__input[data-v-188efc8c]{-moz-appearance:textfield;background-color:#fff;border:1px solid #ddd;border-radius:.25rem;display:block;font-size:1rem;line-height:1.5;max-width:100%;min-height:1.5rem;min-width:3rem;padding:.4375rem .875rem;transition:border-color .15s;width:100%}.vue-number-input__input[data-v-188efc8c]::-webkit-inner-spin-button,.vue-number-input__input[data-v-188efc8c]::-webkit-outer-spin-button{-webkit-appearance:none}.vue-number-input__input[data-v-188efc8c]:focus{border-color:#0074d9;outline:none}.vue-number-input__input[data-v-188efc8c]:disabled,.vue-number-input__input[readonly][data-v-188efc8c]{background-color:#f8f8f8}.vue-number-input--inline[data-v-188efc8c]{display:inline-block}.vue-number-input--inline>input[data-v-188efc8c]{display:inline-block;width:12.5rem}.vue-number-input--center>input[data-v-188efc8c]{text-align:center}.vue-number-input--controls>input[data-v-188efc8c]{padding-left:3.375rem;padding-right:3.375rem}.vue-number-input--small>input[data-v-188efc8c]{border-radius:.1875rem;font-size:.875rem;padding:.25rem .5rem}.vue-number-input--small.vue-number-input--inline>input[data-v-188efc8c]{width:10rem}.vue-number-input--small.vue-number-input--controls>button[data-v-188efc8c]{width:2rem}.vue-number-input--small.vue-number-input--controls>input[data-v-188efc8c]{padding-left:2.5rem;padding-right:2.5rem}.vue-number-input--large>input[data-v-188efc8c]{border-radius:.3125rem;font-size:1.25rem;padding:.5rem 1rem}.vue-number-input--large.vue-number-input--inline>input[data-v-188efc8c]{width:15rem}.vue-number-input--large.vue-number-input--controls>button[data-v-188efc8c]{width:3rem}.vue-number-input--large.vue-number-input--controls>input[data-v-188efc8c]{padding-left:4rem;padding-right:4rem}'),c.render=function(e,d,o,l,s,c){return t(),n("div",{class:u(["vue-number-input",{"vue-number-input--inline":e.inline,"vue-number-input--center":e.center,"vue-number-input--controls":e.controls,[`vue-number-input--${e.size}`]:e.size}])},[e.controls?(t(),n("button",{key:0,class:"vue-number-input__button vue-number-input__button--minus",type:"button",tabindex:"-1",disabled:e.disabled||e.readonly||!e.decreasable,onClick:d[0]||(d[0]=(...t)=>e.decrease&&e.decrease(...t))},null,8,p)):a("v-if",!0),i("input",r({ref:"input",class:"vue-number-input__input"},e.attrs,{type:"number",name:e.name,value:isNaN(e.value)?"":e.value,min:e.min,max:e.max,step:e.step,readonly:e.readonly||!e.inputtable,disabled:e.disabled||!e.decreasable&&!e.increasable,placeholder:e.placeholder,autocomplete:"off",onChange:d[1]||(d[1]=(...t)=>e.change&&e.change(...t)),onPaste:d[2]||(d[2]=(...t)=>e.paste&&e.paste(...t))}),null,16,b),e.controls?(t(),n("button",{key:1,class:"vue-number-input__button vue-number-input__button--plus",type:"button",tabindex:"-1",disabled:e.disabled||e.readonly||!e.increasable,onClick:d[3]||(d[3]=(...t)=>e.increase&&e.increase(...t))},null,8,m)):a("v-if",!0)],2)},c.__scopeId="data-v-188efc8c";export{c as default};