From db624ee388d4bffe6992c4b76b5b60851b9e8f54 Mon Sep 17 00:00:00 2001
From: David Ballesteros <davibq@gmail.com>
Date: Thu, 9 Aug 2018 11:55:32 -0600
Subject: [PATCH] [Popover] Adding ModalClasses prop to popover component

---
 packages/material-ui/src/Popover/Popover.d.ts |  1 +
 packages/material-ui/src/Popover/Popover.js   | 13 ++++++++++++-
 pages/api/popover.md                          |  1 +
 3 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/packages/material-ui/src/Popover/Popover.d.ts b/packages/material-ui/src/Popover/Popover.d.ts
index de2712c73405a9..faabdab2998a78 100644
--- a/packages/material-ui/src/Popover/Popover.d.ts
+++ b/packages/material-ui/src/Popover/Popover.d.ts
@@ -28,6 +28,7 @@ export interface PopoverProps
   getContentAnchorEl?: (element: HTMLElement) => HTMLElement;
   marginThreshold?: number;
   modal?: boolean;
+  ModalClasses?: ModalClassKey;
   PaperProps?: Partial<PaperProps>;
   role?: string;
   transformOrigin?: PopoverOrigin;
diff --git a/packages/material-ui/src/Popover/Popover.js b/packages/material-ui/src/Popover/Popover.js
index 8c6689ded6ff26..514eaddc4afb90 100644
--- a/packages/material-ui/src/Popover/Popover.js
+++ b/packages/material-ui/src/Popover/Popover.js
@@ -278,6 +278,7 @@ class Popover extends React.Component {
       elevation,
       getContentAnchorEl,
       marginThreshold,
+      ModalClasses,
       onEnter,
       onEntered,
       onEntering,
@@ -307,7 +308,13 @@ class Popover extends React.Component {
       containerProp || (anchorEl ? ownerDocument(getAnchorEl(anchorEl)).body : undefined);
 
     return (
-      <Modal container={container} open={open} BackdropProps={{ invisible: true }} {...other}>
+      <Modal
+        classes={ModalClasses}
+        container={container}
+        open={open}
+        BackdropProps={{ invisible: true }}
+        {...other}
+      >
         <TransitionComponent
           appear
           in={open}
@@ -419,6 +426,10 @@ Popover.propTypes = {
    * Specifies how close to the edge of the window the popover can appear.
    */
   marginThreshold: PropTypes.number,
+  /**
+   * `classes` property applied to the [`Modal`](/api/modal) element.
+   */
+  ModalClasses: PropTypes.object,
   /**
    * Callback fired when the component requests to be closed.
    *
diff --git a/pages/api/popover.md b/pages/api/popover.md
index 5c52886d0266d8..722d6320ba20a5 100644
--- a/pages/api/popover.md
+++ b/pages/api/popover.md
@@ -26,6 +26,7 @@ title: Popover API
 | <span class="prop-name">elevation</span> | <span class="prop-type">number | <span class="prop-default">8</span> | The elevation of the popover. |
 | <span class="prop-name">getContentAnchorEl</span> | <span class="prop-type">func |   | This function is called in order to retrieve the content anchor element. It's the opposite of the `anchorEl` property. The content anchor element should be an element inside the popover. It's used to correctly scroll and set the position of the popover. The positioning strategy tries to make the content anchor element just above the anchor element. |
 | <span class="prop-name">marginThreshold</span> | <span class="prop-type">number | <span class="prop-default">16</span> | Specifies how close to the edge of the window the popover can appear. |
+| <span class="prop-name">ModalClasses</span> | <span class="prop-type">object |   | Override or extend the styles applied to the Modal component. See [CSS API](#css-api) below for more details. |
 | <span class="prop-name">onClose</span> | <span class="prop-type">func |   | Callback fired when the component requests to be closed.<br><br>**Signature:**<br>`function(event: object) => void`<br>*event:* The event source of the callback. |
 | <span class="prop-name">onEnter</span> | <span class="prop-type">func |   | Callback fired before the component is entering. |
 | <span class="prop-name">onEntered</span> | <span class="prop-type">func |   | Callback fired when the component has entered. |