vueless 0.0.777 → 0.0.779

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vueless",
-  "version": "0.0.777",
+  "version": "0.0.779",
   "license": "MIT",
   "description": "Vue Styleless UI Component Library, powered by Tailwind CSS.",
   "keywords": [

package/ui.form-input-money/UInputMoney.vue

@@ -8,9 +8,10 @@ import UInput from "../ui.form-input/UInput.vue";
 
 import defaultConfig from "./config.ts";
 import useFormatCurrency from "./useFormatCurrency.ts";
-import { COMPONENT_NAME } from "./constants.ts";
+import { COMPONENT_NAME, RAW_DECIMAL_MARK } from "./constants.ts";
 
 import type { Props, Config } from "./types.ts";
+import { getRawValue } from "./utilFormat.ts";
 
 defineOptions({ inheritAttrs: false });
 
@@ -52,9 +53,16 @@ const input = computed(() => {
   return moneyInputRef.value?.inputRef || null;
 });
 
-const stringLocalValue = computed(() =>
-  Object.is(localValue.value, -0) ? "-0" : String(localValue.value),
-);
+const stringLocalValue = computed(() => {
+  if (Object.is(localValue.value, -0)) return "-0";
+
+  const currentRawValue = getRawValue(String(localValue.value), props);
+  const fraction = String(currentRawValue).split(RAW_DECIMAL_MARK).at(1) || "";
+
+  return props.valueType === "number" && !Number.isNaN(parseFloat(String(localValue.value)))
+    ? parseFloat(String(localValue.value)).toFixed(fraction.length)
+    : String(localValue.value);
+});
 
 watch(
   () => props.modelValue,
@@ -67,6 +75,7 @@ watch(
 
 onMounted(() => {
   if (localValue.value) {
+    // console.log(localValue.value);
     setValue(stringLocalValue.value);
   }
 });

package/ui.form-input-money/constants.ts

@@ -3,3 +3,5 @@
  `defineProps` is referencing locally declared variables. (vue/valid-define-props)
  */
 export const COMPONENT_NAME = "UInputMoney";
+
+export const RAW_DECIMAL_MARK = ".";

package/ui.form-input-money/useFormatCurrency.ts

@@ -2,10 +2,11 @@ import { onMounted, nextTick, ref, onBeforeUnmount, toValue, watch, computed, re
 
 import { getRawValue, getFormattedValue } from "./utilFormat.ts";
 
+import { RAW_DECIMAL_MARK } from "./constants.ts";
+
 import type { FormatOptions } from "./types.ts";
 
 const digitSet = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"];
-const rawDecimalMark = ".";
 const comma = ",";
 const minus = "-";
 
@@ -83,7 +84,7 @@ export default function useFormatCurrency(
 
     const endsWithDecimal = formattedValue.value.endsWith(options.value.decimalSeparator);
 
-    if ((event.key === comma || event.key === rawDecimalMark) && endsWithDecimal) {
+    if ((event.key === comma || event.key === RAW_DECIMAL_MARK) && endsWithDecimal) {
       event.preventDefault();
 
       return;
@@ -120,7 +121,7 @@ export default function useFormatCurrency(
     }
 
     // Replace dot with decimal separator
-    if (eventData === rawDecimalMark || eventData === comma) {
+    if (eventData === RAW_DECIMAL_MARK || eventData === comma) {
       value = [
         ...prevValue.value.slice(0, prevCursorPosition),
         options.value.decimalSeparator,
@@ -145,7 +146,6 @@ export default function useFormatCurrency(
       !options.value.minFractionDigits
     ) {
       formattedValue.value = value;
-
       rawValue.value = newRawValue;
 
       return;
@@ -156,7 +156,7 @@ export default function useFormatCurrency(
     const isDoubleMinus = isMinus && prevValue.value.startsWith(minus);
     const isMinusWithin = newRawValue.includes(minus) && !newRawValue.startsWith(minus);
 
-    const isReservedSymbol = eventData !== rawDecimalMark && eventData !== comma;
+    const isReservedSymbol = eventData !== RAW_DECIMAL_MARK && eventData !== comma;
 
     if (
       (!isNumericValue && isReservedSymbol && !isMinus && eventData.length === 1) ||
@@ -172,7 +172,15 @@ export default function useFormatCurrency(
       return;
     }
 
-    const newFormattedValue = getFormattedValue(newRawValue, options.value);
+    const currentFraction = (newRawValue.split(RAW_DECIMAL_MARK).at(1) || "").slice(
+      0,
+      options.value.maxFractionDigits,
+    );
+
+    const newFormattedValue = getFormattedValue(newRawValue, {
+      ...options.value,
+      minFractionDigits: currentFraction.length,
+    });
 
     if (Number.isNaN(newFormattedValue) || newFormattedValue.includes("NaN")) {
       inputElement.value = prevValue.value;

package/ui.form-input-money/utilFormat.ts

@@ -1,6 +1,6 @@
-import type { FormatOptions } from "./types.ts";
+import { RAW_DECIMAL_MARK } from "./constants.ts";
 
-const rawDecimalMark = ".";
+import type { FormatOptions } from "./types.ts";
 
 export function getRawValue(
   value: string,
@@ -12,7 +12,7 @@ export function getRawValue(
 
   const rawValueWithPrefix = value
     .replaceAll(thousandsSeparator, "")
-    .replace(decimalSeparator, rawDecimalMark);
+    .replace(decimalSeparator, RAW_DECIMAL_MARK);
 
   return rawValueWithPrefix.replace(prefix, "") as Intl.StringNumericLiteral;
 }