Added renderComponent to props (#36600)

Updating tests

Removed onChange from test class

Updated version to 8.1

types/react-image-crop/index.d.ts

@@ -1,4 +1,4 @@
-// Type definitions for react-image-crop 8.0
+// Type definitions for react-image-crop 8.1
 // Project: https://github.com/DominicTobias/react-image-crop
 // Definitions by: Daniela Yassuda <https://github.com/danielasy>
 //                 Elias Chaaya <https://github.com/chaaya>
@@ -42,6 +42,7 @@ declare namespace ReactCrop {
         onImageError?: (event: React.SyntheticEvent<HTMLImageElement>) => void;
         className?: string;
         locked?: boolean;
+        renderComponent?: ReactNode;
         renderSelectionAddon?: (state: any) => ReactNode;
     }
 

types/react-image-crop/test/react-image-crop-module-tests.tsx

@@ -61,6 +61,25 @@ class AspectRatioTest extends React.Component<{}, TestState> {
     }
 }
 
+// Testing renderComponent
+class RenderComponentTest extends React.Component {
+    render() {
+        const videoComponent = (
+            <video autoPlay loop style={{ display: 'block', maxWidth: '100%' }}>
+                <source src="sample.mp4" type="video/mp4" />
+            </video>
+        );
+
+        return (
+            <ReactCrop
+                src="imageSrc"
+                onChange={(crop) => console.log(crop)}
+                renderComponent={videoComponent}
+            />
+        );
+    }
+}
+
 // All available props
 class CompleteTest extends React.Component<{}, TestState> {
     state = initialState;
@@ -110,6 +129,7 @@ class CompleteTest extends React.Component<{}, TestState> {
                 onImageError={this.onImageError}
                 className="my-cropper"
                 locked={false}
+                renderComponent={<div></div>}
             />
         );
     }