UNPKG

vue-amazing-ui

Version:

An Amazing Vue3 UI Components Library, Using TypeScript.

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