react-native-international-phone-number 0.8.5 → 0.8.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +12 -0
- package/lib/index.js +4 -1
- package/lib/utils/getCountryByPhoneNumber.js +4 -2
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -92,6 +92,7 @@
|
|
|
92
92
|
- [Lib Props](#component-props-phoneinputprops)
|
|
93
93
|
- [Lib Functions](#functions)
|
|
94
94
|
- [Supported languages](#🎌-supported-languages-🎌)
|
|
95
|
+
- [Testing](#testing)
|
|
95
96
|
- [Contributing](#contributing)
|
|
96
97
|
- [License](#license)
|
|
97
98
|
|
|
@@ -802,6 +803,17 @@ export default function App() {
|
|
|
802
803
|
|
|
803
804
|
<br>
|
|
804
805
|
|
|
806
|
+
## Testing
|
|
807
|
+
|
|
808
|
+
When utilizing this package, you may need to target the PhoneInput component in your automated tests. To facilitate this, we provide a testID props for the PhoneInput component. The testID can be integrated with popular testing libraries such as @testing-library/react-native or Maestro. This enables you to efficiently locate and interact with PhoneInput elements within your tests, ensuring a robust and reliable testing experience.
|
|
809
|
+
|
|
810
|
+
```jsx
|
|
811
|
+
// Assuming PhoneInput has testID="phone-number"
|
|
812
|
+
const phoneInput = getByTestId('phone-number-flag');
|
|
813
|
+
```
|
|
814
|
+
|
|
815
|
+
<br>
|
|
816
|
+
|
|
805
817
|
## Contributing
|
|
806
818
|
|
|
807
819
|
- Fork or clone this repository
|
package/lib/index.js
CHANGED
|
@@ -69,6 +69,7 @@ const PhoneInput = forwardRef(
|
|
|
69
69
|
customCaret,
|
|
70
70
|
rtl,
|
|
71
71
|
allowZeroAfterCallingCode,
|
|
72
|
+
testID,
|
|
72
73
|
...rest
|
|
73
74
|
},
|
|
74
75
|
ref
|
|
@@ -120,6 +121,7 @@ const PhoneInput = forwardRef(
|
|
|
120
121
|
customCaret,
|
|
121
122
|
rtl,
|
|
122
123
|
allowZeroAfterCallingCode,
|
|
124
|
+
testID,
|
|
123
125
|
...rest,
|
|
124
126
|
},
|
|
125
127
|
};
|
|
@@ -332,7 +334,7 @@ const PhoneInput = forwardRef(
|
|
|
332
334
|
// Create a separate constant for each part of the component
|
|
333
335
|
const touchableStart = (
|
|
334
336
|
<>
|
|
335
|
-
<Text style={getFlagStyle(phoneInputStyles?.flag)}>
|
|
337
|
+
<Text testID={`${testID}-flag`} style={getFlagStyle(phoneInputStyles?.flag)}>
|
|
336
338
|
{countryValue?.flag}
|
|
337
339
|
</Text>
|
|
338
340
|
{customCaret || (
|
|
@@ -473,6 +475,7 @@ const PhoneInput = forwardRef(
|
|
|
473
475
|
showOnly={showOnly}
|
|
474
476
|
excludedCountries={excludedCountries}
|
|
475
477
|
popularCountries={popularCountries}
|
|
478
|
+
testID={testID}
|
|
476
479
|
ListHeaderComponent={({ countries, lang, onPress }) => {
|
|
477
480
|
return (
|
|
478
481
|
<View>
|
|
@@ -43,8 +43,10 @@ export default function getCountryByPhoneNumber(phoneNumber) {
|
|
|
43
43
|
matchingCountry = {
|
|
44
44
|
...matchingCountries[i],
|
|
45
45
|
callingCode:
|
|
46
|
-
matchingCountries[i].callingCode +
|
|
47
|
-
|
|
46
|
+
matchingCountries[i].callingCode === '+1'
|
|
47
|
+
? matchingCountries[i].callingCode +
|
|
48
|
+
item.replace(/\D/g, '')
|
|
49
|
+
: matchingCountries[i].callingCode,
|
|
48
50
|
phoneMasks: [item.replace(/[0-9]/g, '').trim()],
|
|
49
51
|
};
|
|
50
52
|
}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-native-international-phone-number",
|
|
3
3
|
"author": "AstrOOnauta (https://github.com/AstrOOnauta)",
|
|
4
|
-
"version": "0.8.
|
|
4
|
+
"version": "0.8.7",
|
|
5
5
|
"description": "International mobile phone input component with mask for React Native",
|
|
6
6
|
"main": "lib/index.js",
|
|
7
7
|
"types": "lib/index.d.ts",
|