123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111 |
- /**
- * @fileoverview Forbid certain props on components
- * @author Joe Lencioni
- */
- 'use strict';
- const docsUrl = require('../util/docsUrl');
- // ------------------------------------------------------------------------------
- // Constants
- // ------------------------------------------------------------------------------
- const DEFAULTS = ['className', 'style'];
- // ------------------------------------------------------------------------------
- // Rule Definition
- // ------------------------------------------------------------------------------
- module.exports = {
- meta: {
- docs: {
- description: 'Forbid certain props on components',
- category: 'Best Practices',
- recommended: false,
- url: docsUrl('forbid-component-props')
- },
- messages: {
- propIsForbidden: 'Prop "{{prop}}" is forbidden on Components'
- },
- schema: [{
- type: 'object',
- properties: {
- forbid: {
- type: 'array',
- items: {
- oneOf: [{
- type: 'string'
- }, {
- type: 'object',
- properties: {
- propName: {
- type: 'string'
- },
- allowedFor: {
- type: 'array',
- uniqueItems: true,
- items: {
- type: 'string'
- }
- },
- message: {
- type: 'string'
- }
- }
- }]
- }
- }
- }
- }]
- },
- create(context) {
- const configuration = context.options[0] || {};
- const forbid = new Map((configuration.forbid || DEFAULTS).map((value) => {
- const propName = typeof value === 'string' ? value : value.propName;
- const options = {
- allowList: typeof value === 'string' ? [] : (value.allowedFor || []),
- message: typeof value === 'string' ? null : value.message
- };
- return [propName, options];
- }));
- function isForbidden(prop, tagName) {
- const options = forbid.get(prop);
- const allowList = options ? options.allowList : undefined;
- // if the tagName is undefined (`<this.something>`), we assume it's a forbidden element
- return typeof allowList !== 'undefined' && (typeof tagName === 'undefined' || allowList.indexOf(tagName) === -1);
- }
- return {
- JSXAttribute(node) {
- const parentName = node.parent.name;
- // Extract a component name when using a "namespace", e.g. `<AntdLayout.Content />`.
- const tag = parentName.name || `${parentName.object.name}.${parentName.property.name}`;
- const componentName = parentName.name || parentName.property.name;
- if (componentName && typeof componentName[0] === 'string' && componentName[0] !== componentName[0].toUpperCase()) {
- // This is a DOM node, not a Component, so exit.
- return;
- }
- const prop = node.name.name;
- if (!isForbidden(prop, tag)) {
- return;
- }
- const customMessage = forbid.get(prop).message;
- context.report(Object.assign({
- node,
- data: {
- prop
- }
- }, customMessage ? {message: customMessage} : {messageId: 'propIsForbidden'}));
- }
- };
- }
- };
|