How set 9 as require digit in mask?

[erokhovama]

I use react-native-masked-text. I made custom mask for Russian phone number - '+7 (999) 999-99-99'. All is cool, but I need that first digit 9 will be require digit and user can't put other digit after 7. How can I do it?

My code:

<TextInputMask
type={'custom'}
options={{
mask: '+7 (999) 999-99-99'
}}
value={text}
onChangeText={(text) => onEdit(text)}
style={styles.text}
editable={editable}
clearButtonMode={editable ? 'always' : 'never'}
/>

[kommandantee]

You can use mask service as,
import { MaskService } from 'react-native-masked-text';
and with Mask Service

const [phone, setPhone] = React.useState<string>();

const maskPhone = (phone) => {
   var maskedPhone = MaskService.toMask('custom', phone, {
    mask: '+7 (9**) *** ** **',
      translation: {
      // this is a custom translation. The others (9, A, S, *) still works.
      // this translation will be merged and turns into 9, A, S, *, #.
      '#': function(val) {
        if (val === ' ') {
          return val;
        }
        return null;
      },
      '9': function(val) {
        return [' ', '#', ',', '.', '!'].indexOf(val) >= 0 ? val : null;
      },
    }
      });
    console.log(maskedPhone);
    setPhone(maskedPhone);
  }

After that you can use this function in a component whatever you want as,

<Input
            style={styles.formInput}
            textStyle={{
              fontSize: 16
              }}
            placeholder='Phone Number'
            keyboardType="phone-pad"
            value={phone}
            onChangeText={val => maskPhone(val)}
          />