react-dropzone: @types/react@16.9.46: Types of property 'style' are incompatible
Do you want to request a feature or report a bug?
- I found a bug
- I want to propose a feature
What is the current behavior?
Typescript errors out when building the react-dropzone example, using the latest version of @types/react
If the current behavior is a bug, please provide the steps to reproduce.
- Upgrade @types/react to 16.9.46
- Use react-dropzone 11.0.3
- Run example code:
function MyDropzone() {
const onDrop = useCallback(acceptedFiles => {
// Do something with the files
}, [])
const {getRootProps, getInputProps, isDragActive} = useDropzone({onDrop})
return (
<div {...getRootProps()}>
<input {...getInputProps()} />
{
isDragActive ?
<p>Drop the files here ...</p> :
<p>Drag 'n' drop some files here, or click to select files</p>
}
</div>
)
}
Typescript fails with the following errors:
string | number | string[] | undefined; suppressContentEditableWarning?: boolean | undefined; ... 249 more ...; onTransitionEndCapture?: ((event: TransitionEvent<...>) => void) | undefined; }' is not assignable to type 'DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>'.
Type '{ children: Element[]; refKey?: string | undefined; defaultChecked?: boolean | undefined; defaultValue?: string | number | string[] | undefined; suppressContentEditableWarning?: boolean | undefined; ... 249 more ...; onTransitionEndCapture?: ((event: TransitionEvent<...>) => void) | undefined; }' is not assignable to type 'HTMLAttributes<HTMLDivElement>'.
Types of property 'style' are incompatible.
Type 'import("/Users/ldiqual/Siteline/siteline/node_modules/@types/react/index").CSSProperties | undefined' is not assignable to type 'React.CSSProperties | undefined'.
Type 'import("/Users/ldiqual/Siteline/siteline/node_modules/@types/react/index").CSSProperties' is not assignable to type 'React.CSSProperties'.
Types of property 'appearance' are incompatible.
Type '"-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "button-bevel" | "checkbox" | "listbox" | "menulist" | "menulist-button" | "meter" | "progress-bar" | "push-button" | ... 7 more ... | undefined' is not assignable to type '"-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "checkbox" | "listbox" | "menulist" | "menulist-button" | "meter" | "progress-bar" | "push-button" | "radio" | ... 6 more ... | undefined'.
Type '"button-bevel"' is not assignable to type '"-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "none" | "checkbox" | "listbox" | "menulist" | "menulist-button" | "meter" | "progress-bar" | "push-button" | "radio" | ... 6 more ... | undefined'.
This happens for @types/react v16.9.44 to v16.9.46. Does not affect v16.9.43.
What is the expected behavior?
Typescript successfully compiles the example code.
If this is a feature request, what is motivation or use case for changing the behavior?
Please mention other relevant information such as the browser version, Operating System and react-dropzone version.
About this issue
- Original URL
- State: closed
- Created 4 years ago
- Reactions: 4
- Comments: 20 (2 by maintainers)
For lost googlers: this usually means you have multiple occurrence of
@types/reactwith incompatible versions, either in your app or dependencies such asreact-dropzoneor others. You can add Yarn resolutions to fix this issue:Note: this seems problematic to me that those package comes with this dependency at first, but this seems to happen a lot.
Closing this as it doesn’t happen with the latest versions of typings.
Dosen’t happen with `“@types/react”: “^16.9.53”,