[](https://www.npmjs.com/package/@fooloomanzoo/number-input) [](https://www.webcomponents.org/element/@fooloomanzoo/number-input) _[API & Demo](https://fooloomanzoo.github.io/number-input)_ ## \ An input for numeric values. ### Motivation The normal `input` with `type="number"` is fairly good to use, but it has some flaws, because it should if wanted e.g.: * prevent non numeric input * guarantee **live**-data to be valid * use the local decimal separator * pad a value with `0` (to a specific length) * size the input (according to it's length) * overflow to minimum or underflow to maximum * saturate to minimum or to maximum * display a specified unit * display a specified currencies * can use percentage values and do have automatically the correct decimal value This element wants to achieve that, by using the [Intl.NumberFormat API](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/NumberFormat). A more simpler element \ just uses integer values and doesn't use units or percent values.  ### Example ```html using units:
in percent:
using currencies:
as integer: ``` ### Styling Have a look at [input-picker-pattern#input-shared-style](https://github.com/fooloomanzoo/input-picker-pattern#input-shared-style) to see how to style the element. ### Installation ``` npm i @fooloomanzoo/number-input ``` ### License [MIT](https://github.com/fooloomanzoo/number-input/blob/master/LICENSE.txt)