react-modal updates for 3.6 (#29585)

* updates react-modal definitions for 3.6

* adds specs for react-modal definition updates

* adds attribution for react-modal updates

* remove trailing whitespace

types/react-modal/index.d.ts

@@ -1,11 +1,12 @@
-// Type definitions for react-modal 3.2
+// Type definitions for react-modal 3.6
 // Project: https://github.com/reactjs/react-modal
 // Definitions by: Rajab Shakirov <https://github.com/radziksh>,
 //                 Drew Noakes <https://github.com/drewnoakes>,
 //                 Thomas B Homburg <https://github.com/homburg>,
 //                 Tatu Tamminen <https://github.com/ttamminen>,
 //                 Uwe Wiemer <https://github.com/hallowatcher>,
-//                 Peter Blazejewicz <https://github.com/peterblazejewicz>
+//                 Peter Blazejewicz <https://github.com/peterblazejewicz>,
+//                 Justin Powell <https://github.com/jpowell>
 // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
 // TypeScript Version: 2.8
 
@@ -48,6 +49,9 @@ declare namespace ReactModal {
         /* String className to be applied to the document.body. */
         bodyOpenClassName?: string;
 
+        /* String className to be applied to the document.html. */
+        htmlOpenClassName?: string;
+
         /* String or object className to be applied to the modal content. */
         className?: string | Classes;
 
@@ -87,6 +91,9 @@ declare namespace ReactModal {
         /* Additional aria attributes. */
         aria?: Aria;
 
+        /* Additional data attributes to be applied to to the modal content in the form of "data-*" */
+        data?: any;
+
         /* String indicating the role of the modal, allowing the 'dialog' role to be applied if desired. */
         role?: string;
 

types/react-modal/react-modal-tests.tsx

@@ -51,6 +51,10 @@ class ExampleOfUsingReactModal extends React.Component {
       labelledby: 'labelledby',
       describedby: 'describedby'
     };
+    const customDataVariables = {
+      dataOne: 'one',
+      dataTwo: 'two'
+    };
     return (
       <ReactModal
         isOpen={true}
@@ -62,7 +66,9 @@ class ExampleOfUsingReactModal extends React.Component {
         className={customClasses}
         overlayClassName={customOverlayClasses}
         bodyOpenClassName={'bodyOpenClassName'}
+        htmlOpenClassName={'htmlOpenClassName'}
         aria={customAriaVariables}
+        data={customDataVariables}
         contentRef={instance => this.contentRef = instance}
         overlayRef={instance => this.overlayRef = instance}
         >