-
Notifications
You must be signed in to change notification settings - Fork 29
/
OptionsBoolean.js
39 lines (36 loc) · 1.48 KB
/
OptionsBoolean.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
import React from 'react';
import {useUID} from 'react-uid';
import {TranslateTitle} from '@ui-schema/react/TranslateTitle';
import {ValidityHelperText} from '../../Component/LocaleHelperText';
const BoolRenderer = ({showValidity, required, errors, value, storeKeys, onChange, schema}) => {
const id = useUID()
let classForm = ['custom-control', 'custom-switch'];
let classLabel = ['custom-control-label', 'text-light'];
let classFormControl = ['custom-control-input'];
if(showValidity && errors.hasError()) {
classFormControl.push('is-invalid');
}
if(showValidity && !errors.hasError()) {
classForm.push('was-validated');
}
return <div className={classForm.join(' ')}>
<input
type="checkbox" className={classFormControl.join(' ')} id={'uis-' + id}
checked={Boolean(value)}
required={required}
onChange={() =>
onChange({
storeKeys,
scopes: ['value'],
type: 'update',
updater: ({value: storeValue}) => ({value: !storeValue}),
schema,
required,
})
}
/>
<label className={classLabel.join(' ')} htmlFor={'uis-' + id}><TranslateTitle schema={schema} storeKeys={storeKeys}/>{(required ? ' *' : '')}</label>
<ValidityHelperText errors={errors} showValidity={showValidity} schema={schema}/>
</div>;
};
export {BoolRenderer};