diff --git a/src/lib/elements/forms/inputNumber.svelte b/src/lib/elements/forms/inputNumber.svelte index 71d08161f..7b63b8dbd 100644 --- a/src/lib/elements/forms/inputNumber.svelte +++ b/src/lib/elements/forms/inputNumber.svelte @@ -18,6 +18,18 @@ let error: string; + function coerceToNumber(event: Event & { currentTarget: EventTarget & HTMLInputElement }) { + const raw = event.currentTarget?.value ?? ''; + + if (raw === '') { + value = nullable ? null : (undefined as unknown as number); + return; + } + + const parsed = step === 'any' ? Number.parseFloat(raw) : Number.parseInt(raw, 10); + value = Number.isNaN(parsed) ? null : parsed; + } + const handleInvalid = (event: Event & { currentTarget: EventTarget & HTMLInputElement }) => { event.preventDefault(); @@ -39,7 +51,7 @@ error = event.currentTarget.validationMessage; }; - $: if (value) { + $: if (value !== null && value !== undefined && !Number.isNaN(value)) { error = null; } @@ -61,7 +73,8 @@ helper={error || helper} state={error ? 'error' : 'default'} on:invalid={handleInvalid} - on:input> + on:input={coerceToNumber} + on:change={coerceToNumber}>