react-simple-phone-input 3.0.8-beta → 3.0.9-beta

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.
Files changed (4) hide show
  1. package/README.md +1 -2
  2. package/dist/cjs/index.css +32 -30
  3. package/dist/esm/index.css +32 -30
  4. package/package.json +4 -2
package/README.md CHANGED
@@ -18,8 +18,7 @@ $ npm i react-simple-phone-input --save
18
18
 
19
19
  ```jsx
20
20
  import { PhoneInput } from "react-simple-phone-input";
21
- //or
22
- //const { PhoneInput } = require("react-simple-phone-input")
21
+ import "react-simple-phone-input/dist/cjs/index.css";
23
22
 
24
23
  <PhoneInput
25
24
  country="US"
package/dist/cjs/index.css CHANGED
@@ -1,32 +1,34 @@
1
- .simple-phone-input-sri198-container {
1
+ .PhoneInput_simple-phone-input-sri198-container__-1uIN {
2
2
  position: relative;
3
3
  }
4
4
 
5
- .simple-phone-input-sri198-container:focus,
6
- .simple-phone-input-sri198-container:focus-visible,
7
- .simple-phone-input-sri198-container:focus-within {
5
+ .PhoneInput_simple-phone-input-sri198-container__-1uIN:focus,
6
+ .PhoneInput_simple-phone-input-sri198-container__-1uIN:focus-visible,
7
+ .PhoneInput_simple-phone-input-sri198-container__-1uIN:focus-within {
8
8
  outline: none;
9
9
  }
10
10
 
11
- .simple-phone-input-sri198-main {
11
+ .PhoneInput_simple-phone-input-sri198-main__ZMo2U {
12
12
  display: flex;
13
13
  border: 1px solid rgba(0, 0, 0, 0.315);
14
- user-select: none;
14
+ -webkit-user-select: none;
15
+ -moz-user-select: none;
16
+ user-select: none;
15
17
  border-radius: 3px;
16
18
  }
17
19
 
18
- .simple-phone-input-sri198-dropdown-container {
20
+ .PhoneInput_simple-phone-input-sri198-dropdown-container__UY-Wg {
19
21
  cursor: pointer;
20
22
  display: flex;
21
23
  align-items: center;
22
24
  background: rgba(0, 0, 0, 0.144);
23
25
  }
24
26
 
25
- .simple-phone-input-sri198-dropdown-container img {
27
+ .PhoneInput_simple-phone-input-sri198-dropdown-container__UY-Wg img {
26
28
  margin-right: 6px;
27
29
  }
28
30
 
29
- .simple-phone-input-sri198-dropdown {
31
+ .PhoneInput_simple-phone-input-sri198-dropdown__-zUyG {
30
32
  background: white;
31
33
  list-style: none;
32
34
  padding: 0;
@@ -41,87 +43,87 @@
41
43
  display: none;
42
44
  }
43
45
 
44
- .simple-phone-input-sri198-dropdown.active {
46
+ .PhoneInput_simple-phone-input-sri198-dropdown__-zUyG.PhoneInput_active__1usUn {
45
47
  display: block;
46
48
  }
47
49
 
48
- .simple-phone-input-sri198-dropdown li {
50
+ .PhoneInput_simple-phone-input-sri198-dropdown__-zUyG li {
49
51
  margin: 3px 0;
50
52
  padding: 3px 8px;
51
53
  display: flex;
52
54
  }
53
55
 
54
- .simple-phone-input-sri198-dropdown li.active {
56
+ .PhoneInput_simple-phone-input-sri198-dropdown__-zUyG li.PhoneInput_active__1usUn {
55
57
  background: rgba(0, 0, 0, 0.116);
56
58
  }
57
59
 
58
- .simple-phone-input-sri198-dropdown li:hover {
60
+ .PhoneInput_simple-phone-input-sri198-dropdown__-zUyG li:hover {
59
61
  background: rgba(0, 0, 0, 0.116);
60
62
  }
61
63
 
62
- .simple-phone-input-sri198-dropdown li img {
64
+ .PhoneInput_simple-phone-input-sri198-dropdown__-zUyG li img {
63
65
  margin-right: 6px;
64
66
  }
65
67
 
66
- .simple-phone-input-sri198-dropdown-container-button {
68
+ .PhoneInput_simple-phone-input-sri198-dropdown-container-button__u1qYW {
67
69
  display: flex;
68
70
  flex: 1;
69
71
  width: 92px;
70
72
  padding: 5px 2px 5px 7px;
71
73
  }
72
74
 
73
- .simple-phone-input-sri198-dropdown-container-button.dial {
75
+ .PhoneInput_simple-phone-input-sri198-dropdown-container-button__u1qYW.PhoneInput_dial__cy4Vs {
74
76
  width: unset;
75
77
  padding: 8px 3px 8px 8px;
76
78
  }
77
79
 
78
- .simple-phone-input-sri198-dropdown-text {
80
+ .PhoneInput_simple-phone-input-sri198-dropdown-text__tgEqa {
79
81
  font-size: 15px;
80
82
  flex: 1;
81
83
  margin-top: 3px;
82
84
  }
83
85
 
84
- .simple-phone-input-sri198-dropdown-country-code {
86
+ .PhoneInput_simple-phone-input-sri198-dropdown-country-code__nj66H {
85
87
  opacity: 0.6;
86
88
  margin-top: 3px;
87
89
  }
88
90
 
89
- .simple-phone-input-sri198-dropdown-icon {
91
+ .PhoneInput_simple-phone-input-sri198-dropdown-icon__e-zac {
90
92
  display: flex;
91
93
  align-items: center;
92
94
  justify-content: center;
93
95
  }
94
96
 
95
- .simple-phone-input-sri198-dropdown-icon svg {
97
+ .PhoneInput_simple-phone-input-sri198-dropdown-icon__e-zac svg {
96
98
  transition: 0.3s ease;
97
99
  }
98
100
 
99
- .simple-phone-input-sri198-dropdown-icon.active svg {
101
+ .PhoneInput_simple-phone-input-sri198-dropdown-icon__e-zac.PhoneInput_active__1usUn svg {
100
102
  transform: rotate(-180deg)
101
103
  }
102
104
 
103
- .simple-phone-input-sri198-selected-code {
105
+ .PhoneInput_simple-phone-input-sri198-selected-code__oZlZb {
104
106
  flex: 1;
105
107
  font-size: 14px;
106
108
  margin-top: 3px;
107
109
  }
108
110
 
109
- .simple-phone-input-sri198-input {
111
+ .PhoneInput_simple-phone-input-sri198-input__DxexW {
110
112
  width: 100%;
111
113
  border: none;
112
114
  padding: 0 10px;
113
115
  }
114
116
 
115
- .simple-phone-input-sri198-input:focus {
117
+ .PhoneInput_simple-phone-input-sri198-input__DxexW:focus {
116
118
  outline: none;
117
119
  }
118
120
 
119
- .simple-phone-input-sri198-search-container {
121
+ .PhoneInput_simple-phone-input-sri198-search-container__fUzRY {
120
122
  padding: 5px;
121
123
  position: relative;
122
124
  }
123
125
 
124
- .simple-phone-input-sri198-search-container input {
126
+ .PhoneInput_simple-phone-input-sri198-search-container__fUzRY input {
125
127
  border: 1px solid rgba(0, 0, 0, 0.116);
126
128
  padding: 8px 10px;
127
129
  width: 100%;
@@ -129,7 +131,7 @@
129
131
  border-radius: 2px;
130
132
  }
131
133
 
132
- .simple-phone-input-sri198-search-icon {
134
+ .PhoneInput_simple-phone-input-sri198-search-icon__ABFep {
133
135
  position: absolute;
134
136
  right: 10px;
135
137
  top: 50%;
@@ -138,17 +140,17 @@
138
140
  pointer-events: none;
139
141
  }
140
142
 
141
- .simple-phone-input-sri198-search-icon svg {
143
+ .PhoneInput_simple-phone-input-sri198-search-icon__ABFep svg {
142
144
  font-size: 20px;
143
145
  }
144
146
 
145
- .simple-phone-input-sri198-not-found {
147
+ .PhoneInput_simple-phone-input-sri198-not-found__y43JR {
146
148
  text-align: center;
147
149
  margin-top: 10px;
148
150
  font-size: 15px;
149
151
  color: #f73131;
150
152
  }
151
153
 
152
- .simple-phone-input-sri198-search-container input:focus {
154
+ .PhoneInput_simple-phone-input-sri198-search-container__fUzRY input:focus {
153
155
  outline: none;
154
156
  }
package/dist/esm/index.css CHANGED
@@ -1,32 +1,34 @@
1
- .simple-phone-input-sri198-container {
1
+ .PhoneInput_simple-phone-input-sri198-container__-1uIN {
2
2
  position: relative;
3
3
  }
4
4
 
5
- .simple-phone-input-sri198-container:focus,
6
- .simple-phone-input-sri198-container:focus-visible,
7
- .simple-phone-input-sri198-container:focus-within {
5
+ .PhoneInput_simple-phone-input-sri198-container__-1uIN:focus,
6
+ .PhoneInput_simple-phone-input-sri198-container__-1uIN:focus-visible,
7
+ .PhoneInput_simple-phone-input-sri198-container__-1uIN:focus-within {
8
8
  outline: none;
9
9
  }
10
10
 
11
- .simple-phone-input-sri198-main {
11
+ .PhoneInput_simple-phone-input-sri198-main__ZMo2U {
12
12
  display: flex;
13
13
  border: 1px solid rgba(0, 0, 0, 0.315);
14
- user-select: none;
14
+ -webkit-user-select: none;
15
+ -moz-user-select: none;
16
+ user-select: none;
15
17
  border-radius: 3px;
16
18
  }
17
19
 
18
- .simple-phone-input-sri198-dropdown-container {
20
+ .PhoneInput_simple-phone-input-sri198-dropdown-container__UY-Wg {
19
21
  cursor: pointer;
20
22
  display: flex;
21
23
  align-items: center;
22
24
  background: rgba(0, 0, 0, 0.144);
23
25
  }
24
26
 
25
- .simple-phone-input-sri198-dropdown-container img {
27
+ .PhoneInput_simple-phone-input-sri198-dropdown-container__UY-Wg img {
26
28
  margin-right: 6px;
27
29
  }
28
30
 
29
- .simple-phone-input-sri198-dropdown {
31
+ .PhoneInput_simple-phone-input-sri198-dropdown__-zUyG {
30
32
  background: white;
31
33
  list-style: none;
32
34
  padding: 0;
@@ -41,87 +43,87 @@
41
43
  display: none;
42
44
  }
43
45
 
44
- .simple-phone-input-sri198-dropdown.active {
46
+ .PhoneInput_simple-phone-input-sri198-dropdown__-zUyG.PhoneInput_active__1usUn {
45
47
  display: block;
46
48
  }
47
49
 
48
- .simple-phone-input-sri198-dropdown li {
50
+ .PhoneInput_simple-phone-input-sri198-dropdown__-zUyG li {
49
51
  margin: 3px 0;
50
52
  padding: 3px 8px;
51
53
  display: flex;
52
54
  }
53
55
 
54
- .simple-phone-input-sri198-dropdown li.active {
56
+ .PhoneInput_simple-phone-input-sri198-dropdown__-zUyG li.PhoneInput_active__1usUn {
55
57
  background: rgba(0, 0, 0, 0.116);
56
58
  }
57
59
 
58
- .simple-phone-input-sri198-dropdown li:hover {
60
+ .PhoneInput_simple-phone-input-sri198-dropdown__-zUyG li:hover {
59
61
  background: rgba(0, 0, 0, 0.116);
60
62
  }
61
63
 
62
- .simple-phone-input-sri198-dropdown li img {
64
+ .PhoneInput_simple-phone-input-sri198-dropdown__-zUyG li img {
63
65
  margin-right: 6px;
64
66
  }
65
67
 
66
- .simple-phone-input-sri198-dropdown-container-button {
68
+ .PhoneInput_simple-phone-input-sri198-dropdown-container-button__u1qYW {
67
69
  display: flex;
68
70
  flex: 1;
69
71
  width: 92px;
70
72
  padding: 5px 2px 5px 7px;
71
73
  }
72
74
 
73
- .simple-phone-input-sri198-dropdown-container-button.dial {
75
+ .PhoneInput_simple-phone-input-sri198-dropdown-container-button__u1qYW.PhoneInput_dial__cy4Vs {
74
76
  width: unset;
75
77
  padding: 8px 3px 8px 8px;
76
78
  }
77
79
 
78
- .simple-phone-input-sri198-dropdown-text {
80
+ .PhoneInput_simple-phone-input-sri198-dropdown-text__tgEqa {
79
81
  font-size: 15px;
80
82
  flex: 1;
81
83
  margin-top: 3px;
82
84
  }
83
85
 
84
- .simple-phone-input-sri198-dropdown-country-code {
86
+ .PhoneInput_simple-phone-input-sri198-dropdown-country-code__nj66H {
85
87
  opacity: 0.6;
86
88
  margin-top: 3px;
87
89
  }
88
90
 
89
- .simple-phone-input-sri198-dropdown-icon {
91
+ .PhoneInput_simple-phone-input-sri198-dropdown-icon__e-zac {
90
92
  display: flex;
91
93
  align-items: center;
92
94
  justify-content: center;
93
95
  }
94
96
 
95
- .simple-phone-input-sri198-dropdown-icon svg {
97
+ .PhoneInput_simple-phone-input-sri198-dropdown-icon__e-zac svg {
96
98
  transition: 0.3s ease;
97
99
  }
98
100
 
99
- .simple-phone-input-sri198-dropdown-icon.active svg {
101
+ .PhoneInput_simple-phone-input-sri198-dropdown-icon__e-zac.PhoneInput_active__1usUn svg {
100
102
  transform: rotate(-180deg)
101
103
  }
102
104
 
103
- .simple-phone-input-sri198-selected-code {
105
+ .PhoneInput_simple-phone-input-sri198-selected-code__oZlZb {
104
106
  flex: 1;
105
107
  font-size: 14px;
106
108
  margin-top: 3px;
107
109
  }
108
110
 
109
- .simple-phone-input-sri198-input {
111
+ .PhoneInput_simple-phone-input-sri198-input__DxexW {
110
112
  width: 100%;
111
113
  border: none;
112
114
  padding: 0 10px;
113
115
  }
114
116
 
115
- .simple-phone-input-sri198-input:focus {
117
+ .PhoneInput_simple-phone-input-sri198-input__DxexW:focus {
116
118
  outline: none;
117
119
  }
118
120
 
119
- .simple-phone-input-sri198-search-container {
121
+ .PhoneInput_simple-phone-input-sri198-search-container__fUzRY {
120
122
  padding: 5px;
121
123
  position: relative;
122
124
  }
123
125
 
124
- .simple-phone-input-sri198-search-container input {
126
+ .PhoneInput_simple-phone-input-sri198-search-container__fUzRY input {
125
127
  border: 1px solid rgba(0, 0, 0, 0.116);
126
128
  padding: 8px 10px;
127
129
  width: 100%;
@@ -129,7 +131,7 @@
129
131
  border-radius: 2px;
130
132
  }
131
133
 
132
- .simple-phone-input-sri198-search-icon {
134
+ .PhoneInput_simple-phone-input-sri198-search-icon__ABFep {
133
135
  position: absolute;
134
136
  right: 10px;
135
137
  top: 50%;
@@ -138,17 +140,17 @@
138
140
  pointer-events: none;
139
141
  }
140
142
 
141
- .simple-phone-input-sri198-search-icon svg {
143
+ .PhoneInput_simple-phone-input-sri198-search-icon__ABFep svg {
142
144
  font-size: 20px;
143
145
  }
144
146
 
145
- .simple-phone-input-sri198-not-found {
147
+ .PhoneInput_simple-phone-input-sri198-not-found__y43JR {
146
148
  text-align: center;
147
149
  margin-top: 10px;
148
150
  font-size: 15px;
149
151
  color: #f73131;
150
152
  }
151
153
 
152
- .simple-phone-input-sri198-search-container input:focus {
154
+ .PhoneInput_simple-phone-input-sri198-search-container__fUzRY input:focus {
153
155
  outline: none;
154
156
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-simple-phone-input",
3
- "version": "3.0.8-beta",
3
+ "version": "3.0.9-beta",
4
4
  "description": "A simple react phone input component with calling code dropdown🤷",
5
5
  "main": "dist/cjs/index.js",
6
6
  "module": "dist/esm/index.js",
@@ -39,12 +39,14 @@
39
39
  "@rollup/plugin-node-resolve": "^15.0.1",
40
40
  "@rollup/plugin-typescript": "^10.0.1",
41
41
  "@types/react": "^18.0.26",
42
- "postcss": "^8.4.20",
42
+ "autoprefixer": "^10.4.13",
43
43
  "react": "^18.2.0",
44
44
  "react-dom": "^18.2.0",
45
+ "rollup": "^3.7.5",
45
46
  "rollup-plugin-dts": "^5.0.0",
46
47
  "rollup-plugin-peer-deps-external": "^2.2.4",
47
48
  "rollup-plugin-postcss": "^4.0.2",
49
+ "rollup-plugin-postcss-modules": "^2.1.0",
48
50
  "tslib": "^2.4.1",
49
51
  "typescript": "^4.9.4"
50
52
  }