react-simple-phone-input 5.2.2 → 5.2.5

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.
@@ -1,162 +1,162 @@
1
- .simple-phone-input-sri198-container {
2
- position: relative;
3
- }
4
-
5
- .simple-phone-input-sri198-container:focus,
6
- .simple-phone-input-sri198-container:focus-visible,
7
- .simple-phone-input-sri198-container:focus-within {
8
- outline: none;
9
- }
10
-
11
- .simple-phone-input-sri198-main {
12
- display: flex;
13
- border: 1px solid rgb(203 203 203);
14
- user-select: none;
15
- border-radius: 3px;
16
- }
17
-
18
- .simple-phone-input-sri198-dropdown-container {
19
- cursor: pointer;
20
- display: flex;
21
- align-items: center;
22
- background: rgb(231 231 231);
23
- border-right: 1px solid rgb(203 203 203);
24
- }
25
-
26
- .simple-phone-input-sri198-dropdown-container img {
27
- margin-right: 6px;
28
- }
29
-
30
- .simple-phone-input-sri198-dropdown {
31
- background: white;
32
- list-style: none;
33
- padding: 0;
34
- margin: 0;
35
- position: absolute;
36
- top: 110%;
37
- left: 0;
38
- right: 0;
39
- height: 250px;
40
- overflow-y: auto;
41
- box-shadow: 0px 4px 15px rgb(163 163 163);
42
- border-radius: 3px;
43
- transition: 0.3s ease;
44
- transform: translateY(-5px);
45
- opacity: 0;
46
- visibility: hidden;
47
- }
48
-
49
- .simple-phone-input-sri198-dropdown.active {
50
- transform: translateY(0px);
51
- opacity: 1;
52
- visibility: visible;
53
- }
54
-
55
- .simple-phone-input-sri198-dropdown li {
56
- margin: 3px 0;
57
- padding: 3px 8px;
58
- display: flex;
59
- }
60
-
61
- .simple-phone-input-sri198-dropdown li.active {
62
- background: rgba(0, 0, 0, 0.116);
63
- }
64
-
65
- .simple-phone-input-sri198-dropdown li:hover {
66
- background: rgba(0, 0, 0, 0.116);
67
- }
68
-
69
- .simple-phone-input-sri198-dropdown li img {
70
- margin-right: 6px;
71
- }
72
-
73
- .simple-phone-input-sri198-dropdown-container-button {
74
- display: flex;
75
- flex: 1;
76
- width: 92px;
77
- padding: 7px 2px 7px 7px;
78
- align-items: center;
79
- }
80
-
81
- .simple-phone-input-sri198-dropdown-container-button.dial {
82
- width: unset;
83
- padding: 8px 3px 8px 8px;
84
- }
85
-
86
- .simple-phone-input-sri198-dropdown-text {
87
- font-size: 15px;
88
- flex: 1;
89
- margin-top: 3px;
90
- }
91
-
92
- .simple-phone-input-sri198-dropdown-country-code {
93
- opacity: 0.6;
94
- margin-top: 3px;
95
- }
96
-
97
- .simple-phone-input-sri198-dropdown-icon {
98
- display: flex;
99
- align-items: center;
100
- justify-content: center;
101
- }
102
-
103
- .simple-phone-input-sri198-dropdown-icon svg {
104
- transition: 0.3s ease;
105
- }
106
-
107
- .simple-phone-input-sri198-dropdown-icon.active svg {
108
- transform: rotate(-180deg)
109
- }
110
-
111
- .simple-phone-input-sri198-selected-code {
112
- flex: 1;
113
- font-size: 14px;
114
- margin-top: 2px;
115
- }
116
-
117
- .simple-phone-input-sri198-input {
118
- width: 100%;
119
- border: none;
120
- padding: 0 10px;
121
- }
122
-
123
- .simple-phone-input-sri198-input:focus {
124
- outline: none;
125
- }
126
-
127
- .simple-phone-input-sri198-search-container {
128
- padding: 5px;
129
- position: relative;
130
- }
131
-
132
- .simple-phone-input-sri198-search-container input {
133
- border: 1px solid rgba(0, 0, 0, 0.116);
134
- padding: 8px 10px;
135
- width: 100%;
136
- font-size: 15px;
137
- border-radius: 2px;
138
- }
139
-
140
- .simple-phone-input-sri198-search-icon {
141
- position: absolute;
142
- right: 10px;
143
- top: 50%;
144
- transform: translateY(-50%);
145
- display: flex;
146
- pointer-events: none;
147
- }
148
-
149
- .simple-phone-input-sri198-search-icon svg {
150
- font-size: 20px;
151
- }
152
-
153
- .simple-phone-input-sri198-not-found {
154
- text-align: center;
155
- margin-top: 10px;
156
- font-size: 15px;
157
- color: #f73131;
158
- }
159
-
160
- .simple-phone-input-sri198-search-container input:focus {
161
- outline: none;
1
+ .simple-phone-input-sri198-container {
2
+ position: relative;
3
+ }
4
+
5
+ .simple-phone-input-sri198-container:focus,
6
+ .simple-phone-input-sri198-container:focus-visible,
7
+ .simple-phone-input-sri198-container:focus-within {
8
+ outline: none;
9
+ }
10
+
11
+ .simple-phone-input-sri198-main {
12
+ display: flex;
13
+ border: 1px solid rgb(203 203 203);
14
+ user-select: none;
15
+ border-radius: 3px;
16
+ }
17
+
18
+ .simple-phone-input-sri198-dropdown-container {
19
+ cursor: pointer;
20
+ display: flex;
21
+ align-items: center;
22
+ background: rgb(231 231 231);
23
+ border-right: 1px solid rgb(203 203 203);
24
+ }
25
+
26
+ .simple-phone-input-sri198-dropdown-container img {
27
+ margin-right: 6px;
28
+ }
29
+
30
+ .simple-phone-input-sri198-dropdown {
31
+ background: white;
32
+ list-style: none;
33
+ padding: 0;
34
+ margin: 0;
35
+ position: absolute;
36
+ top: 110%;
37
+ left: 0;
38
+ right: 0;
39
+ height: 250px;
40
+ overflow-y: auto;
41
+ box-shadow: 0px 4px 15px rgb(163 163 163);
42
+ border-radius: 3px;
43
+ transition: 0.3s ease;
44
+ transform: translateY(-5px);
45
+ opacity: 0;
46
+ visibility: hidden;
47
+ }
48
+
49
+ .simple-phone-input-sri198-dropdown.active {
50
+ transform: translateY(0px);
51
+ opacity: 1;
52
+ visibility: visible;
53
+ }
54
+
55
+ .simple-phone-input-sri198-dropdown li {
56
+ margin: 3px 0;
57
+ padding: 3px 8px;
58
+ display: flex;
59
+ }
60
+
61
+ .simple-phone-input-sri198-dropdown li.active {
62
+ background: rgba(0, 0, 0, 0.116);
63
+ }
64
+
65
+ .simple-phone-input-sri198-dropdown li:hover {
66
+ background: rgba(0, 0, 0, 0.116);
67
+ }
68
+
69
+ .simple-phone-input-sri198-dropdown li img {
70
+ margin-right: 6px;
71
+ }
72
+
73
+ .simple-phone-input-sri198-dropdown-container-button {
74
+ display: flex;
75
+ flex: 1;
76
+ width: 92px;
77
+ padding: 7px 2px 7px 7px;
78
+ align-items: center;
79
+ }
80
+
81
+ .simple-phone-input-sri198-dropdown-container-button.dial {
82
+ width: unset;
83
+ padding: 8px 3px 8px 8px;
84
+ }
85
+
86
+ .simple-phone-input-sri198-dropdown-text {
87
+ font-size: 15px;
88
+ flex: 1;
89
+ margin-top: 3px;
90
+ }
91
+
92
+ .simple-phone-input-sri198-dropdown-country-code {
93
+ opacity: 0.6;
94
+ margin-top: 3px;
95
+ }
96
+
97
+ .simple-phone-input-sri198-dropdown-icon {
98
+ display: flex;
99
+ align-items: center;
100
+ justify-content: center;
101
+ }
102
+
103
+ .simple-phone-input-sri198-dropdown-icon svg {
104
+ transition: 0.3s ease;
105
+ }
106
+
107
+ .simple-phone-input-sri198-dropdown-icon.active svg {
108
+ transform: rotate(-180deg)
109
+ }
110
+
111
+ .simple-phone-input-sri198-selected-code {
112
+ flex: 1;
113
+ font-size: 14px;
114
+ margin-top: 2px;
115
+ }
116
+
117
+ .simple-phone-input-sri198-input {
118
+ width: 100%;
119
+ border: none;
120
+ padding: 0 10px;
121
+ }
122
+
123
+ .simple-phone-input-sri198-input:focus {
124
+ outline: none;
125
+ }
126
+
127
+ .simple-phone-input-sri198-search-container {
128
+ padding: 5px;
129
+ position: relative;
130
+ }
131
+
132
+ .simple-phone-input-sri198-search-container input {
133
+ border: 1px solid rgba(0, 0, 0, 0.116);
134
+ padding: 8px 10px;
135
+ width: 100%;
136
+ font-size: 15px;
137
+ border-radius: 2px;
138
+ }
139
+
140
+ .simple-phone-input-sri198-search-icon {
141
+ position: absolute;
142
+ right: 10px;
143
+ top: 50%;
144
+ transform: translateY(-50%);
145
+ display: flex;
146
+ pointer-events: none;
147
+ }
148
+
149
+ .simple-phone-input-sri198-search-icon svg {
150
+ font-size: 20px;
151
+ }
152
+
153
+ .simple-phone-input-sri198-not-found {
154
+ text-align: center;
155
+ margin-top: 10px;
156
+ font-size: 15px;
157
+ color: #f73131;
158
+ }
159
+
160
+ .simple-phone-input-sri198-search-container input:focus {
161
+ outline: none;
162
162
  }
@@ -1 +1 @@
1
- export { default, PhoneInputResponseType } from "./PhoneInput";
1
+ export { default } from "./PhoneInput";
@@ -1 +1 @@
1
- export { default as PhoneInput, PhoneInputResponseType } from "./PhoneInput";
1
+ export { default as PhoneInput } from "./PhoneInput";
@@ -1,162 +1,162 @@
1
- .simple-phone-input-sri198-container {
2
- position: relative;
3
- }
4
-
5
- .simple-phone-input-sri198-container:focus,
6
- .simple-phone-input-sri198-container:focus-visible,
7
- .simple-phone-input-sri198-container:focus-within {
8
- outline: none;
9
- }
10
-
11
- .simple-phone-input-sri198-main {
12
- display: flex;
13
- border: 1px solid rgb(203 203 203);
14
- user-select: none;
15
- border-radius: 3px;
16
- }
17
-
18
- .simple-phone-input-sri198-dropdown-container {
19
- cursor: pointer;
20
- display: flex;
21
- align-items: center;
22
- background: rgb(231 231 231);
23
- border-right: 1px solid rgb(203 203 203);
24
- }
25
-
26
- .simple-phone-input-sri198-dropdown-container img {
27
- margin-right: 6px;
28
- }
29
-
30
- .simple-phone-input-sri198-dropdown {
31
- background: white;
32
- list-style: none;
33
- padding: 0;
34
- margin: 0;
35
- position: absolute;
36
- top: 110%;
37
- left: 0;
38
- right: 0;
39
- height: 250px;
40
- overflow-y: auto;
41
- box-shadow: 0px 4px 15px rgb(163 163 163);
42
- border-radius: 3px;
43
- transition: 0.3s ease;
44
- transform: translateY(-5px);
45
- opacity: 0;
46
- visibility: hidden;
47
- }
48
-
49
- .simple-phone-input-sri198-dropdown.active {
50
- transform: translateY(0px);
51
- opacity: 1;
52
- visibility: visible;
53
- }
54
-
55
- .simple-phone-input-sri198-dropdown li {
56
- margin: 3px 0;
57
- padding: 3px 8px;
58
- display: flex;
59
- }
60
-
61
- .simple-phone-input-sri198-dropdown li.active {
62
- background: rgba(0, 0, 0, 0.116);
63
- }
64
-
65
- .simple-phone-input-sri198-dropdown li:hover {
66
- background: rgba(0, 0, 0, 0.116);
67
- }
68
-
69
- .simple-phone-input-sri198-dropdown li img {
70
- margin-right: 6px;
71
- }
72
-
73
- .simple-phone-input-sri198-dropdown-container-button {
74
- display: flex;
75
- flex: 1;
76
- width: 92px;
77
- padding: 7px 2px 7px 7px;
78
- align-items: center;
79
- }
80
-
81
- .simple-phone-input-sri198-dropdown-container-button.dial {
82
- width: unset;
83
- padding: 8px 3px 8px 8px;
84
- }
85
-
86
- .simple-phone-input-sri198-dropdown-text {
87
- font-size: 15px;
88
- flex: 1;
89
- margin-top: 3px;
90
- }
91
-
92
- .simple-phone-input-sri198-dropdown-country-code {
93
- opacity: 0.6;
94
- margin-top: 3px;
95
- }
96
-
97
- .simple-phone-input-sri198-dropdown-icon {
98
- display: flex;
99
- align-items: center;
100
- justify-content: center;
101
- }
102
-
103
- .simple-phone-input-sri198-dropdown-icon svg {
104
- transition: 0.3s ease;
105
- }
106
-
107
- .simple-phone-input-sri198-dropdown-icon.active svg {
108
- transform: rotate(-180deg)
109
- }
110
-
111
- .simple-phone-input-sri198-selected-code {
112
- flex: 1;
113
- font-size: 14px;
114
- margin-top: 2px;
115
- }
116
-
117
- .simple-phone-input-sri198-input {
118
- width: 100%;
119
- border: none;
120
- padding: 0 10px;
121
- }
122
-
123
- .simple-phone-input-sri198-input:focus {
124
- outline: none;
125
- }
126
-
127
- .simple-phone-input-sri198-search-container {
128
- padding: 5px;
129
- position: relative;
130
- }
131
-
132
- .simple-phone-input-sri198-search-container input {
133
- border: 1px solid rgba(0, 0, 0, 0.116);
134
- padding: 8px 10px;
135
- width: 100%;
136
- font-size: 15px;
137
- border-radius: 2px;
138
- }
139
-
140
- .simple-phone-input-sri198-search-icon {
141
- position: absolute;
142
- right: 10px;
143
- top: 50%;
144
- transform: translateY(-50%);
145
- display: flex;
146
- pointer-events: none;
147
- }
148
-
149
- .simple-phone-input-sri198-search-icon svg {
150
- font-size: 20px;
151
- }
152
-
153
- .simple-phone-input-sri198-not-found {
154
- text-align: center;
155
- margin-top: 10px;
156
- font-size: 15px;
157
- color: #f73131;
158
- }
159
-
160
- .simple-phone-input-sri198-search-container input:focus {
161
- outline: none;
1
+ .simple-phone-input-sri198-container {
2
+ position: relative;
3
+ }
4
+
5
+ .simple-phone-input-sri198-container:focus,
6
+ .simple-phone-input-sri198-container:focus-visible,
7
+ .simple-phone-input-sri198-container:focus-within {
8
+ outline: none;
9
+ }
10
+
11
+ .simple-phone-input-sri198-main {
12
+ display: flex;
13
+ border: 1px solid rgb(203 203 203);
14
+ user-select: none;
15
+ border-radius: 3px;
16
+ }
17
+
18
+ .simple-phone-input-sri198-dropdown-container {
19
+ cursor: pointer;
20
+ display: flex;
21
+ align-items: center;
22
+ background: rgb(231 231 231);
23
+ border-right: 1px solid rgb(203 203 203);
24
+ }
25
+
26
+ .simple-phone-input-sri198-dropdown-container img {
27
+ margin-right: 6px;
28
+ }
29
+
30
+ .simple-phone-input-sri198-dropdown {
31
+ background: white;
32
+ list-style: none;
33
+ padding: 0;
34
+ margin: 0;
35
+ position: absolute;
36
+ top: 110%;
37
+ left: 0;
38
+ right: 0;
39
+ height: 250px;
40
+ overflow-y: auto;
41
+ box-shadow: 0px 4px 15px rgb(163 163 163);
42
+ border-radius: 3px;
43
+ transition: 0.3s ease;
44
+ transform: translateY(-5px);
45
+ opacity: 0;
46
+ visibility: hidden;
47
+ }
48
+
49
+ .simple-phone-input-sri198-dropdown.active {
50
+ transform: translateY(0px);
51
+ opacity: 1;
52
+ visibility: visible;
53
+ }
54
+
55
+ .simple-phone-input-sri198-dropdown li {
56
+ margin: 3px 0;
57
+ padding: 3px 8px;
58
+ display: flex;
59
+ }
60
+
61
+ .simple-phone-input-sri198-dropdown li.active {
62
+ background: rgba(0, 0, 0, 0.116);
63
+ }
64
+
65
+ .simple-phone-input-sri198-dropdown li:hover {
66
+ background: rgba(0, 0, 0, 0.116);
67
+ }
68
+
69
+ .simple-phone-input-sri198-dropdown li img {
70
+ margin-right: 6px;
71
+ }
72
+
73
+ .simple-phone-input-sri198-dropdown-container-button {
74
+ display: flex;
75
+ flex: 1;
76
+ width: 92px;
77
+ padding: 7px 2px 7px 7px;
78
+ align-items: center;
79
+ }
80
+
81
+ .simple-phone-input-sri198-dropdown-container-button.dial {
82
+ width: unset;
83
+ padding: 8px 3px 8px 8px;
84
+ }
85
+
86
+ .simple-phone-input-sri198-dropdown-text {
87
+ font-size: 15px;
88
+ flex: 1;
89
+ margin-top: 3px;
90
+ }
91
+
92
+ .simple-phone-input-sri198-dropdown-country-code {
93
+ opacity: 0.6;
94
+ margin-top: 3px;
95
+ }
96
+
97
+ .simple-phone-input-sri198-dropdown-icon {
98
+ display: flex;
99
+ align-items: center;
100
+ justify-content: center;
101
+ }
102
+
103
+ .simple-phone-input-sri198-dropdown-icon svg {
104
+ transition: 0.3s ease;
105
+ }
106
+
107
+ .simple-phone-input-sri198-dropdown-icon.active svg {
108
+ transform: rotate(-180deg)
109
+ }
110
+
111
+ .simple-phone-input-sri198-selected-code {
112
+ flex: 1;
113
+ font-size: 14px;
114
+ margin-top: 2px;
115
+ }
116
+
117
+ .simple-phone-input-sri198-input {
118
+ width: 100%;
119
+ border: none;
120
+ padding: 0 10px;
121
+ }
122
+
123
+ .simple-phone-input-sri198-input:focus {
124
+ outline: none;
125
+ }
126
+
127
+ .simple-phone-input-sri198-search-container {
128
+ padding: 5px;
129
+ position: relative;
130
+ }
131
+
132
+ .simple-phone-input-sri198-search-container input {
133
+ border: 1px solid rgba(0, 0, 0, 0.116);
134
+ padding: 8px 10px;
135
+ width: 100%;
136
+ font-size: 15px;
137
+ border-radius: 2px;
138
+ }
139
+
140
+ .simple-phone-input-sri198-search-icon {
141
+ position: absolute;
142
+ right: 10px;
143
+ top: 50%;
144
+ transform: translateY(-50%);
145
+ display: flex;
146
+ pointer-events: none;
147
+ }
148
+
149
+ .simple-phone-input-sri198-search-icon svg {
150
+ font-size: 20px;
151
+ }
152
+
153
+ .simple-phone-input-sri198-not-found {
154
+ text-align: center;
155
+ margin-top: 10px;
156
+ font-size: 15px;
157
+ color: #f73131;
158
+ }
159
+
160
+ .simple-phone-input-sri198-search-container input:focus {
161
+ outline: none;
162
162
  }
@@ -1 +1 @@
1
- export { default, PhoneInputResponseType } from "./PhoneInput";
1
+ export { default } from "./PhoneInput";
@@ -1 +1 @@
1
- export { default as PhoneInput, PhoneInputResponseType } from "./PhoneInput";
1
+ export { default as PhoneInput } from "./PhoneInput";
package/dist/index.d.ts CHANGED
@@ -48,4 +48,4 @@ interface Props {
48
48
  }
49
49
  declare const PhoneInput: ({ placeholder, country, onChange, value, iconComponent, inputProps, onlyCountries, excludeCountries, preferredCountries, showDropdownIcon, dialCodeInputField, search, disableDropdownOnly, disableInput, searchPlaceholder, showSearchIcon, searchIconComponent, searchProps, searchNotFound, containerClass, buttonClass, dropdownClass, dropdownListClass, dropdownIconClass, searchContainerClass, searchInputClass, searchIconClass, inputClass, containerStyle, buttonStyle, dropdownStyle, dropdownListStyle, dropdownIconStyle, searchContainerStyle, searchInputStyle, searchIconStyle, inputStyle }: Props) => JSX.Element;
50
50
 
51
- export { PhoneInput, PhoneInputResponseType };
51
+ export { PhoneInput };