vue-amazing-ui/lib/inputnumber/InputNumber.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("../utils/index.cjs"),I={class:"input-number-container"},K={key:0,class:"input-prefix"},L=["disabled","placeholder","onKeydown"],P={class:"input-number-handler-wrap"},D=e.defineComponent({__name:"InputNumber",props:{width:{default:90},min:{default:-1/0},max:{default:1/0},step:{default:1},precision:{default:0},prefix:{default:void 0},formatter:{type:Function,default:void 0},parser:{type:Function,default:void 0},keyboard:{type:Boolean,default:!0},disabled:{type:Boolean,default:!1},placeholder:{default:void 0},value:{default:void 0},valueModifiers:{default:()=>({})}},emits:["update:value","change","enter"],setup(i,{emit:N}){const n=i,s=e.ref(),u=e.ref(),{colorPalettes:p,shadowColor:V}=v.useInject("InputNumber"),h=N,E=v.useSlotsExist(["prefix"]),k=e.computed(()=>typeof n.width=="number"?`${n.width}px`:n.width),d=e.computed(()=>{const a=String(n.step).split(".")[1]?.length||0;return Math.max(n.precision,a)}),C=e.computed(()=>E.prefix||n.prefix),w=e.computed(()=>"lazy"in n.valueModifiers);e.watch(()=>[n.value,d.value,n.formatter],async()=>{if(n.value!==void 0)if(s.value){const{selectionStart:a,selectionEnd:t,value:r}=s.value,l=r.slice(0,a),o=r.slice(t);u.value=m(),await e.nextTick(),M(a,l,o)}else u.value=m()},{immediate:!0,flush:"post",deep:!0});function M(a,t,r){const{value:l}=s.value;let o=l.length;if(l.endsWith(r))o=l.length-r.length;else if(l.startsWith(t))o=t.length;else{const B=t[a-1],y=l.indexOf(B,a-1);y!==-1&&(o=y+1)}s.value.setSelectionRange(o,o)}function f(a){h("update:value",a),h("change",a)}function m(){return n.formatter?n.formatter(n.value?.toFixed(d.value)):n.value?.toFixed(d.value)}function c(a){let t=parseFloat(a);return t>n.max&&(t=n.max),t<n.min&&(t=n.min),t}function b(a){if(Number.isNaN(parseFloat(a)))u.value=m();else{const t=c(a);t!==n.value?f(t):u.value=m()}}function S(a){if(!w.value){const t=a.target,r=n.parser?String(n.parser(t.value)):t.value;r&&!Number.isNaN(c(r))&&c(r)!==n.value&&b(r),!r&&n.value!==void 0&&f(void 0)}}function F(a){const t=a.target,r=n.parser?String(n.parser(t.value)):t.value;b(r)}function $(a){a.key==="ArrowUp"&&x(),a.key==="ArrowDown"&&g()}function z(a){if(h("enter",a),w.value){const t=a.target,r=n.parser?String(n.parser(t.value)):t.value;b(r)}}function x(){const a=Math.min(n.max,v.add(n.value||0,+n.step)).toFixed(d.value);f(c(a))}function g(){const a=Math.max(n.min,v.add(n.value||0,-n.step)).toFixed(d.value);f(c(a))}return(a,t)=>(e.openBlock(),e.createElementBlock("div",{tabindex:"1",class:e.normalizeClass(["input-number-wrap",{"input-number-disabled":i.disabled}]),style:e.normalizeStyle(`
      --input-number-width: ${k.value};
      --input-number-primary-color: ${e.unref(p)[5]};
      --input-number-primary-color-hover: ${e.unref(p)[4]};
      --input-number-primary-color-focus: ${e.unref(p)[4]};
      --input-number-primary-shadow-color: ${e.unref(V)};
    `)},[e.createElementVNode("div",I,[C.value?(e.openBlock(),e.createElementBlock("span",K,[e.renderSlot(a.$slots,"prefix",{},()=>[e.createTextVNode(e.toDisplayString(i.prefix),1)],!0)])):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("input",{ref_key:"inputRef",ref:s,class:"input-number",autocomplete:"off",disabled:i.disabled,placeholder:i.placeholder,"onUpdate:modelValue":t[0]||(t[0]=r=>u.value=r),onInput:S,onChange:F,onKeydown:[t[1]||(t[1]=e.withKeys(e.withModifiers(()=>{},["prevent"]),["up"])),t[2]||(t[2]=r=>i.keyboard?$(r):()=>!1),e.withKeys(e.withModifiers(z,["prevent"]),["enter"])]},null,40,L),[[e.vModelText,u.value]])]),e.createElementVNode("div",P,[e.createElementVNode("span",{class:e.normalizeClass(["input-number-arrow up-arrow",{"arrow-disabled":(i.value||0)>=i.max}]),onClick:t[3]||(t[3]=r=>(i.value||0)>=i.max?()=>!1:x())},[...t[5]||(t[5]=[e.createElementVNode("svg",{class:"icon-svg",focusable:"false","data-icon":"up",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},[e.createElementVNode("path",{d:"M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"})],-1)])],2),e.createElementVNode("span",{class:e.normalizeClass(["input-number-arrow down-arrow",{"arrow-disabled":(i.value||0)<=i.min}]),onClick:t[4]||(t[4]=r=>(i.value||0)<=i.min?()=>!1:g())},[...t[6]||(t[6]=[e.createElementVNode("svg",{class:"icon-svg",focusable:"false","data-icon":"down",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},[e.createElementVNode("path",{d:"M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"})],-1)])],2)])],6))}});exports.default=D;