Can I make the NumberField empty, but controlled?

[petertflem]

The NumberField has a value prop that is typed to number | undefined. So if I don't have a value, it will be undefined. When I then type a value in the field, since the state is controlled by a parent component, I get a warning:

WARN: A component changed from uncontrolled to controlled.

According to what I have found, the recommendation is to just use an empty string so that the input is controlled from the start. Passing undefined makes it uncontrolled.

However, with that type definition I can't pass an empty string, and if I try to force it, it is parsed to 0, which I can't use as a default value.

<NumberField
  value={""} // <- How can I do this?
  ...
/>

I get the type safety, but in this case I would like to break it, leaving the number input blank, but controlled.

Any tips?

[devongovett]

I think setting it to NaN should work

[petertflem]

Yes, that worked! Thank you, that did not cross my mind 😀