informed
Version:
A lightweight framework and utility for building powerful forms in React applications
49 lines (42 loc) • 1.81 kB
JavaScript
;
Object.defineProperty(exports, '__esModule', { value: true });
var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
var React = require('react');
var useField = require('../../hooks/useField.js');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var _excluded = ["id", "label"];
var Checkbox = function Checkbox(props) {
var _useField = useField.useField(props),
render = _useField.render,
userProps = _useField.userProps,
fieldState = _useField.fieldState,
fieldApi = _useField.fieldApi;
var setValue = fieldApi.setValue,
setTouched = fieldApi.setTouched;
var value = fieldState.value,
error = fieldState.error,
showError = fieldState.showError;
var id = userProps.id,
label = userProps.label,
rest = _rollupPluginBabelHelpers.objectWithoutProperties(userProps, _excluded);
return render( /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, label ? /*#__PURE__*/React__default["default"].createElement("label", {
htmlFor: id
}, label) : null, /*#__PURE__*/React__default["default"].createElement("input", _rollupPluginBabelHelpers["extends"]({}, rest, {
id: id,
checked: !!value,
"aria-invalid": !!showError,
"aria-describedby": "".concat(id, "-error"),
onChange: function onChange(e) {
setValue(e.target.checked, e);
},
onBlur: function onBlur(e) {
setTouched(true, e);
},
type: "checkbox"
})), showError ? /*#__PURE__*/React__default["default"].createElement("small", {
role: "alert",
id: "".concat(id, "-error")
}, error) : null));
};
exports.Checkbox = Checkbox;