diff --git a/lib/util/propTypes.js b/lib/util/propTypes.js index c5aa35eb61..6ff6c3dcc5 100644 --- a/lib/util/propTypes.js +++ b/lib/util/propTypes.js @@ -627,7 +627,8 @@ module.exports = function propTypesInstructions(context, components, utils) { typeName = node.typeName.name; const leftMostName = getLeftMostTypeName(node.typeName); const shouldTraverseTypeParams = genericReactTypesImport.has(leftMostName); - if (shouldTraverseTypeParams && node.typeParameters && node.typeParameters.length !== 0) { + const nodeType = node.typeArguments || node.typeParameters; + if (shouldTraverseTypeParams && nodeType && nodeType.length !== 0) { // All react Generic types are derived from: // type PropsWithChildren

= P & { children?: ReactNode | undefined } // So we should construct an optional children prop @@ -638,7 +639,7 @@ module.exports = function propTypesInstructions(context, components, utils) { const idx = genericTypeParamIndexWherePropsArePresent[ leftMostName !== rightMostName ? rightMostName : importedName ]; - const nextNode = node.typeParameters.params[idx]; + const nextNode = nodeType.params[idx]; this.visitTSNode(nextNode); return; } @@ -727,9 +728,10 @@ module.exports = function propTypesInstructions(context, components, utils) { convertReturnTypeToPropTypes(node) { // ReturnType should always have one parameter - if (node.typeParameters) { - if (node.typeParameters.params.length === 1) { - let returnType = node.typeParameters.params[0]; + const nodeType = node.typeArguments || node.typeParameters; + if (nodeType) { + if (nodeType.params.length === 1) { + let returnType = nodeType.params[0]; // This line is trying to handle typescript-eslint-parser // typescript-eslint-parser TSTypeQuery is wrapped by TSTypeReference if (astUtil.isTSTypeReference(returnType)) { @@ -761,8 +763,9 @@ module.exports = function propTypesInstructions(context, components, utils) { case 'ObjectExpression': iterateProperties(context, res.properties, (key, value, propNode) => { if (propNode && propNode.argument && propNode.argument.type === 'CallExpression') { - if (propNode.argument.typeParameters) { - this.visitTSNode(propNode.argument.typeParameters); + const propNodeType = propNode.argument.typeArguments || propNode.argument.typeParameters; + if (propNodeType) { + this.visitTSNode(propNodeType); } else { // Ignore this CallExpression return value since it doesn't have any typeParameters to let us know it's types. this.shouldIgnorePropTypes = true; @@ -782,8 +785,8 @@ module.exports = function propTypesInstructions(context, components, utils) { }); break; case 'CallExpression': - if (res.typeParameters) { - this.visitTSNode(res.typeParameters); + if (res.typeArguments || res.typeParameters) { + this.visitTSNode(res.typeArguments || res.typeParameters); } else { // Ignore this CallExpression return value since it doesn't have any typeParameters to let us know it's types. this.shouldIgnorePropTypes = true; @@ -960,8 +963,9 @@ module.exports = function propTypesInstructions(context, components, utils) { break; case 'GenericTypeAnnotation': if (propTypes.id.name === '$ReadOnly') { + const propType = propTypes.typeArguments || propTypes.typeParameters; ignorePropsValidation = declarePropTypesForObjectTypeAnnotation( - propTypes.typeParameters.params[0], + propType.params[0], declaredPropTypes ); } else { @@ -1000,8 +1004,10 @@ module.exports = function propTypesInstructions(context, components, utils) { if ( node.parent && node.parent.callee - && node.parent.typeParameters - && node.parent.typeParameters.params + && ( + (node.parent.typeArguments && node.parent.typeArguments.params) + || (node.parent.typeParameters && node.parent.typeParameters.params) + ) && ( node.parent.callee.name === 'forwardRef' || ( node.parent.callee.object @@ -1011,9 +1017,9 @@ module.exports = function propTypesInstructions(context, components, utils) { ) ) ) { - const propTypes = node.parent.typeParameters.params[1]; + const propTypes = node.parent.typeArguments || node.parent.typeParameters; const declaredPropTypes = {}; - const obj = new DeclarePropTypesForTSTypeAnnotation(propTypes, declaredPropTypes); + const obj = new DeclarePropTypesForTSTypeAnnotation(propTypes.params[1], declaredPropTypes); components.set(node, { declaredPropTypes: obj.declaredPropTypes, ignorePropsValidation: obj.shouldIgnorePropTypes, @@ -1059,7 +1065,7 @@ module.exports = function propTypesInstructions(context, components, utils) { if ( annotation && annotation.type !== 'TSTypeReference' - && annotation.typeParameters == null + && (annotation.typeArguments == null || annotation.typeParameters == null) ) { return; }