-
-
Notifications
You must be signed in to change notification settings - Fork 50
/
index.js
77 lines (66 loc) · 1.73 KB
/
index.js
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
import React from 'react';
import PropTypes from 'prop-types';
import style from 'PVWStyle/ReactWidgets/DropDownWidget.mcss';
export default class DropDownWidget extends React.Component {
constructor(props) {
super(props);
this.state = {
open: false,
field: props.field || props.fields[0],
};
// Bind callback
this.setField = this.setField.bind(this);
this.toggleDropdown = this.toggleDropdown.bind(this);
}
getField(e) {
return this.state.field;
}
setField(e) {
this.setState({ field: e.target.innerHTML });
this.props.onChange(e.target.innerHTML);
}
toggleDropdown() {
this.setState({ open: !this.state.open });
}
render() {
return (
<div className={style.container} onClick={this.toggleDropdown}>
{this.state.field}
<ul className={this.state.open ? style.list : style.hidden}>
{this.props.fields.map((v) => {
// this pops up in there for some reason.
if (v === '__internal') {
return null;
}
if (v === this.state.field) {
return (
<li
className={style.selectedItem}
key={v}
onClick={this.setField}
>
{v}
</li>
);
}
return (
<li className={style.item} key={v} onClick={this.setField}>
{v}
</li>
);
})}
</ul>
</div>
);
}
}
DropDownWidget.propTypes = {
field: PropTypes.string,
fields: PropTypes.array,
onChange: PropTypes.func,
};
DropDownWidget.defaultProps = {
field: undefined,
fields: undefined,
onChange: undefined,
};