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 t=require("vue"),c=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=t.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(N,{emit:V}){const a=N,u=t.ref(),o=t.ref(),{colorPalettes:m,shadowColor:x}=c.useInject("InputNumber"),v=V,E=c.useSlotsExist(["prefix"]),k=t.computed(()=>typeof a.width=="number"?`${a.width}px`:a.width),s=t.computed(()=>{const e=String(a.step).split(".")[1]?.length||0;return Math.max(a.precision,e)}),C=t.computed(()=>E.prefix||a.prefix),b=t.computed(()=>"lazy"in a.valueModifiers);t.watch(()=>[a.value,s.value,a.formatter],async()=>{if(a.value!==void 0)if(u.value){const{selectionStart:e,selectionEnd:n,value:r}=u.value,i=r.slice(0,e),l=r.slice(n);o.value=f(),await t.nextTick(),M(e,i,l)}else o.value=f()},{immediate:!0,flush:"post",deep:!0});function M(e,n,r){const{value:i}=u.value;let l=i.length;if(i.endsWith(r))l=i.length-r.length;else if(i.startsWith(n))l=n.length;else{const B=n[e-1],y=i.indexOf(B,e-1);y!==-1&&(l=y+1)}u.value.setSelectionRange(l,l)}function p(e){v("update:value",e),v("change",e)}function f(){return a.formatter?a.formatter(a.value?.toFixed(s.value)):a.value?.toFixed(s.value)}function d(e){let n=parseFloat(e);return n>a.max&&(n=a.max),n<a.min&&(n=a.min),n}function h(e){if(Number.isNaN(parseFloat(e)))a.value?o.value=f():a.formatter&&(o.value=a.formatter(e));else{const n=d(e);n!==a.value?p(n):o.value=f()}}function S(e){if(!b.value){const n=e.target,r=a.parser?String(a.parser(n.value)):n.value;r&&!Number.isNaN(d(r))&&d(r)!==a.value&&h(r),!r&&a.value!==void 0&&p(void 0)}}function F(e){const n=e.target,r=a.parser?String(a.parser(n.value)):n.value;h(r)}function $(e){e.key==="ArrowUp"&&w(),e.key==="ArrowDown"&&g()}function z(e){if(v("enter",e),b.value){const n=e.target,r=a.parser?String(a.parser(n.value)):n.value;h(r)}}function w(){const e=Math.min(a.max,c.add(a.value||0,+a.step)).toFixed(s.value);p(d(e))}function g(){const e=Math.max(a.min,c.add(a.value||0,-a.step)).toFixed(s.value);p(d(e))}return(e,n)=>(t.openBlock(),t.createElementBlock("div",{tabindex:"1",class:t.normalizeClass(["input-number-wrap",{"input-number-disabled":e.disabled}]),style:t.normalizeStyle(`
      --input-number-width: ${k.value};
      --input-number-primary-color: ${t.unref(m)[5]};
      --input-number-primary-color-hover: ${t.unref(m)[4]};
      --input-number-primary-color-focus: ${t.unref(m)[4]};
      --input-number-primary-shadow-color: ${t.unref(x)};
    `)},[t.createElementVNode("div",I,[C.value?(t.openBlock(),t.createElementBlock("span",K,[t.renderSlot(e.$slots,"prefix",{},()=>[t.createTextVNode(t.toDisplayString(e.prefix),1)],!0)])):t.createCommentVNode("",!0),t.withDirectives(t.createElementVNode("input",{ref_key:"inputRef",ref:u,class:"input-number",autocomplete:"off",disabled:e.disabled,placeholder:e.placeholder,"onUpdate:modelValue":n[0]||(n[0]=r=>o.value=r),onInput:S,onChange:F,onKeydown:[n[1]||(n[1]=t.withKeys(t.withModifiers(()=>{},["prevent"]),["up"])),n[2]||(n[2]=r=>e.keyboard?$(r):()=>!1),t.withKeys(t.withModifiers(z,["prevent"]),["enter"])]},null,40,L),[[t.vModelText,o.value]])]),t.createElementVNode("div",P,[t.createElementVNode("span",{class:t.normalizeClass(["input-number-arrow up-arrow",{"arrow-disabled":(e.value||0)>=e.max}]),onClick:n[3]||(n[3]=r=>(e.value||0)>=e.max?()=>!1:w())},[...n[5]||(n[5]=[t.createElementVNode("svg",{class:"icon-svg",focusable:"false","data-icon":"up",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},[t.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),t.createElementVNode("span",{class:t.normalizeClass(["input-number-arrow down-arrow",{"arrow-disabled":(e.value||0)<=e.min}]),onClick:n[4]||(n[4]=r=>(e.value||0)<=e.min?()=>!1:g())},[...n[6]||(n[6]=[t.createElementVNode("svg",{class:"icon-svg",focusable:"false","data-icon":"down",width:"1em",height:"1em",fill:"currentColor","aria-hidden":"true",viewBox:"64 64 896 896"},[t.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;