fix: remove deprecated() lib and close react-dropzone#764

BREAKING CHANGE:

Remove deprecated prop {disableClick}. To prevent the default behavior of click just use idiomatic js:
```js
<Dropzone>
  {({getRootProps}) => (
    <div {...getRootProps({onClick: evt => evt.preventDefault()})}>
      Drop some files here
    </div>
  )}
</Dropzone>
```

Author: Roland Groza

examples/Events/README.md

@@ -2,17 +2,11 @@ If you'd like to prevent the default behaviour for `onClick`, `onFocus`, `onBlur
 
 ```jsx harmony
 class Events extends React.Component {
-  onClick(evt) {
-    evt.preventDefault();
-  }
-
   render() {
     return (
-      <Dropzone
-        onClick={this.onClick.bind(this)}
-      >
+      <Dropzone>
         {({getRootProps, getInputProps}) => (
-          <div {...getRootProps()}>
+          <div {...getRootProps({onClick: evt => evt.preventDefault()})}>
             <input {...getInputProps()} />
             <p>Click to select files should not work!</p>
           </div>
@@ -24,6 +18,3 @@ class Events extends React.Component {
 
 <Events />
 ```
-
-**NOTE**: You can still use the `{disableClick}` prop to achieve the same behaviour,
-but it has been deprecated and will be removed with the next major version.

examples/FileDialog/Readme.md

