EuiRange show empty string in input when value is empty

[nreese]

EuiRange value converts the value prop to a Number before passing the value to EuiFieldNumber. This causes empty strings to get converted to zero and display zero even though the value is an empty string.

EuiRange should allow empty string values and display and empty input when the value is an empty string.

[cchaos]

That type of functionality doesn't align with the HTML input[type=range]'s value prop:

The value attribute contains a DOMString which contains a string representation of the selected number. The value is never an empty string ("").
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/range#Value

What is a use case where the value should actually ever be null?

[nreese]

The usecase is just better interactivity.

Here is an example work flow

• The input contains the value 10
• The user wants 30
• the user selects the current value and deletes. The box should be empty so the user can then type the desired value. Instead the value is now 0 and the cursor is on the right of the 0. The user has to do some work to type the desired value.

The input should be allowed to be blank for work flows like these.

[cchaos]

Ahh I see. I think we can handle that use case. It will probably have to do some validation and it might make the input temporarily invalid (show a red border) so it doesnt try to pass an empty string to the range until they've typed a valid number.

Thanks for the clarification.

[nreese]

that would be great. The same would happen if the range is outside of the min/max

[thompsongl]

#1485 incorporated the changes from #1461 that fixed this. Closing.