s-yadav / react-number-format

React component to format numbers in an input or as a text.
MIT License
3.9k stars 410 forks source link

percentage formatting, input box <=> form state mismatch #826

Open naseemkullah opened 9 months ago

naseemkullah commented 9 months ago

similar to #825

with something like

format={(value: string) => {
  const stripped = value.replace(/\D/g, '');
  return stripped ? `${stripped}%` : '';
}}

and an isAllowed rule allowing just 1 to 100 values, typing e.g. "555" results in 55% displayed visually, but 555 in the form state value.

Using with react-hook-form FWIW.