@@ -14,10 +14,9 @@ Due to the lack of official docs on this (at least we haven’t found any. If yo
 ```jsx harmony
 <Dropzone
   onDrop={files => alert(JSON.stringify(files.map(f => f.name)))}
-  disableClick
 >
   {({getRootProps, getInputProps, open}) => (
-    <div {...getRootProps()}>
+    <div {...getRootProps({onClick: evt => evt.preventDefault()})}>
       <input {...getInputProps()} />
         <p>Drop files here</p>
 
@@ -37,10 +36,9 @@ const dropzoneRef = React.createRef();
 <Dropzone
   ref={dropzoneRef}
   onDrop={files => { alert(JSON.stringify(files.map(f => f.name))) }}
-  disableClick
 >
   {({getRootProps, getInputProps}) => (
-    <div {...getRootProps()}>
+    <div {...getRootProps({onClick: evt => evt.preventDefault()})}>
       <input {...getInputProps()} />
         <p>Drop files here</p>
 

examples/Fullscreen/Readme.md

@@ -45,12 +45,11 @@ class FullScreen extends React.Component {
       <Dropzone
         accept={accept}
         onDrop={this.onDrop.bind(this)}
-        disableClick
       >
         {({getRootProps, getInputProps, isDragActive}) => (
-            <div {...getRootProps()} style={{position: "relative"}}>
+            <div {...getRootProps({onClick: evt => evt.preventDefault()})} style={{position: "relative"}}>
               <input {...getInputProps()} />
-              { isDragActive && <div style={overlayStyle}>Drop files here</div> }    
+              { isDragActive && <div style={overlayStyle}>Drop files here</div> }
               <h4>My awesome app</h4>
               <label htmlFor="mimetypes">Enter mime types you want to accept: </label>
               <input

src/index.js

@@ -3,7 +3,6 @@
 import React from 'react'
 import { fromEvent } from 'file-selector'
 import PropTypes from 'prop-types'
-import deprecated from 'prop-types-extra/lib/deprecated'
 import {
   isDragDataWithFiles,
   supportMultiple,
@@ -206,16 +205,16 @@ class Dropzone extends React.Component {
   }
 
   onClick = evt => {
-    const { onClick, disableClick } = this.props
+    const { onClick } = this.props
 
     // if onClick prop is given, run it first
     if (onClick) {
       onClick.call(this, evt)
     }
 
-    // if disableClick is not set and the event hasn't been default prefented within
+    // If the event hasn't been default prevented from within
     // the onClick listener, open the file dialog
-    if (!disableClick && !isDefaultPrevented(evt)) {
+    if (!isDefaultPrevented(evt)) {
       evt.stopPropagation()
 
       // in IE11/Edge the file-browser dialog is blocking, ensure this is behind setTimeout
@@ -435,16 +434,6 @@ Dropzone.propTypes = {
    */
   children: PropTypes.func,
 
-  /**
-   * Disallow clicking on the dropzone container to open file dialog
-   * @deprecated Use onClick={evt => evt.preventDefault()} to prevent the default behaviour (open the file select dialog).
-   * This prop will be removed in the next major version.
-   */
-  disableClick: deprecated(
-    PropTypes.bool,
-    'Use onClick={evt => evt.preventDefault()} instead. This prop will be removed in the next major version'
-  ),
-
   /**
    * Enable/disable the dropzone entirely
    */
@@ -573,7 +562,6 @@ Dropzone.propTypes = {
 Dropzone.defaultProps = {
   preventDropOnDocument: true,
   disabled: false,
-  disableClick: false,
   multiple: true,
   maxSize: Infinity,
   minSize: 0,

src/index.spec.js

@@ -312,21 +312,6 @@ describe('Dropzone', () => {
       expect(open).toHaveBeenCalled()
     })
 
-    it('should not call `open` if disableClick prop is true', () => {
-      const dropzone = mount(
-        <Dropzone disableClick>
-          {({ getRootProps, getInputProps }) => (
-            <div {...getRootProps()}>
-              <input {...getInputProps()} />
-            </div>
-          )}
-        </Dropzone>
-      )
-      const open = jest.spyOn(dropzone.instance(), 'open')
-      dropzone.simulate('click')
-      expect(open).not.toHaveBeenCalled()
-    })
-
     it('should call `onClick` callback if provided', () => {
       const onClick = jest.fn()
       const dropzone = mount(
@@ -344,23 +329,6 @@ describe('Dropzone', () => {
       expect(onClick).toHaveBeenCalled()
     })
 
-    it('should call `onClick` if provided even if `disableClick` is set', () => {
-      const onClick = jest.fn()
-      const dropzone = mount(
-        <Dropzone onClick={onClick} disableClick>
-          {({ getRootProps, getInputProps }) => (
-            <div {...getRootProps()}>
-              <input {...getInputProps()} />
-            </div>
-          )}
-        </Dropzone>
-      )
-      const open = jest.spyOn(dropzone.instance(), 'open')
-      dropzone.simulate('click')
-      expect(open).toHaveBeenCalledTimes(0)
-      expect(onClick).toHaveBeenCalled()
-    })
-
     it('should not call `open` if event was prevented in `onClick`', () => {
       const onClick = jest.fn(event => event.preventDefault())
       const dropzone = mount(
@@ -452,24 +420,6 @@ describe('Dropzone', () => {
       expect(onClickInner).toHaveBeenCalled()
     })
 
-    it('should invoke onClick on the wrapper if disableClick is set', () => {
-      const onClick = jest.fn()
-      const component = mount(
-        <div onClick={onClick}>
-          <Dropzone disableClick>
-            {({ getRootProps, getInputProps }) => (
-              <div {...getRootProps()}>
-                <input {...getInputProps()} />
-              </div>
-            )}
-          </Dropzone>
-        </div>
-      )
-
-      component.find(Dropzone).simulate('click')
-      expect(onClick).toHaveBeenCalled()
-    })
-
     it('should invoke inputProps onClick if provided', () => {
       const onClick = jest.fn()
       const component = mount(
@@ -1078,7 +1028,7 @@ describe('Dropzone', () => {
   describe('open() fn', () => {
     it('should be exposed to children', () => {
       const subject = mount(
-        <Dropzone disableClick>
+        <Dropzone>
           {({ getRootProps, getInputProps, open }) => (
             <div {...getRootProps()}>
               <input {...getInputProps()} />

typings/react-dropzone.d.ts

@@ -15,7 +15,6 @@ export type DropzoneProps = Pick<React.HTMLProps<HTMLElement>, PropTypes> & {
   maxSize?: number;
   minSize?: number;
   preventDropOnDocument?: boolean;
-  disableClick?: boolean;
   disabled?: boolean;
 };
 

typings/tests/all.tsx

@@ -26,7 +26,6 @@ export default class Test extends React.Component {
           minSize={2000}
           maxSize={Infinity}
           preventDropOnDocument
-          disableClick
           disabled
           multiple={false}
           accept="*.png"