git.iko.soy/bridge
on b30edac help sign in
bridge/src/components/ProtoInput.js
68 lines 2.0 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 disabled={props.disabled}
22 type={props.type}
23 name={props.name}
24 style={props.style}
25 value={props.value}
26 autoFocus={props.autoFocus}
27 readOnly={props.readOnly}
28 maxLength={props.maxLength}
29 autoComplete={props.autoComplete} />
30 );
34ProtoInput.propTypes = {
35 disabled: PropTypes.bool,
36 onChange: PropTypes.func,
37 onBlur: PropTypes.func,
38 onFocus: PropTypes.func,
39 onKeyPress: PropTypes.func,
40 className: PropTypes.string,
41 style: PropTypes.object,
42 children: PropTypes.node,
43 autoFocus: PropTypes.bool,
44 readOnly: PropTypes.bool,
45 name: PropTypes.string,
46 value: PropTypes.string,
47 autoComplete: PropTypes.string,
48 type: PropTypes.string,
49};
52ProtoInput.defaultProps = {
53 disabled: false,
54 autoFocus: false,
55 onChange: () => {},
56 onBlur: () => {},
57 onFocus: () => {},
58 onKeyPress: () => {},
59 style: {},
60 className: '',
61 value: '',
62 name: '',
63 autoComplete: 'off',
64 type: 'input',
65};
68export default ProtoInput;