Skip to content

Commit c9bf851

Browse files
authored
Merge pull request #5 from viniciusdacal/issue-4
send raw value in onChange callback function
2 parents 36de2ba + 00d103a commit c9bf851

File tree

6 files changed

+3240
-76
lines changed

6 files changed

+3240
-76
lines changed

package.json

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@
3535
"react": ">=0.14.0 || >=15.0.0"
3636
},
3737
"devDependencies": {
38-
"babel": "^6.5.2",
38+
"babel-cli": "^6.18.0",
3939
"babel-preset-es2015": "^6.9.0",
4040
"babel-preset-react": "^6.5.0",
4141
"babel-register": "^6.9.0",
@@ -50,5 +50,6 @@
5050
"rimraf": "^2.5.2",
5151
"sinon": "^1.17.4",
5252
"sinon-chai": "^2.8.0"
53-
}
53+
},
54+
"dependencies": {}
5455
}

src/index.js

Lines changed: 31 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ const CurrencyInput = React.createClass({
3636
*/
3737
getDefaultProps(){
3838
return {
39-
onChange: function(maskValue){/*no-op*/},
39+
onChange: function(maskValue, value){/*no-op*/},
4040
value: "0",
4141
decimalSeparator: ".",
4242
thousandSeparator: ",",
@@ -67,16 +67,20 @@ const CurrencyInput = React.createClass({
6767
delete customProps.allowNegative;
6868
delete customProps.prefix;
6969
delete customProps.suffix;
70+
71+
const { maskedValue, value } = mask(
72+
this.props.value,
73+
this.props.precision,
74+
this.props.decimalSeparator,
75+
this.props.thousandSeparator,
76+
this.props.allowNegative,
77+
this.props.prefix,
78+
this.props.suffix
79+
);
80+
7081
return {
71-
maskedValue: mask(
72-
this.props.value,
73-
this.props.precision,
74-
this.props.decimalSeparator,
75-
this.props.thousandSeparator,
76-
this.props.allowNegative,
77-
this.props.prefix,
78-
this.props.suffix
79-
),
82+
maskedValue,
83+
value,
8084
customProps: customProps
8185
}
8286
},
@@ -100,16 +104,20 @@ const CurrencyInput = React.createClass({
100104
delete customProps.allowNegative;
101105
delete customProps.prefix;
102106
delete customProps.suffix;
107+
108+
const {maskedValue, value} = mask(
109+
nextProps.value,
110+
nextProps.precision,
111+
nextProps.decimalSeparator,
112+
nextProps.thousandSeparator,
113+
nextProps.allowNegative,
114+
nextProps.prefix,
115+
nextProps.suffix
116+
);
117+
103118
this.setState({
104-
maskedValue: mask(
105-
nextProps.value,
106-
nextProps.precision,
107-
nextProps.decimalSeparator,
108-
nextProps.thousandSeparator,
109-
nextProps.allowNegative,
110-
nextProps.prefix,
111-
nextProps.suffix
112-
),
119+
maskedValue,
120+
value,
113121
customProps: customProps
114122
});
115123
},
@@ -131,7 +139,7 @@ const CurrencyInput = React.createClass({
131139
*/
132140
handleChange(event){
133141
event.preventDefault();
134-
let maskedValue = mask(
142+
let {maskedValue, value} = mask(
135143
event.target.value,
136144
this.props.precision,
137145
this.props.decimalSeparator,
@@ -140,8 +148,8 @@ const CurrencyInput = React.createClass({
140148
this.props.prefix,
141149
this.props.suffix
142150
);
143-
this.setState({maskedValue: maskedValue});
144-
this.props.onChange(maskedValue);
151+
this.setState({maskedValue, value});
152+
this.props.onChange(maskedValue, value);
145153
},
146154

147155

@@ -162,4 +170,4 @@ const CurrencyInput = React.createClass({
162170
});
163171

164172

165-
export default CurrencyInput
173+
export default CurrencyInput

src/mask.js

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ export default function mask(value, precision, decimalSeparator, thousandSeparat
4747

4848
// clean up extraneous digits like leading zeros.
4949
digits = Number(digits.join('')).toFixed(precision).split('');
50-
50+
const raw = Number(digits.join(''));
5151

5252
let decimalpos = digits.length - precision - 1; // -1 needed to position the decimal separator before the digits.
5353
if (precision > 0) {
@@ -73,5 +73,8 @@ export default function mask(value, precision, decimalSeparator, thousandSeparat
7373
digits.unshift('-');
7474
}
7575

76-
return digits.join('').trim();
76+
return {
77+
value: raw,
78+
maskedValue: digits.join('').trim()
79+
};
7780
}

test/index.spec.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -80,7 +80,7 @@ describe('react-currency-input', function(){
8080
it('should call onChange', function() {
8181
this.inputComponent.value=123456789;
8282
ReactTestUtils.Simulate.change(this.inputComponent);
83-
expect(this.handleChange).to.have.been.calledWith("1,234,567.89");
83+
expect(this.handleChange).to.have.been.calledWith("1,234,567.89", 1234567.89);
8484
});
8585

8686

test/mask.spec.js

Lines changed: 75 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -6,46 +6,68 @@ describe('mask', function(){
66

77

88
it('should change "0" to "0.00"', function(){
9-
expect(mask("0")).to.equal("0.00");
9+
const {maskedValue, value} = mask("0");
10+
11+
expect(maskedValue).to.equal("0.00");
12+
expect(value).to.equal(0);
1013
});
1114

1215
it('should change "00" to "0.00"', function(){
13-
expect(mask("00")).to.equal("0.00");
16+
const {maskedValue, value} = mask("00");
17+
18+
expect(maskedValue).to.equal("0.00");
19+
expect(value).to.equal(0);
1420
});
1521

1622
it('should change "000" to "0.00"', function(){
17-
expect(mask("000")).to.equal("0.00");
23+
const {maskedValue, value} = mask("000")
24+
expect(maskedValue).to.equal("0.00");
25+
expect(value).to.equal(0);
1826
});
1927

2028
it('should change "0000" to "0.00"', function(){
21-
expect(mask("0000")).to.equal("0.00");
29+
const {maskedValue, value} = mask("0000")
30+
expect(maskedValue).to.equal("0.00");
31+
expect(value).to.equal(0);
2232
});
2333

2434
it('should change "0001" to "0.01"', function(){
25-
expect(mask("0001")).to.equal("0.01");
35+
const {maskedValue, value} = mask("0001")
36+
expect(maskedValue).to.equal("0.01");
37+
expect(value).to.equal(0.01);
2638
});
2739

2840
it('should change "1001" to "10.01"', function(){
29-
expect(mask("1001")).to.equal("10.01");
41+
const {maskedValue, value} = mask("1001")
42+
expect(maskedValue).to.equal("10.01");
43+
expect(value).to.equal(10.01);
3044
});
3145

3246
it('should change "123456789" to "1,234,567.89"', function(){
33-
expect(mask("123456789")).to.equal("1,234,567.89");
47+
const {maskedValue, value} = mask("123456789")
48+
expect(maskedValue).to.equal("1,234,567.89");
49+
expect(value).to.equal(1234567.89);
3450
});
3551

3652

3753
describe('with separators', function(){
3854

3955
it('decimal:"," thousand:"." should change "123456789" to "1.234.567,89"', function(){
40-
expect(mask("123456789", 2, ",", ".")).to.equal("1.234.567,89");
56+
const {maskedValue, value} = mask("123456789", 2, ",", ".");
57+
expect(maskedValue).to.equal("1.234.567,89");
58+
expect(value).to.equal(1234567.89);
4159
});
4260

4361
it('zero length thousand separator should change "123456789" to "1234567.89"', function(){
44-
expect(mask("123456789", 2, ".", "")).to.equal("1234567.89");
62+
const {maskedValue, value} = mask("123456789", 2, ".", "");
63+
expect(maskedValue).to.equal("1234567.89");
64+
expect(value).to.equal(1234567.89);
4565
});
4666

4767
it('zero length decimal separator should change "123456789" to "1,234,56789"', function(){
48-
expect(mask("123456789", 2, "", ",")).to.equal("1,234,56789");
68+
const {maskedValue, value} = mask("123456789", 2, "", ",");
69+
expect(maskedValue).to.equal("1,234,56789");
70+
expect(value).to.equal(1234567.89);
4971
});
5072

5173
});
@@ -54,15 +76,20 @@ describe('mask', function(){
5476
describe('with precision', function(){
5577

5678
it('set to string value "3" should change "123456789" to "123,456.789"', function(){
57-
expect(mask("123456789", "3")).to.equal("123,456.789");
79+
const {maskedValue, value} = mask("123456789", "3");
80+
expect(mask("123456789", "3").maskedValue).to.equal("123,456.789");
5881
});
5982

6083
it('set to 3 should change "123456789" to "123,456.789"', function(){
61-
expect(mask("123456789", 3)).to.equal("123,456.789");
84+
const {maskedValue, value} = mask("123456789", 3);
85+
expect(maskedValue).to.equal("123,456.789");
86+
expect(value).to.equal(123456.789);
6287
});
6388

6489
it('set to 0 should change "123456789" to "123,456,789"', function(){
65-
expect(mask("123456789", 0)).to.equal("123,456,789");
90+
const {maskedValue, value} = mask("123456789", 0);
91+
expect(maskedValue).to.equal("123,456,789");
92+
expect(value).to.equal(123456789);
6693
});
6794

6895
});
@@ -71,48 +98,48 @@ describe('mask', function(){
7198
describe('negative numbers', function(){
7299

73100
it('all "-" should be stripped out if allowNegative is false', function(){
74-
expect(mask("123456")).to.equal("1,234.56");
75-
expect(mask("-123456")).to.equal("1,234.56");
76-
expect(mask("--123456")).to.equal("1,234.56");
77-
expect(mask("--123--456")).to.equal("1,234.56");
78-
expect(mask("--123--456--")).to.equal("1,234.56");
101+
expect(mask("123456").maskedValue).to.equal("1,234.56");
102+
expect(mask("-123456").maskedValue).to.equal("1,234.56");
103+
expect(mask("--123456").maskedValue).to.equal("1,234.56");
104+
expect(mask("--123--456").maskedValue).to.equal("1,234.56");
105+
expect(mask("--123--456--").maskedValue).to.equal("1,234.56");
79106
});
80107

81108
it('single "-" anywhere in the string should result in a negative number', function(){
82-
expect(mask("-123456", "2", ".", ",", true)).to.equal("-1,234.56");
83-
expect(mask("123-456", "2", ".", ",", true)).to.equal("-1,234.56");
84-
expect(mask("123456-", "2", ".", ",", true)).to.equal("-1,234.56");
109+
expect(mask("-123456", "2", ".", ",", true).maskedValue).to.equal("-1,234.56");
110+
expect(mask("123-456", "2", ".", ",", true).maskedValue).to.equal("-1,234.56");
111+
expect(mask("123456-", "2", ".", ",", true).maskedValue).to.equal("-1,234.56");
85112
});
86113

87114
it('no or even number of "-" should result in a positive number', function(){
88-
expect(mask("123456", "2", ".", ",", true)).to.equal("1,234.56");
89-
expect(mask("--123456", "2", ".", ",", true)).to.equal("1,234.56");
90-
expect(mask("123--456", "2", ".", ",", true)).to.equal("1,234.56");
91-
expect(mask("123456--", "2", ".", ",", true)).to.equal("1,234.56");
92-
expect(mask("--123456--", "2", ".", ",", true)).to.equal("1,234.56");
93-
expect(mask("--123--456--", "2", ".", ",", true)).to.equal("1,234.56");
94-
expect(mask("--1--234--56--", "2", ".", ",", true)).to.equal("1,234.56");
115+
expect(mask("123456", "2", ".", ",", true).maskedValue).to.equal("1,234.56");
116+
expect(mask("--123456", "2", ".", ",", true).maskedValue).to.equal("1,234.56");
117+
expect(mask("123--456", "2", ".", ",", true).maskedValue).to.equal("1,234.56");
118+
expect(mask("123456--", "2", ".", ",", true).maskedValue).to.equal("1,234.56");
119+
expect(mask("--123456--", "2", ".", ",", true).maskedValue).to.equal("1,234.56");
120+
expect(mask("--123--456--", "2", ".", ",", true).maskedValue).to.equal("1,234.56");
121+
expect(mask("--1--234--56--", "2", ".", ",", true).maskedValue).to.equal("1,234.56");
95122
});
96123

97124
it('odd number of "-" should result in a negative number', function(){
98-
expect(mask("-123456", "2", ".", ",", true)).to.equal("-1,234.56");
99-
expect(mask("123-456", "2", ".", ",", true)).to.equal("-1,234.56");
100-
expect(mask("123456-", "2", ".", ",", true)).to.equal("-1,234.56");
101-
expect(mask("-123-456-", "2", ".", ",", true)).to.equal("-1,234.56");
102-
expect(mask("-1-23-45-6-", "2", ".", ",", true)).to.equal("-1,234.56");
103-
expect(mask("-1-2-3-4-5-6-", "2", ".", ",", true)).to.equal("-1,234.56");
125+
expect(mask("-123456", "2", ".", ",", true).maskedValue).to.equal("-1,234.56");
126+
expect(mask("123-456", "2", ".", ",", true).maskedValue).to.equal("-1,234.56");
127+
expect(mask("123456-", "2", ".", ",", true).maskedValue).to.equal("-1,234.56");
128+
expect(mask("-123-456-", "2", ".", ",", true).maskedValue).to.equal("-1,234.56");
129+
expect(mask("-1-23-45-6-", "2", ".", ",", true).maskedValue).to.equal("-1,234.56");
130+
expect(mask("-1-2-3-4-5-6-", "2", ".", ",", true).maskedValue).to.equal("-1,234.56");
104131
});
105132

106133
it('0 is never negative', function(){
107-
expect(mask("", "2", ".", ",", true)).to.equal("0.00");
108-
expect(mask("0", "2", ".", ",", true)).to.equal("0.00");
109-
expect(mask("-0", "2", ".", ",", true)).to.equal("0.00");
110-
expect(mask("-0-", "2", ".", ",", true)).to.equal("0.00");
111-
expect(mask("--0-", "2", ".", ",", true)).to.equal("0.00");
134+
expect(mask("", "2", ".", ",", true).maskedValue).to.equal("0.00");
135+
expect(mask("0", "2", ".", ",", true).maskedValue).to.equal("0.00");
136+
expect(mask("-0", "2", ".", ",", true).maskedValue).to.equal("0.00");
137+
expect(mask("-0-", "2", ".", ",", true).maskedValue).to.equal("0.00");
138+
expect(mask("--0-", "2", ".", ",", true).maskedValue).to.equal("0.00");
112139
});
113140

114141
it('just "-" should result in 0.00', function(){
115-
expect(mask("-", "2", ".", ",", true)).to.equal("0.00");
142+
expect(mask("-", "2", ".", ",", true).maskedValue).to.equal("0.00");
116143
});
117144

118145
});
@@ -122,30 +149,30 @@ describe('mask', function(){
122149
describe('with currency symbol', function(){
123150

124151
it('"$" prefix should change "0" to "$0.00"', function(){
125-
expect(mask("0","2",".",",",true,"$","")).to.equal("$0.00");
152+
expect(mask("0","2",".",",",true,"$","").maskedValue).to.equal("$0.00");
126153
});
127154

128155
it('"kr" suffix should change "0" to "0.00kr"', function(){
129-
expect(mask("0","2",".",",",true,"","kr")).to.equal("0.00kr");
156+
expect(mask("0","2",".",",",true,"","kr").maskedValue).to.equal("0.00kr");
130157
});
131158

132159
it('can have both a prefix and a suffix', function(){
133-
expect(mask("0","2",".",",",true,"$","kr")).to.equal("$0.00kr");
160+
expect(mask("0","2",".",",",true,"$","kr").maskedValue).to.equal("$0.00kr");
134161
});
135162

136163
it('does not strip whitespaces between amount and symbol', function(){
137-
expect(mask("0","2",".",",",true,"$ ","")).to.equal("$ 0.00");
138-
expect(mask("0","2",".",",",true,""," kr")).to.equal("0.00 kr");
164+
expect(mask("0","2",".",",",true,"$ ","").maskedValue).to.equal("$ 0.00");
165+
expect(mask("0","2",".",",",true,""," kr").maskedValue).to.equal("0.00 kr");
139166
});
140167

141168
it('strips whitespaces before and after value', function(){
142-
expect(mask("0","2",".",",",true," $ ","")).to.equal("$ 0.00");
143-
expect(mask("0","2",".",",",true,""," kr ")).to.equal("0.00 kr");
169+
expect(mask("0","2",".",",",true," $ ","").maskedValue).to.equal("$ 0.00");
170+
expect(mask("0","2",".",",",true,""," kr ").maskedValue).to.equal("0.00 kr");
144171
});
145172

146173

147174
it('"-" should come before the prefix', function(){
148-
expect(mask("-20.00","2",".",",",true,"$","")).to.equal("-$20.00");
175+
expect(mask("-20.00","2",".",",",true,"$","").maskedValue).to.equal("-$20.00");
149176
});
150177

151178
});

0 commit comments

Comments
 (0)