@canutin/svelte-currency-input 0.10.0 → 0.10.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CurrencyInput.svelte +10 -4
- package/package.json +1 -1
package/CurrencyInput.svelte
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
<script>
|
|
1
|
+
<script>import { onMount } from "svelte";
|
|
2
|
+
const DEFAULT_LOCALE = 'en-US';
|
|
2
3
|
const DEFAULT_CURRENCY = 'USD';
|
|
3
4
|
const DEFAULT_NAME = 'total';
|
|
4
5
|
const DEFAULT_VALUE = 0;
|
|
@@ -40,6 +41,11 @@ const handleKeyDown = (event) => {
|
|
|
40
41
|
if (!isDeletion && !isModifier && !isArrowKey && isInvalidCharacter && !isTab)
|
|
41
42
|
event.preventDefault();
|
|
42
43
|
};
|
|
44
|
+
// Formats the value when the input loses focus and sets the correct number of
|
|
45
|
+
// fraction digits when the value is zero
|
|
46
|
+
const handleOnBlur = () => setFormattedValue(true);
|
|
47
|
+
// Also set the correct fraction digits when the value is zero on initial load
|
|
48
|
+
onMount(() => setFormattedValue(true));
|
|
43
49
|
let inputTarget;
|
|
44
50
|
const currencyDecimal = new Intl.NumberFormat(locale).format(1.1).charAt(1); // '.' or ','
|
|
45
51
|
const isDecimalComma = currencyDecimal === ',';
|
|
@@ -96,12 +102,12 @@ const setUnformattedValue = (event) => {
|
|
|
96
102
|
}
|
|
97
103
|
}
|
|
98
104
|
};
|
|
99
|
-
const setFormattedValue = () => {
|
|
105
|
+
const setFormattedValue = (hasMinFractionDigits) => {
|
|
100
106
|
// Previous caret position
|
|
101
107
|
const startCaretPosition = inputTarget?.selectionStart || 0;
|
|
102
108
|
const previousFormattedValueLength = formattedValue.length;
|
|
103
109
|
// Apply formatting to input
|
|
104
|
-
formattedValue = isZero ? '' : formatCurrency(value, fractionDigits, 0);
|
|
110
|
+
formattedValue = isZero ? '' : formatCurrency(value, fractionDigits, hasMinFractionDigits ? fractionDigits : 0);
|
|
105
111
|
// Update `value` after formatting
|
|
106
112
|
setUnformattedValue();
|
|
107
113
|
let retries = 0;
|
|
@@ -150,7 +156,7 @@ $: value, setFormattedValue();
|
|
|
150
156
|
bind:value={formattedValue}
|
|
151
157
|
on:keydown={handleKeyDown}
|
|
152
158
|
on:keyup={setUnformattedValue}
|
|
153
|
-
on:blur={
|
|
159
|
+
on:blur={handleOnBlur}
|
|
154
160
|
/>
|
|
155
161
|
</div>
|
|
156
162
|
|