-
Notifications
You must be signed in to change notification settings - Fork 34
/
SelectWidget.jsx
63 lines (59 loc) · 1.49 KB
/
SelectWidget.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
import React from 'react';
import classnames from 'classnames';
import { asNumber } from '@department-of-veterans-affairs/react-jsonschema-form/lib/utils';
import onlyUpdateForKeys from 'recompose/onlyUpdateForKeys';
function processValue({ type }, value) {
if (type === 'boolean') {
return value === 'true';
} else if (type === 'number') {
return asNumber(value);
}
return value === '' ? undefined : value;
}
function getValue(event) {
return event.target.value;
}
function SelectWidget({
schema,
id,
options,
value,
required,
disabled,
readonly,
multiple,
onChange,
onBlur,
placeholder
}) {
const { enumOptions, labels = {} } = options;
return (
<select
id={id}
name={id}
multiple={multiple}
className={classnames(options.widgetClassNames)}
value={value || ''}
required={required}
disabled={disabled}
readOnly={readonly}
onBlur={(event) => {
const newValue = getValue(event, multiple);
onBlur(id, processValue(schema, newValue));
}}
onChange={(event) => {
const newValue = getValue(event, multiple);
onChange(processValue(schema, newValue));
}}>
{!schema.default && <option value="">{placeholder}</option>}
{enumOptions.map((option, i) => {
return <option key={i} value={option.value}>{labels[option.value] || option.label}</option>;
})
}</select>
);
}
export default onlyUpdateForKeys([
'id',
'value',
'schema',
])(SelectWidget);