@@ -13,6 +13,21 @@ const BACKSPACE_KEY = 8;
13
13
const LEFT_ARROW_KEY = 37 ;
14
14
const RIGHT_ARROW_KEY = 39 ;
15
15
16
+ const defaultInputStyle = {
17
+ fontFamily : 'monospace' ,
18
+ MozAppearance : 'textfield' ,
19
+ borderRadius : '6px' ,
20
+ border : '1px solid' ,
21
+ boxShadow : '0px 0px 10px 0px rgba(0,0,0,.10)' ,
22
+ margin : '4px' ,
23
+ paddingLeft : '8px' ,
24
+ paddingRight : 0 ,
25
+ width : '36px' ,
26
+ height : '42px' ,
27
+ fontSize : '32px' ,
28
+ boxSizing : 'border-box' ,
29
+ } ;
30
+
16
31
class ReactCodeInput extends Component {
17
32
constructor ( props ) {
18
33
super ( props ) ;
@@ -30,20 +45,6 @@ class ReactCodeInput extends Component {
30
45
isValid,
31
46
disabled,
32
47
filterKeyCodes,
33
- defaultInputStyle : {
34
- fontFamily : 'monospace' ,
35
- MozAppearance : 'textfield' ,
36
- borderRadius : '6px' ,
37
- border : '1px solid' ,
38
- boxShadow : '0px 0px 10px 0px rgba(0,0,0,.10)' ,
39
- margin : '4px' ,
40
- paddingLeft : '8px' ,
41
- paddingRight : 0 ,
42
- width : '36px' ,
43
- height : '42px' ,
44
- fontSize : '32px' ,
45
- boxSizing : 'border-box' ,
46
- } ,
47
48
} ;
48
49
49
50
for ( let i = 0 ; i < Number ( fields ) && i < 32 ; i += 1 ) {
@@ -218,7 +219,7 @@ class ReactCodeInput extends Component {
218
219
inputMode,
219
220
placeholder
220
221
} = this . props ,
221
- { disabled, input, isValid, defaultInputStyle } = this . state ,
222
+ { disabled, input, isValid } = this . state ,
222
223
styles = {
223
224
container : { display : 'inline-block' , ...style } ,
224
225
input : isValid ? inputStyle : inputStyleInvalid ,
0 commit comments