If number input is empty, make 0 when focus is lost

This commit is contained in:
Ensar KURT 2025-03-17 01:25:14 +03:00 committed by GitHub
parent 75fc030984
commit 12d31c89f3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -39,7 +39,7 @@ const NumberInput = React.forwardRef<HTMLInputElement, InputProps>(
className={cn("text-left", className)}
ref={ref}
{...props}
value={props.value === undefined ? undefined : String(props.value)}
value={props.value === undefined || props.value === "" ? "" : String(props.value)}
onChange={(e) => {
const value = e.target.value;
if (value === "") {
@ -60,6 +60,21 @@ const NumberInput = React.forwardRef<HTMLInputElement, InputProps>(
}
}
}}
onBlur={(e) => {
// If input is empty, make 0 when focus is lost
if (e.target.value === "") {
const syntheticEvent = {
...e,
target: {
...e.target,
value: "0",
},
};
props.onChange?.(
syntheticEvent as unknown as React.ChangeEvent<HTMLInputElement>,
);
}
}}
/>
);
},