From 83251e5e682abfa3252ff89d4bacf47fdc1f4270 Mon Sep 17 00:00:00 2001
From: Paul Sachs <11449728+paul-sachs@users.noreply.github.com>
Date: Wed, 29 Apr 2020 14:14:17 -0400
Subject: [PATCH] Added innerRef prop to expose wrapping div (#1176)

---
 README.md                       | 5 ++++-
 lib/ReactGridLayout.jsx         | 3 ++-
 lib/ReactGridLayoutPropTypes.js | 9 +++++++--
 3 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md
index 7d15477be..d024c3f64 100644
--- a/README.md
+++ b/README.md
@@ -355,7 +355,10 @@ onResize: ItemCallback,
 // Calls when resize is complete.
 onResizeStop: ItemCallback,
 // Calls when some element has been dropped
-onDrop: (elemParams: { x: number, y: number, w: number, h: number, e: Event }) => void
+onDrop: (elemParams: { x: number, y: number, w: number, h: number, e: Event }) => void,
+
+// Ref for getting a reference for the wrapping div.
+innerRef: ?React.Ref
 ```
 
 ### Responsive Grid Layout Props
diff --git a/lib/ReactGridLayout.jsx b/lib/ReactGridLayout.jsx
index 2b6fb4c3d..ce886fa6e 100644
--- a/lib/ReactGridLayout.jsx
+++ b/lib/ReactGridLayout.jsx
@@ -683,7 +683,7 @@ export default class ReactGridLayout extends React.Component<Props, State> {
   };
 
   render() {
-    const { className, style, isDroppable } = this.props;
+    const { className, style, isDroppable, innerRef } = this.props;
 
     const mergedClassName = classNames(layoutClassName, className);
     const mergedStyle = {
@@ -693,6 +693,7 @@ export default class ReactGridLayout extends React.Component<Props, State> {
 
     return (
       <div
+        ref={innerRef}
         className={mergedClassName}
         style={mergedStyle}
         onDrop={isDroppable ? this.onDrop : noop}
diff --git a/lib/ReactGridLayoutPropTypes.js b/lib/ReactGridLayoutPropTypes.js
index 4fc3147a7..38aa89bb5 100644
--- a/lib/ReactGridLayoutPropTypes.js
+++ b/lib/ReactGridLayoutPropTypes.js
@@ -2,6 +2,7 @@
 import PropTypes from "prop-types";
 import React from "react";
 import type {
+  Ref,
   ChildrenArray as ReactChildrenArray,
   Element as ReactElement
 } from "react";
@@ -45,7 +46,8 @@ export type Props = {|
     h: number,
     e: Event
   }) => void,
-  children: ReactChildrenArray<ReactElement<any>>
+  children: ReactChildrenArray<ReactElement<any>>,
+  innerRef?: Ref<"div">
 |};
 
 export default {
@@ -175,5 +177,8 @@ export default {
       }
       keys[child.key] = true;
     });
-  }
+  },
+
+  // Optional ref for getting a reference for the wrapping div.
+  innerRef: PropTypes.any
 };