From d2b7842057f7ed8c0fc0fb767fa77bf6063263ea Mon Sep 17 00:00:00 2001
From: Manu <manukoshyabraham@gmail.com>
Date: Sat, 23 Jun 2018 09:15:23 +0530
Subject: [PATCH] feat(Modal): add ref to Modal (#1082)

---
 docs/lib/Components/ModalsPage.js | 3 ++-
 src/Fade.js                       | 4 +++-
 src/Modal.js                      | 3 +++
 3 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/docs/lib/Components/ModalsPage.js b/docs/lib/Components/ModalsPage.js
index 3baa85d73..931033bd0 100644
--- a/docs/lib/Components/ModalsPage.js
+++ b/docs/lib/Components/ModalsPage.js
@@ -93,10 +93,11 @@ export default class ModalsPage extends React.Component {
   // timeout is 150ms by default to match bootstrap
   // see [Fade](/components/fade/) for more details
   backdropTransition: PropTypes.shape(Fade.propTypes),
-  // modalTransition - controls modal transition 
+  // modalTransition - controls modal transition
   // timeout is 300ms by default to match bootstrap
   // see [Fade](/components/fade/) for more details
   modalTransition: PropTypes.shape(Fade.propTypes),
+  innerRef: PropTypes.object,
 }`}
           </PrismCode>
         </pre>
diff --git a/src/Fade.js b/src/Fade.js
index c9ab1cbd0..cb2e25c7e 100644
--- a/src/Fade.js
+++ b/src/Fade.js
@@ -15,6 +15,7 @@ const propTypes = {
   baseClassActive: PropTypes.string,
   className: PropTypes.string,
   cssModule: PropTypes.object,
+  innerRef: PropTypes.object,
 };
 
 const defaultProps = {
@@ -37,6 +38,7 @@ function Fade(props) {
     className,
     cssModule,
     children,
+    innerRef,
     ...otherProps
   } = props;
 
@@ -64,7 +66,7 @@ function Fade(props) {
           isActive && baseClassActive
         ), cssModule);
         return (
-          <Tag className={classes} {...childProps}>
+          <Tag className={classes} {...childProps} ref={innerRef}>
             {children}
           </Tag>
         );
diff --git a/src/Modal.js b/src/Modal.js
index 980aa0f63..9e5c3f710 100644
--- a/src/Modal.js
+++ b/src/Modal.js
@@ -48,6 +48,7 @@ const propTypes = {
   ]),
   backdropTransition: FadePropTypes,
   modalTransition: FadePropTypes,
+  innerRef: PropTypes.object,
 };
 
 const propsToOmit = Object.keys(propTypes);
@@ -260,6 +261,7 @@ class Modal extends React.Component {
         role,
         labelledBy,
         external,
+        innerRef,
       } = this.props;
 
       const modalAttributes = {
@@ -297,6 +299,7 @@ class Modal extends React.Component {
               onExited={this.onClosed}
               cssModule={cssModule}
               className={mapToCssModules(classNames('modal', modalClassName), cssModule)}
+              innerRef={innerRef}
             >
               {external}
               {this.renderModalDialog()}