-
Notifications
You must be signed in to change notification settings - Fork 0
/
InputCurrencyAmount.jsx
80 lines (69 loc) · 2.3 KB
/
InputCurrencyAmount.jsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
import React from 'react';
import { Form } from './Form';
import { InputText } from './InputText';
import { CurrencyAmountSchema } from '/imports/api/utilities/schemas';
import { ObjectPath } from '/imports/api/utilities/object-path';
const propTypes = {
name: React.PropTypes.string.isRequired,
placeholder: React.PropTypes.string,
className: React.PropTypes.string,
attributes: React.PropTypes.object,
};
export class InputCurrencyAmount extends React.Component {
constructor(props, context) {
super(props, context);
this.handleChange = this.handleChange.bind(this);
}
handleChange(name, value) {
if (name === 'amount') {
this.context.onChange(this.props.name, {
amount: value ? value * 100 : undefined,
currency: 'EUR',
});
}
}
/**
* Called by the children component (this.context).
*
* @returns {*}
*/
getChildContext() {
const currencyAmount = ObjectPath.getPath(this.context.doc, this.props.name);
return {
...this.context,
doc: {
amount: currencyAmount ? currencyAmount.amount / 100 : undefined,
currency: currencyAmount ? currencyAmount.currency : 'EUR',
},
schema: CurrencyAmountSchema,
onChange: this.handleChange,
registerElementName: () => true,
unregisterElementName: () => true,
};
}
componentWillMount() {
this.context.registerElementName(this.props.name);
this.context.registerElementName(this.props.name + '.amount');
this.context.registerElementName(this.props.name + '.currency');
}
componentWillUnmount() {
this.context.unregisterElementName(this.props.name);
this.context.unregisterElementName(this.props.name + '.amount');
this.context.unregisterElementName(this.props.name + '.currency');
}
render() {
const { name, ...passThroughProps } = this.props;
return (
<div className="af-currency-amount">
<InputText name="amount"
type="number"
onChange={this.handleChange}
{...passThroughProps}/>
<span className="af-currency form-control">EUR</span>
</div>
);
}
}
InputCurrencyAmount.propTypes = propTypes;
InputCurrencyAmount.contextTypes = Form.childContextTypes;
InputCurrencyAmount.childContextTypes = Form.childContextTypes;