use context

mui · Nov 16, 2019 · 29cbcbd · 29cbcbd
1 parent 46e98b3
commit 29cbcbd
Showing 1 changed file with 11 additions and 13 deletions.
diff --git a/packages/material-ui/src/Popper/Popper.js b/packages/material-ui/src/Popper/Popper.js
@@ -2,20 +2,17 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import PopperJS from 'popper.js';
 import { chainPropTypes, refType } from '@material-ui/utils';
+import { useTheme } from '@material-ui/styles';
 import Portal from '../Portal';
 import createChainedFunction from '../utils/createChainedFunction';
 import setRef from '../utils/setRef';
 import useForkRef from '../utils/useForkRef';
 import ownerWindow from '../utils/ownerWindow';
 
-/**
- * Flips placement if in <body dir="rtl" />
- * @param {string} placement
- */
-function flipPlacement(placement) {
-  const direction = (typeof document !== 'undefined' && document.body.getAttribute('dir')) || 'ltr';
+function flipPlacement(placement, theme) {
+  const direction = (theme && theme.direction) || 'ltr';
 
-  if (direction !== 'rtl') {
+  if (direction === 'ltr') {
     return placement;
   }
 
@@ -72,7 +69,8 @@ const Popper = React.forwardRef(function Popper(props, ref) {
 
   const [exited, setExited] = React.useState(true);
 
-  const rtlPlacement = flipPlacement(initialPlacement);
+  const theme = useTheme();
+  const rtlPlacement = flipPlacement(initialPlacement, theme);
   /**
    * placement initialized from prop but can change during lifetime if modifiers.flip.
    * modifiers.flip is essentially a flip for controlled/uncontrolled behavior
@@ -126,11 +124,11 @@ const Popper = React.forwardRef(function Popper(props, ref) {
         ...(disablePortal
           ? {}
           : {
-            // It's using scrollParent by default, we can use the viewport when using a portal.
-            preventOverflow: {
-              boundariesElement: 'window',
-            },
-          }),
+              // It's using scrollParent by default, we can use the viewport when using a portal.
+              preventOverflow: {
+                boundariesElement: 'window',
+              },
+            }),
         ...modifiers,
         ...popperOptions.modifiers,
       },