on adf9104 help sign in
bridge/src/components/ProtoInput.js
67 lines 1.9 kB history raw
1import React from 'react';
2import PropTypes from 'prop-types';
4import { getDomProps } from '../lib/base'
6const ProtoInput = props => {
7 return (
8 <input
9 // getDomProps gets any prop prepended with 'prop-'. Useful here because
10 // one cannot simply pass props like {...props} because the input elem
11 // cannot accept children nodes, which are included in the props arg. It
12 // is doubly useful because it lets the developer control which props are
13 // added to the real DOM.
14 {...getDomProps(props)}
15 className={props.className}
16 onChange={e => props.onChange(e)}
17 onKeyPress={e => props.onKeyPress(e)}
18 onFocus={e => props.onFocus(e)}
19 onBlur={e => props.onBlur(e)}
20 placeholder={props.placeholder}
21 type={props.type}
22 name={props.name}
23 style={props.style}
24 value={props.value}
25 autoFocus={props.autoFocus}
26 readOnly={props.readOnly}
27 maxLength={props.maxLength}
28 autoComplete={props.autoComplete} />
29 );
33ProtoInput.propTypes = {
34 disabled: PropTypes.bool,
35 onChange: PropTypes.func,
36 onBlur: PropTypes.func,
37 onFocus: PropTypes.func,
38 onKeyPress: PropTypes.func,
39 className: PropTypes.string,
40 style: PropTypes.object,
41 children: PropTypes.node,
42 autoFocus: PropTypes.bool,
43 readOnly: PropTypes.bool,
44 name: PropTypes.string,
45 value: PropTypes.string,
46 autoComplete: PropTypes.string,
47 type: PropTypes.string,
48};
51ProtoInput.defaultProps = {
52 disabled: false,
53 autoFocus: false,
54 onChange: () => {},
55 onBlur: () => {},
56 onFocus: () => {},
57 onKeyPress: () => {},
58 style: {},
59 className: '',
60 value: '',
61 name: '',
62 autoComplete: 'off',
63 type: 'input',
64};
67export default ProtoInput;