2016-03-28 22:34:50 +02:00
|
|
|
|
import React from 'react';
|
|
|
|
|
import ReactDOM from 'react-dom';
|
|
|
|
|
import { Accounts } from 'meteor/accounts-base';
|
|
|
|
|
|
|
|
|
|
export class Field extends React.Component {
|
|
|
|
|
componentDidMount() {
|
|
|
|
|
// Trigger an onChange on inital load, to support browser prefilled values.
|
|
|
|
|
const { onChange } = this.props;
|
|
|
|
|
let node = ReactDOM.findDOMNode(this);
|
|
|
|
|
let value = node.getElementsByTagName('input')[0].value;
|
|
|
|
|
// Match the data format of a typical onChange event.
|
|
|
|
|
onChange({ target: { value: value } });
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
render() {
|
|
|
|
|
const { id, hint, label, type = 'text', onChange } = this.props;
|
|
|
|
|
return (
|
|
|
|
|
<div className="field">
|
|
|
|
|
<label htmlFor={ id }>{ label }</label>
|
2016-03-29 02:36:48 +02:00
|
|
|
|
<input id={ id } type={ type } onChange={ onChange } placeholder={ hint } defaultValue="" />
|
2016-03-28 22:34:50 +02:00
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
Field.propTypes = {
|
|
|
|
|
onChange: React.PropTypes.func
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
Accounts.ui.Field = Field;
|