dxc-technology / halstack-react

Library of components for building SPAs with React and Halstack Design System
https://developer.dxc.com/halstack/
Apache License 2.0
15 stars 14 forks source link

Number Input support for numbers with a dot and no decimals #1668

Open GomezIvann opened 1 year ago

GomezIvann commented 1 year ago

As @fredofm explains in the issue #1660, when you type:

"1," -> the component transforms this value into "1". It can make sense because as you didn't type the fractional part it will return the integer one. "1." -> the component transforms this value into "". It can make sense but I would expect the same behaviour as "1,".

As I explained in the comments of that issue, it looks like it is a bug from the HTML <input type=" number" />, which understands the comma as a decimal number when there are no decimals at all (1,, 12,, 4483,, ...) but doesn't apply the same logic on the dotted ones.

So, the feature here is to make the component behave consistently for both scenarios since they are variants of the same use case.

Mil4n0r commented 8 months ago

I have done some research about how the HTML5 input with type="number" works and it is quite limited in all the modern browsers due to the fact that it adapts to the browser locale. The issue that you explain can be "turned around" if you try to use the component from, for example, an "en-US" browser.

However, it is complicated to be handled to handle all the cases, I have 2 proposals:

  1. Handle numbers as an input with type="text" and handle all the possible scenarios in code.
  2. Add a prop "separator" (with a default value) to the NumberInputContextProps in order for the wrapped DxcTextInput component to handle the logic based on it.

If you have any other suggestion, feel free to share!

github-actions[bot] commented 7 months ago

This issue is stale because it has been open for 15 days with no activity. If there are no further updates or modifications within the next 15 days, it will be automatically closed.