react-native-international-phone-number 0.4.10 → 0.4.12
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 +21 -4
- package/lib/index.js +4 -1
- package/lib/interfaces/phoneInputProps.ts +1 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
<img src="https://img.shields.io/npm/v/react-native-international-phone-number.svg?style=flat-square">
|
|
12
12
|
</a>
|
|
13
13
|
<a href="https://www.npmjs.com/package/react-native-international-phone-number">
|
|
14
|
-
<img src="https://img.shields.io/npm/
|
|
14
|
+
<img src="https://img.shields.io/npm/dt/react-native-international-phone-number.svg?style=flat-square&color=success">
|
|
15
15
|
</a>
|
|
16
16
|
<a href="https://github.com/AstrOOnauta/react-native-international-phone-number">
|
|
17
17
|
<img src="https://img.shields.io/github/stars/AstrOOnauta/react-native-international-phone-number?style=flat-square&color=success"/>
|
|
@@ -29,6 +29,12 @@
|
|
|
29
29
|
|
|
30
30
|
<br>
|
|
31
31
|
|
|
32
|
+
<div align = "center">
|
|
33
|
+
<a href="https://www.buymeacoffee.com/astroonauta" target="_blank">
|
|
34
|
+
<img src="https://survivingmexico.files.wordpress.com/2018/07/button-gif.gif" alt="Buy Me A Coffee" style="height: auto !important;width: 60% !important;">
|
|
35
|
+
</a>
|
|
36
|
+
</div>
|
|
37
|
+
|
|
32
38
|
## Try it out
|
|
33
39
|
|
|
34
40
|
- [Demo](https://snack.expo.dev/@astroonauta/react-native-international-phone-number)
|
|
@@ -47,9 +53,10 @@
|
|
|
47
53
|
- [Customizing Lib](#customizing-lib)
|
|
48
54
|
- [Dark Mode](#dark-mode)
|
|
49
55
|
- [Custom Lib Styles](#custom-lib-styles)
|
|
50
|
-
- [Disabled Mode](#disabled-mode)
|
|
56
|
+
- [Phone Input Disabled Mode](#phone-input-disabled-mode)
|
|
57
|
+
- [Country Modal Disabled Mode](#country-modal-disabled-mode)
|
|
51
58
|
- [Custom Disabled Mode Style](#custom-disabled-mode-style)
|
|
52
|
-
- [Lib Props](#props)
|
|
59
|
+
- [Lib Props](#component-props-phoneinputprops)
|
|
53
60
|
- [Lib Functions](#functions)
|
|
54
61
|
- [Contributing](#contributing)
|
|
55
62
|
- [License](#license)
|
|
@@ -467,7 +474,7 @@ export default function App() {
|
|
|
467
474
|
/>
|
|
468
475
|
```
|
|
469
476
|
|
|
470
|
-
- ### Disabled Mode:
|
|
477
|
+
- ### Phone Input Disabled Mode:
|
|
471
478
|
|
|
472
479
|
```jsx
|
|
473
480
|
<PhoneInput
|
|
@@ -476,6 +483,15 @@ export default function App() {
|
|
|
476
483
|
/>
|
|
477
484
|
```
|
|
478
485
|
|
|
486
|
+
- ### Country Modal Disabled Mode:
|
|
487
|
+
|
|
488
|
+
```jsx
|
|
489
|
+
<PhoneInput
|
|
490
|
+
...
|
|
491
|
+
modalDisabled
|
|
492
|
+
/>
|
|
493
|
+
```
|
|
494
|
+
|
|
479
495
|
- ### Custom Disabled Mode Style:
|
|
480
496
|
|
|
481
497
|
```jsx
|
|
@@ -500,6 +516,7 @@ export default function App() {
|
|
|
500
516
|
- `selectedCountry:` undefined | [ICountry](https://github.com/AstrOOnauta/react-native-international-phone-number/blob/master/lib/interfaces/country.ts);
|
|
501
517
|
- `onChangeSelectedCountry:` (country: [ICountry](https://github.com/AstrOOnauta/react-native-international-phone-number/blob/master/lib/interfaces/country.ts)) => void;
|
|
502
518
|
- `disabled?:` boolean;
|
|
519
|
+
- `modalDisabled?:` boolean;
|
|
503
520
|
- `withDarkTheme?:` boolean;
|
|
504
521
|
- `containerStyle?:` StyleProp<[ViewStyle](https://reactnative.dev/docs/view-style-props)>;
|
|
505
522
|
- `flagContainerStyle?:` StyleProp<[ViewStyle](https://reactnative.dev/docs/view-style-props)>;
|
package/lib/index.js
CHANGED
|
@@ -26,6 +26,7 @@ function PhoneInput({
|
|
|
26
26
|
inputStyle,
|
|
27
27
|
withDarkTheme,
|
|
28
28
|
disabled,
|
|
29
|
+
modalDisabled,
|
|
29
30
|
defaultValue,
|
|
30
31
|
onChangePhoneNumber,
|
|
31
32
|
selectedCountry,
|
|
@@ -171,7 +172,9 @@ function PhoneInput({
|
|
|
171
172
|
countryCode={
|
|
172
173
|
selectedCountry ? selectedCountry.cca2 : defaultCca2
|
|
173
174
|
}
|
|
174
|
-
modalProps={
|
|
175
|
+
modalProps={
|
|
176
|
+
disabled || modalDisabled ? { visible: false } : {}
|
|
177
|
+
}
|
|
175
178
|
/>
|
|
176
179
|
<TextInput
|
|
177
180
|
style={[
|
|
@@ -15,6 +15,7 @@ export interface PhoneInputProps extends TextInputProps {
|
|
|
15
15
|
inputStyle?: StyleProp<TextStyle>;
|
|
16
16
|
withDarkTheme?: boolean;
|
|
17
17
|
disabled?: boolean;
|
|
18
|
+
modalDisabled?: boolean;
|
|
18
19
|
defaultValue?: string;
|
|
19
20
|
value: string;
|
|
20
21
|
onChangePhoneNumber: (phoneNumber: string) => void;
|
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.4.
|
|
4
|
+
"version": "0.4.12",
|
|
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",
|