eslint-plugin-react-form-fields
Version:
React Form Fields specific linting rules for ESLint
64 lines (63 loc) • 3.12 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_ast_utils_1 = require("jsx-ast-utils");
const capitalize_1 = require("../utils/capitalize");
const docsUrl_1 = require("../utils/docsUrl");
const getTagName_1 = require("../utils/getTagName");
const isCheckboxOrRadioInput_1 = require("../utils/isCheckboxOrRadioInput");
const isFormFieldTags_1 = require("../utils/isFormFieldTags");
const rule = {
meta: {
docs: {
description: 'Forbid to specify both value/checked and defaultValue/defaultChecked props to form fields',
recommended: 'error',
url: (0, docsUrl_1.docsUrl)('no-mix-controlled-with-uncontrolled'),
},
messages: {
'no-mix-controlled-with-uncontrolled': '{{capitalizeTagName}} elements must be either controlled or uncontrolled (specify either the {{valueName}} prop, or the {{defaultValueName}} prop, but not both). Decide between using a controlled or uncontrolled {{tagName}} element and remove one of these props.',
},
schema: [],
type: 'problem',
},
create: (context) => {
return {
JSXElement(node) {
const tagName = (0, getTagName_1.getTagName)(node);
if (!(0, isFormFieldTags_1.isFormFieldTags)(node)) {
return;
}
if ((0, isCheckboxOrRadioInput_1.isCheckboxOrRadioInput)(node)) {
const hasCheckedProp = (0, jsx_ast_utils_1.hasProp)(node.openingElement.attributes, 'checked');
const hasDefaultCheckedProp = (0, jsx_ast_utils_1.hasProp)(node.openingElement.attributes, 'defaultChecked');
if (hasCheckedProp && hasDefaultCheckedProp) {
context.report({
node,
messageId: 'no-mix-controlled-with-uncontrolled',
data: {
tagName,
capitalizeTagName: (0, capitalize_1.capitalize)(tagName),
valueName: 'checked',
defaultValueName: 'defaultChecked',
},
});
}
}
const hasValueProp = (0, jsx_ast_utils_1.hasProp)(node.openingElement.attributes, 'value');
const hasDefaultValueProp = (0, jsx_ast_utils_1.hasProp)(node.openingElement.attributes, 'defaultValue');
if (hasValueProp && hasDefaultValueProp) {
context.report({
node,
messageId: 'no-mix-controlled-with-uncontrolled',
data: {
tagName,
capitalizeTagName: (0, capitalize_1.capitalize)(tagName),
valueName: 'value',
defaultValueName: 'defaultValue',
},
});
}
},
};
},
};
exports.default = rule;