@focuson/form_components
Version:
Components that can be used by @focuson/forms
42 lines (41 loc) • 1.91 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.CustomError = exports.setEdited = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const canHaveErrorMessage = 'edited';
const setEdited = (e, data) => {
if (e) {
const validData = data != undefined && data.length > 0;
console.log('setEdited', data, validData);
e.dataset[canHaveErrorMessage] = validData ? 'true' : undefined;
}
};
exports.setEdited = setEdited;
function CustomError({ id, validationMessage, error }) {
const ref = (0, react_1.useRef)();
(0, react_1.useEffect)(() => {
var _a;
const errorDiv = ref.current;
const component = document.getElementById(id);
const hasBeenEdited = ((_a = component === null || component === void 0 ? void 0 : component.dataset) === null || _a === void 0 ? void 0 : _a[canHaveErrorMessage]) === 'true';
const actualError = error === undefined && component ? !component.checkValidity() : error;
// console.log ( 'CustomError - valid', id, 'actualError', actualError, 'checkValidity', component.checkValidity (), validationMessage, 'hasBeenEdited', hasBeenEdited )
if (hasBeenEdited && actualError) {
errorDiv.className = 'custom-error';
const msg = validationMessage ? validationMessage : component.validationMessage;
errorDiv.innerHTML = msg;
// component.setCustomValidity(msg)
// component.reportValidity()
errorDiv.hidden = false;
}
else {
// component.setCustomValidity('')
// component.reportValidity()
errorDiv.hidden = true;
errorDiv.className = '';
}
});
return (0, jsx_runtime_1.jsx)("div", { ref: ref, id: id + '.error', hidden: true });
}
exports.CustomError = CustomError;