facebook/prop-types

Error in optional prop-types check in typescript

ngoctuan001 opened this issue · 1 comments

I'm writing react typescript and have problem with optional prop-types check. Below is my code:

import PropTypes from 'prop-types';

interface InputNumberProps {
  className?: string | string[];
}  

export const InputNumberAutosize = (props: InputNumberProps, ref: refType) => {  
   ...
}

const InputNumberAutoSizeComponent = React.forwardRef(InputNumberAutosize);

InputNumberAutoSizeComponent.propTypes = {
  className: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]),
};

Somehow my typescript throw error in className when declare like this. Here is the error:

TS2322: Type 'Requireable<string | (string | null | undefined)[]>' is not assignable to type 'Validator<string | string[] | null | undefined>'.    
   
Types of property '[nominalTypeHack]' are incompatible. 

Type '{ type: string | (string | null | undefined)[] | null | undefined; } | undefined' is not assignable to type '{ type: string | string[] | null | undefined; } | undefined'.     

Type '{ type: string | (string | null | undefined)[] | null | undefined; }' is not assignable to type '{ type: string | string[] | null | undefined; }'.       

Types of property 'type' are incompatible.        

Type 'string | (string | null | undefined)[] | null | undefined' is not assignable to type 'string | string[] | null | undefined'.          

Type '(string | null | undefined)[]' is not assignable to type 'string | string[] | null | undefined'.               

Type '(string | null | undefined)[]' is not assignable to type 'string[]'.   

Type 'string | null | undefined' is not assignable to type 'string'.       

Type 'undefined' is not assignable to type 'string'.

This looks weird because as I read in the documents, the prop-types should be optional and accept undefined. Anyone know how to fix this, thanks.

Version: 15.7.3
"typescript": "^3.4.2"

Update: I think the problem come from PropTypes.arrayOf(PropTypes.string). The arrayOf cause the error.

This repo does not provide types, so this isn't an issue with this repo - perhaps with the DT types.

Specifically, though, all PropTypes are optional unless you append .isRequired to them. iow:

InputNumberAutoSizeComponent.propTypes = {
  className: PropTypes.oneOfType([
    PropTypes.string.isRequired,
    PropTypes.arrayOf(PropTypes.string.isRequired)
  ].isRequired),
};