@aotearoan/neon/dist/components/user-input/number/NeonNumber.cjs.js

Neon is a lightweight design library of Vue 3 components with minimal dependencies.

"use strict";const u=require("vue"),g=require("../../../model/common/color/NeonFunctionalColor.cjs.js"),S=require("../../../model/common/size/NeonSize.cjs.js"),q=require("../../../model/user-input/input/NeonInputMode.cjs.js"),F=require("../button/NeonButton.vue.cjs.js"),B=require("../field-group/NeonFieldGroup.vue.cjs.js"),x=require("../input/NeonInput.vue.cjs.js"),s=require("../../../utils/common/number/NeonNumberUtils.cjs.js"),M=u.defineComponent({name:"NeonNumber",components:{NeonButton:F,NeonFieldGroup:B,NeonInput:x},props:{id:{type:String,default:null},modelValue:{type:Number,default:null},min:{type:Number,required:!1},max:{type:Number,required:!1},step:{type:Number,required:!1},color:{type:String,default:g.NeonFunctionalColor.Primary},size:{type:String,default:S.NeonSize.Medium},locale:{type:String,default:null},placeholder:{type:String,default:null},disabled:{type:Boolean,default:!1},editable:{type:Boolean,default:!0},spinButtons:{type:Boolean,default:!1},percentage:{type:Boolean,default:!1},decimals:{type:Number,required:!1},valueTemplate:{type:String,required:!1},inputmode:{type:String,default:q.NeonInputMode.Numeric},incrementLabel:{type:String,default:"Increment"},decrementLabel:{type:String,default:"Decrement"}},emits:["update:modelValue"],setup(e,{emit:f}){const N=u.useAttrs(),o=u.ref(!1),i=t=>{e.disabled||f("update:modelValue",t)},v=u.computed(()=>{const{onBlur:t,onFocus:l,...d}=N;return d}),V=t=>{const l=s.NeonNumberUtils.parseNumber(t),d=t!==""&&t!==null?Math.max(Math.min(l,e.max??Number.MAX_SAFE_INTEGER),e.min??Number.MIN_SAFE_INTEGER):null;(d===null||!isNaN(l))&&i(d)},n=u.computed(()=>e.decimals??(e.percentage?0:void 0)),a=u.computed(()=>e.percentage&&n.value!==void 0?n.value+2:n.value),m=u.computed(()=>{const t=e.modelValue!==null?+e.modelValue:e.min??0;return a.value!==void 0?Number(t.toFixed(a.value)):t}),b=u.computed(()=>e.modelValue!==null&&(e.valueTemplate!==void 0||n.value!==void 0||e.percentage!==void 0)?s.NeonNumberUtils.formatNumber(e.modelValue,{decimals:n.value,format:e.valueTemplate,percentage:e.percentage},e.locale):e.modelValue),c=u.computed(()=>a.value!==void 0&&e.modelValue!==null?e.modelValue.toFixed(a.value):e.modelValue===null?"":`${e.modelValue}`),y=u.computed(()=>o.value?c.value!==void 0?`${c.value}`:"":b.value),r=u.computed(()=>e.step??(e.percentage?.01:1));return{focus:o,sanitizedAttributes:v,computedDecimals:n,computedRawDecimals:a,computedValue:m,computedStep:r,displayValue:y,valueChanged:V,increment:()=>{const t=m.value+r.value,l=e.max!==void 0?Math.min(e.max,t):t;l!==e.modelValue&&i(l)},decrement:()=>{const t=m.value-r.value,l=e.min!==void 0?Math.max(e.min,t):t;l!==e.modelValue&&i(l)},onFocus:()=>o.value=!0,onBlur:()=>o.value=!1}}});module.exports=M;
//# sourceMappingURL=NeonNumber.cjs.js.map