Support auto detection of orientation change for safari (#1207)

mui · Jul 27, 2019 · 661544f · 661544f
1 parent 3d2e990
commit 661544f
Showing 1 changed file with 16 additions and 7 deletions.
diff --git a/lib/src/_shared/hooks/useIsLandscape.tsx b/lib/src/_shared/hooks/useIsLandscape.tsx
@@ -2,13 +2,22 @@ import * as React from 'react';
 import { useIsomorphicEffect } from './useKeyDown';
 import { BasePickerProps } from '../../typings/BasePicker';
 
-const getOrientation = () =>
-  typeof window !== 'undefined' &&
-  window.screen &&
-  window.screen.orientation &&
-  Math.abs(window.screen.orientation.angle) === 90
-    ? 'landscape'
-    : 'portrait';
+const getOrientation = () => {
+  if (typeof window === 'undefined') {
+    return 'portrait';
+  }
+
+  if (window.screen && window.screen.orientation && window.screen.orientation.angle) {
+    return Math.abs(window.screen.orientation.angle) === 90 ? 'landscape' : 'portrait';
+  }
+
+  // Support IOS safari
+  if (window.orientation) {
+    return Math.abs(Number(window.orientation)) === 90 ? 'landscape' : 'portrait';
+  }
+
+  return 'portrait';
+};
 
 export function useIsLandscape(customOrientation?: BasePickerProps['orientation']) {
   const [orientation, setOrientation] = React.useState<BasePickerProps['orientation']>(