CaioQuirinoMedeiros / react-native-mask-input

🎭:iphone: A simple and effective Text Input with mask for ReactNative on iOS and Android. Includes obfuscation characters feature.
https://www.npmjs.com/package/react-native-mask-input
MIT License
305 stars 31 forks source link

useMaskedInputProps should pass unmasked as second parameter to onChangeText #24

Closed asfandyarsheikh closed 1 year ago

asfandyarsheikh commented 2 years ago

The mask is only for show and there should be another parameter called unmasked that passes unformatted, raw text to the function. The raw value should also be converted to masked one.

import { Input } from 'native-base'
import { Masks } from 'react-native-mask-input';

function MyComponent() {
  const [phone, setPhone] = React.useState('');

  const maskedInputProps = useMaskedInputProps({
    value: phone, // <------ This should be unmasked value and should be converted by hook to masked
    onChangeText: setPhone, // <---------------- This should also pass unmasked value as second parameter
    mask: Masks.BRL_PHONE,
  });

  return <Input {...maskedInputProps} />
}
robbporto commented 1 year ago

This was already implemented, @asfandyarsheikh.

CaioQuirinoMedeiros commented 1 year ago

This is working correctly, the value can be masked or unmasked and the function does receive unmasked value as second parameter (also receive obfuscated value as third parameter)