react-number-format
react-number-format copied to clipboard
add support for paste event given allowedDecimalSeparators
Describe the issue/change
Described here https://github.com/s-yadav/react-number-format/issues/349 by @tenkij
Add CodeSandbox link to illustrate the issue (If applicable)
Describe specs for failing cases if this is an issue (If applicable)
allowedDecimalSeparators={[",", "."]}
decimalSeparator='.'
- paste '11.11', result '11.11';
- paste '11,11', result '1 111'
decimalSeparator=','
- paste '11.11', result '1 111';
- paste '11,11', result '11,11'
Describe the changes proposed/implemented in this PR
Now the paste works with both cases
https://user-images.githubusercontent.com/9840635/123081289-1a488600-d41e-11eb-8a97-002850e185bd.mp4
Please check which browsers were used for testing
- [x] Chrome
- [ ] Chrome (Android)
- [ ] Safari (OSX)
- [ ] Safari (iOS)
- [x] Firefox
- [ ] Firefox (Android)
Quick hack-solution before it gets merged
const DemoField = useMemo(() => NumberFormatCommaPasteHackTextField(setValue), []);
const NumberFormatCommaPasteHackTextField = (setValue) =>
(props) => {
return <TextField
{...props}
onPaste={(e) => {
let pastedText = e.clipboardData.getData('text');
if (pastedText.indexOf(',') !== -1) {
e.preventDefault();
setValue(pastedText.replace(',', '.'));
}
}}
/>
}
return <NumberFormat
customInput={DemoField}
allowedDecimalSeparators={[",", "."]}
decimalSeparator={'.'}
thousandSeparator=" "
/>
Can you also please add a related documentation in README.md file for this prop?
Also, although things look good, I would still prefer another review done by @s-yadav to ensure all perspectives are considered and we don't miss anything. I appreciate your patients on this on this! Thanks!
Done. Waiting for the second review :)
@s-yadav can we ask for your review on this? This would be a very helpful feature. Thank you
any updates? )
any updates?
Nope, feel free to take it over
The issue still persist in latest version - @s-yadav Can I help you to finish this PR?