@ezform/mui
Version:
Material UI form components for use with EZForm React validation and form library
14 lines (13 loc) • 1.23 kB
JavaScript
import React, { memo } from "react";
import { useField, propsEqual } from "@ezform/core";
import { FormControl, FormControlLabel, Checkbox, FormHelperText } from "@material-ui/core";
export var FieldCheckbox = memo(function (props) {
var id = props.id, name = props.name, form = props.form, _a = props.validator, validator = _a === void 0 ? function () { return null; } : _a, disabled = props.disabled, _b = props.readonly, readonly = _b === void 0 ? form.isReadonly : _b, label = props.label, _c = props.color, color = _c === void 0 ? "secondary" : _c, defaultValue = props.defaultValue;
useField(name, validator, form, defaultValue);
var handleChange = function (e, value) {
form.setField(name, value);
};
return (React.createElement(FormControl, { error: form.hasError(name) },
React.createElement(FormControlLabel, { control: React.createElement(Checkbox, { id: id, disabled: disabled, checked: form.getField(name) || false, value: form.getField(name) || "", onChange: !readonly && handleChange, name: name, color: color, readOnly: readonly }), label: label }),
form.hasError(name) && React.createElement(FormHelperText, { error: true }, form.getHelperText(name))));
}, propsEqual);