@micromag/core 0.2.412 → 0.3.0

package/lib/contexts.js

@@ -3,16 +3,16 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _objectSpread = require('@babel/runtime/helpers/objectSpread2');
-var React = require('react');
-var PropTypes = require('prop-types');
 var isString = require('lodash/isString');
+var PropTypes = require('prop-types');
+var React = require('react');
 var core = require('@micromag/core');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
 var uniqBy = require('lodash/uniqBy');
 var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
-var isObject = require('lodash/isObject');
 var fetch = require('@folklore/fetch');
+var isObject = require('lodash/isObject');
 var services = require('@folklore/services');
 var utils = require('@micromag/core/utils');
 var reactRouter = require('react-router');
@@ -20,6 +20,7 @@ var reactIntl = require('react-intl');
 var tracking = require('@folklore/tracking');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var uuid = require('uuid');
+var EventEmitter = require('wolfy87-eventemitter');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -42,15 +43,16 @@ function _interopNamespace(e) {
 }
 
 var _objectSpread__default = /*#__PURE__*/_interopDefaultLegacy(_objectSpread);
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var isString__default = /*#__PURE__*/_interopDefaultLegacy(isString);
+var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
 var _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
 var uniqBy__default = /*#__PURE__*/_interopDefaultLegacy(uniqBy);
 var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
 var isObject__default = /*#__PURE__*/_interopDefaultLegacy(isObject);
 var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
+var EventEmitter__default = /*#__PURE__*/_interopDefaultLegacy(EventEmitter);
 
 var MODALS_NAMESPACE = 'modals';
 var FIELDS_NAMESPACE = 'fields';
@@ -355,7 +357,8 @@ var EditorProvider = function EditorProvider(_ref2) {
   }, [parser]);
   var getColors = React.useCallback(function () {
     return parse(story);
-  }, [parse, story]);
+  }, [parse, story]); // eslint-disable-next-line react/jsx-no-constructed-context-values
+
   return /*#__PURE__*/React__default["default"].createElement(EditorContext.Provider, {
     value: {
       getColors: getColors
@@ -410,10 +413,13 @@ var GoogleKeysProvider = function GoogleKeysProvider(_ref) {
   var _useGoogleKeys = useGoogleKeys(),
       previousApiKey = _useGoogleKeys.apiKey;
 
-  return /*#__PURE__*/React__default["default"].createElement(GoogleKeysContext.Provider, {
-    value: {
+  var value = React.useMemo(function () {
+    return {
       apiKey: apiKey || previousApiKey
-    }
+    };
+  }, [apiKey, previousApiKey]);
+  return /*#__PURE__*/React__default["default"].createElement(GoogleKeysContext.Provider, {
+    value: value
   }, children);
 };
 GoogleKeysProvider.propTypes = propTypes$c;
@@ -744,14 +750,17 @@ var ModalsProvider = function ModalsProvider(_ref2) {
       modalsRef.current = newModals;
     }
   }, [modals, setModals]);
-  return /*#__PURE__*/React__default["default"].createElement(ModalsContext.Provider, {
-    value: {
+  var value = React.useMemo(function () {
+    return {
       modals: modals,
       container: container,
       setContainer: setContainer,
       register: register,
       unregister: unregister
-    }
+    };
+  }, [modals, container, setContainer, register, unregister]);
+  return /*#__PURE__*/React__default["default"].createElement(ModalsContext.Provider, {
+    value: value
   }, children);
 };
 ModalsProvider.propTypes = propTypes$8;
@@ -832,14 +841,17 @@ var PanelsProvider = function PanelsProvider(_ref2) {
       panelsRef.current = newPanels;
     }
   }, [panels, setPanels]);
-  return /*#__PURE__*/React__default["default"].createElement(PanelsContext.Provider, {
-    value: {
+  var value = React.useMemo(function () {
+    return {
       panels: panels,
       setContainer: setContainer,
       container: container,
       register: register,
       unregister: unregister
-    }
+    };
+  }, [panels, setContainer, container, register, unregister]);
+  return /*#__PURE__*/React__default["default"].createElement(PanelsContext.Provider, {
+    value: value
   }, children);
 };
 PanelsProvider.propTypes = propTypes$7;
@@ -911,11 +923,14 @@ var RoutesProvider = function RoutesProvider(_ref2) {
   var routes = _ref2.routes,
       basePath = _ref2.basePath,
       children = _ref2.children;
-  return /*#__PURE__*/React__default["default"].createElement(RoutesContext.Provider, {
-    value: {
+  var value = React.useMemo(function () {
+    return {
       routes: routes,
       basePath: basePath
-    }
+    };
+  }, []);
+  return /*#__PURE__*/React__default["default"].createElement(RoutesContext.Provider, {
+    value: value
   }, children);
 };
 RoutesProvider.propTypes = propTypes$6;
@@ -972,48 +987,61 @@ var useScreenRenderContext = function useScreenRenderContext() {
     isCapture: isCapture
   };
 };
+var useScreenState = function useScreenState() {
+  var _ref5 = useScreen() || {},
+      screenState = _ref5.screenState;
+
+  return screenState;
+};
 var propTypes$5 = {
   children: PropTypes__default["default"].node.isRequired,
   data: core.PropTypes.screen,
   definition: core.PropTypes.screenDefinition,
-  renderContext: core.PropTypes.renderContext
+  renderContext: core.PropTypes.renderContext,
+  screenState: PropTypes__default["default"].string
 };
 var defaultProps$5 = {
   data: null,
   definition: null,
-  renderContext: null
-};
-var ScreenProvider = function ScreenProvider(_ref5) {
-  var data = _ref5.data,
-      definition = _ref5.definition,
-      renderContext = _ref5.renderContext,
-      children = _ref5.children;
-
-  var _ref6 = useScreen() || {},
-      _ref6$data = _ref6.data,
-      previousData = _ref6$data === void 0 ? null : _ref6$data,
-      _ref6$definition = _ref6.definition,
-      previousDefinition = _ref6$definition === void 0 ? null : _ref6$definition,
-      _ref6$renderContext = _ref6.renderContext,
-      previousContext = _ref6$renderContext === void 0 ? null : _ref6$renderContext;
+  renderContext: null,
+  screenState: null
+};
+var ScreenProvider = function ScreenProvider(_ref6) {
+  var data = _ref6.data,
+      definition = _ref6.definition,
+      renderContext = _ref6.renderContext,
+      screenState = _ref6.screenState,
+      children = _ref6.children;
+
+  var _ref7 = useScreen() || {},
+      _ref7$data = _ref7.data,
+      previousData = _ref7$data === void 0 ? null : _ref7$data,
+      _ref7$definition = _ref7.definition,
+      previousDefinition = _ref7$definition === void 0 ? null : _ref7$definition,
+      _ref7$renderContext = _ref7.renderContext,
+      previousContext = _ref7$renderContext === void 0 ? null : _ref7$renderContext,
+      _ref7$screenState = _ref7.screenState,
+      previousScreenState = _ref7$screenState === void 0 ? null : _ref7$screenState;
 
   var finalData = data || previousData || null;
 
-  var _ref7 = finalData || {},
-      _ref7$type = _ref7.type,
-      type = _ref7$type === void 0 ? null : _ref7$type;
+  var _ref8 = finalData || {},
+      _ref8$type = _ref8.type,
+      type = _ref8$type === void 0 ? null : _ref8$type;
 
   var screensManager = useScreensManager();
   var contextDefinition = screensManager !== null ? screensManager.getDefinition(type) : null;
   var finalDefinition = definition || contextDefinition || previousDefinition;
   var finalRenderContext = renderContext || previousContext || 'view';
+  var finalScreenState = screenState || previousScreenState || null;
   var value = React.useMemo(function () {
     return {
       data: finalData,
       definition: finalDefinition,
-      renderContext: finalRenderContext
+      renderContext: finalRenderContext,
+      screenState: finalScreenState
     };
-  }, [finalData, finalDefinition, finalRenderContext]);
+  }, [finalData, finalDefinition, finalRenderContext, finalScreenState]);
   return /*#__PURE__*/React__default["default"].createElement(ScreenContext.Provider, {
     value: value
   }, children);
@@ -1191,70 +1219,6 @@ var _excluded$2 = ["default"];
 
 var packagesCache$1 = {};
 var defaultPackagesMap$1 = {
-  transloadit: null,
-  // Disabled for compatibility reasons
-  tus: function tus() {
-    return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('@uppy/tus')); });
-  },
-  xhr: function xhr() {
-    return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('@uppy/xhr-upload')); });
-  }
-};
-
-var useUppyTransport = function useUppyTransport(transport) {
-  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
-      _ref$packagesMap = _ref.packagesMap,
-      packagesMap = _ref$packagesMap === void 0 ? defaultPackagesMap$1 : _ref$packagesMap;
-
-  // transport
-  var _useState = React.useState({
-    "package": packagesCache$1[transport] || null
-  }),
-      _useState2 = _slicedToArray__default["default"](_useState, 2),
-      loadedPackage = _useState2[0]["package"],
-      setLoadedPackage = _useState2[1];
-
-  var packageLoader = packagesMap[transport] || null;
-  React.useEffect(function () {
-    var canceled = false;
-
-    if (loadedPackage !== null || packageLoader === null) {
-      return function () {
-        canceled = true;
-      };
-    }
-
-    packageLoader().then(function (_ref2) {
-      var pack = _ref2["default"],
-          others = _objectWithoutProperties__default["default"](_ref2, _excluded$2);
-
-      var dep = Object.keys(others).reduce(function (map, key) {
-        map[key] = others[key]; // eslint-disable-line no-param-reassign
-
-        return map;
-      }, pack);
-      packagesCache$1[transport] = dep;
-
-      if (!canceled) {
-        setLoadedPackage({
-          "package": dep
-        });
-      }
-    });
-    return function () {
-      canceled = true;
-    };
-  }, [packageLoader, loadedPackage, setLoadedPackage]);
-  return loadedPackage;
-};
-
-var _excluded$1 = ["default"];
-/**
- * Locale loader
- */
-
-var packagesCache = {};
-var defaultPackagesMap = {
   webcam: function webcam() {
     return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('@uppy/webcam')); });
   },
@@ -1275,12 +1239,12 @@ var defaultPackagesMap = {
 var useUppySources = function useUppySources(sources) {
   var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
       _ref$packagesMap = _ref.packagesMap,
-      packagesMap = _ref$packagesMap === void 0 ? defaultPackagesMap : _ref$packagesMap;
+      packagesMap = _ref$packagesMap === void 0 ? defaultPackagesMap$1 : _ref$packagesMap;
 
   // transport
   var _useState = React.useState({
     packages: sources.reduce(function (map, source) {
-      var sourcePackage = packagesCache[source] || null;
+      var sourcePackage = packagesCache$1[source] || null;
 
       if (sourcePackage === null) {
         return map;
@@ -1322,7 +1286,7 @@ var useUppySources = function useUppySources(sources) {
       var newLoadedPackages = sourcesToLoad.reduce(function (map, source, index) {
         var _packagesLoaded$index = packagesLoaded[index],
             pack = _packagesLoaded$index["default"],
-            others = _objectWithoutProperties__default["default"](_packagesLoaded$index, _excluded$1);
+            others = _objectWithoutProperties__default["default"](_packagesLoaded$index, _excluded$2);
 
         return _objectSpread__default["default"](_objectSpread__default["default"]({}, map), {}, _defineProperty__default["default"]({}, source, Object.keys(others).reduce(function (otherMap, key) {
           otherMap[key] = others[key]; // eslint-disable-line no-param-reassign
@@ -1330,7 +1294,7 @@ var useUppySources = function useUppySources(sources) {
           return otherMap;
         }, pack)));
       }, {});
-      packagesCache = _objectSpread__default["default"](_objectSpread__default["default"]({}, packagesCache), newLoadedPackages);
+      packagesCache$1 = _objectSpread__default["default"](_objectSpread__default["default"]({}, packagesCache$1), newLoadedPackages);
 
       if (!canceled) {
         setLoadedPackages({
@@ -1345,6 +1309,70 @@ var useUppySources = function useUppySources(sources) {
   return sourcesToLoad.length === 0 ? loadedPackages : null;
 };
 
+var _excluded$1 = ["default"];
+/**
+ * Locale loader
+ */
+
+var packagesCache = {};
+var defaultPackagesMap = {
+  transloadit: null,
+  // Disabled for compatibility reasons
+  tus: function tus() {
+    return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('@uppy/tus')); });
+  },
+  xhr: function xhr() {
+    return Promise.resolve().then(function () { return /*#__PURE__*/_interopNamespace(require('@uppy/xhr-upload')); });
+  }
+};
+
+var useUppyTransport = function useUppyTransport(transport) {
+  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
+      _ref$packagesMap = _ref.packagesMap,
+      packagesMap = _ref$packagesMap === void 0 ? defaultPackagesMap : _ref$packagesMap;
+
+  // transport
+  var _useState = React.useState({
+    "package": packagesCache[transport] || null
+  }),
+      _useState2 = _slicedToArray__default["default"](_useState, 2),
+      loadedPackage = _useState2[0]["package"],
+      setLoadedPackage = _useState2[1];
+
+  var packageLoader = packagesMap[transport] || null;
+  React.useEffect(function () {
+    var canceled = false;
+
+    if (loadedPackage !== null || packageLoader === null) {
+      return function () {
+        canceled = true;
+      };
+    }
+
+    packageLoader().then(function (_ref2) {
+      var pack = _ref2["default"],
+          others = _objectWithoutProperties__default["default"](_ref2, _excluded$1);
+
+      var dep = Object.keys(others).reduce(function (map, key) {
+        map[key] = others[key]; // eslint-disable-line no-param-reassign
+
+        return map;
+      }, pack);
+      packagesCache[transport] = dep;
+
+      if (!canceled) {
+        setLoadedPackage({
+          "package": dep
+        });
+      }
+    });
+    return function () {
+      canceled = true;
+    };
+  }, [packageLoader, loadedPackage, setLoadedPackage]);
+  return loadedPackage;
+};
+
 var convertToMedia = function convertToMedia(it) {
   // console.log('upload', it);
   var type = it.data.type.split('/')[0];
@@ -1627,8 +1655,8 @@ var UppyProvider = function UppyProvider(_ref5) {
       return newUppy;
     };
   }, [Uppy, uppyLocale, uppyTransport, uppySources, transport, sources, transloadit, companion, tus, xhr]);
-  return /*#__PURE__*/React__default["default"].createElement(UppyContext.Provider, {
-    value: {
+  var value = React.useMemo(function () {
+    return {
       transport: transport,
       locale: locale,
       sources: sources,
@@ -1641,7 +1669,10 @@ var UppyProvider = function UppyProvider(_ref5) {
       uppySources: uppySources,
       uppyLocale: uppyLocale,
       buildUppy: buildUppy
-    }
+    };
+  }, [transport, locale, sources, transloadit, companion, tus, xhr, Uppy, uppyTransport, uppySources, uppyLocale, buildUppy]);
+  return /*#__PURE__*/React__default["default"].createElement(UppyContext.Provider, {
+    value: value
   }, children);
 };
 UppyProvider.propTypes = propTypes$2;
@@ -1689,19 +1720,25 @@ var UserInteractionProvider = function UserInteractionProvider(_ref) {
       document.removeEventListener('pointerup', set);
     };
   }, [userInteracted, setUserInteracted]);
-  return /*#__PURE__*/React__default["default"].createElement(UserInteractionContext.Provider, {
-    value: {
+  var value = React.useMemo(function () {
+    return {
       userInteracted: userInteracted,
       setUserInteracted: setUserInteracted
-    }
+    };
+  }, [userInteracted, setUserInteracted]);
+  return /*#__PURE__*/React__default["default"].createElement(UserInteractionContext.Provider, {
+    value: value
   }, children);
 };
 UserInteractionProvider.propTypes = propTypes$1;
 UserInteractionProvider.defaultProps = defaultProps$1;
 
 var defaultValue = {
+  events: new EventEmitter__default["default"](),
   menuVisible: false,
-  menuSize: 0
+  menuSize: 0,
+  disableInteraction: null,
+  enableInteraction: null
 };
 var ViewerContext = /*#__PURE__*/React__default["default"].createContext(defaultValue);
 var useViewer = function useViewer() {
@@ -1717,30 +1754,55 @@ var useViewerNavigation = function useViewerNavigation() {
     gotoPreviousScreen: gotoPreviousScreen
   };
 };
+var useViewerEvents = function useViewerEvents() {
+  var _useViewer2 = useViewer(),
+      events = _useViewer2.events;
+
+  return events;
+};
+var useViewerInteraction = function useViewerInteraction() {
+  var _useViewer3 = useViewer(),
+      disableInteraction = _useViewer3.disableInteraction,
+      enableInteraction = _useViewer3.enableInteraction;
+
+  return {
+    disableInteraction: disableInteraction,
+    enableInteraction: enableInteraction
+  };
+};
 var propTypes = {
   children: PropTypes__default["default"].node.isRequired,
+  events: PropTypes__default["default"].instanceOf(EventEmitter__default["default"]),
   menuVisible: PropTypes__default["default"].bool,
   menuSize: PropTypes__default["default"].number,
   gotoNextScreen: PropTypes__default["default"].func.isRequired,
-  gotoPreviousScreen: PropTypes__default["default"].func.isRequired
+  gotoPreviousScreen: PropTypes__default["default"].func.isRequired,
+  disableInteraction: PropTypes__default["default"].func,
+  enableInteraction: PropTypes__default["default"].func
 };
 
 var defaultProps = _objectSpread__default["default"]({}, defaultValue);
 
 var ViewerProvider = function ViewerProvider(_ref) {
   var children = _ref.children,
+      events = _ref.events,
       menuVisible = _ref.menuVisible,
       menuSize = _ref.menuSize,
       gotoNextScreen = _ref.gotoNextScreen,
-      gotoPreviousScreen = _ref.gotoPreviousScreen;
+      gotoPreviousScreen = _ref.gotoPreviousScreen,
+      disableInteraction = _ref.disableInteraction,
+      enableInteraction = _ref.enableInteraction;
   var value = React.useMemo(function () {
     return {
+      events: events,
       menuVisible: menuVisible,
       menuSize: menuSize,
       gotoNextScreen: gotoNextScreen,
-      gotoPreviousScreen: gotoPreviousScreen
+      gotoPreviousScreen: gotoPreviousScreen,
+      disableInteraction: disableInteraction,
+      enableInteraction: enableInteraction
     };
-  }, [menuVisible, menuSize, gotoNextScreen, gotoPreviousScreen]);
+  }, [events, menuVisible, menuSize, gotoNextScreen, gotoPreviousScreen, disableInteraction, enableInteraction]);
   return /*#__PURE__*/React__default["default"].createElement(ViewerContext.Provider, {
     value: value
   }, children);
@@ -1830,6 +1892,7 @@ exports.useScreenData = useScreenData;
 exports.useScreenDefinition = useScreenDefinition;
 exports.useScreenRenderContext = useScreenRenderContext;
 exports.useScreenSize = useScreenSize;
+exports.useScreenState = useScreenState;
 exports.useScreensComponents = useScreensComponents;
 exports.useScreensComponentsManager = useScreensComponentsManager;
 exports.useScreensManager = useScreensManager;
@@ -1840,6 +1903,8 @@ exports.useUppy = useUppy;
 exports.useUrlGenerator = useUrlGenerator;
 exports.useUserInteracted = useUserInteracted;
 exports.useViewer = useViewer;
+exports.useViewerEvents = useViewerEvents;
+exports.useViewerInteraction = useViewerInteraction;
 exports.useViewerNavigation = useViewerNavigation;
 exports.withGoogleApiClient = withGoogleApiClient;
 exports.withGoogleMapsClient = withGoogleMapsClient;

package/lib/hooks.js

@@ -1111,33 +1111,32 @@ var useScreenSize = function useScreenSize(_ref) {
       mediaType = _ref$mediaType === void 0 ? 'screen' : _ref$mediaType,
       _ref$media = _ref.media,
       providedMedia = _ref$media === void 0 ? null : _ref$media;
-  // Get media
-  var media = react.useMemo(function () {
-    return providedMedia !== null ? providedMedia : {
+  var screenSize = react.useMemo(function () {
+    var media = providedMedia !== null ? providedMedia : {
       type: mediaType,
       width: "".concat(width, "px"),
       height: "".concat(height, "px")
     };
-  }, [providedMedia, mediaType, width, height]); // Get matching screens
 
-  var matchingScreens = react.useMemo(function () {
-    return _toConsumableArray__default["default"](screens).reverse().filter(function (_ref2) {
+    var matchingScreens = _toConsumableArray__default["default"](screens).reverse().filter(function (_ref2) {
       var _ref2$mediaQuery = _ref2.mediaQuery,
           mediaQuery = _ref2$mediaQuery === void 0 ? null : _ref2$mediaQuery;
       return mediaQuery === null || cssMediaquery.match(mediaQuery, media);
     });
-  }, [screens, media]);
-  return {
-    screen: matchingScreens.length > 0 ? matchingScreens[0].name : null,
-    screens: _toConsumableArray__default["default"](matchingScreens).reverse().map(function (_ref3) {
-      var name = _ref3.name;
-      return name;
-    }),
-    width: width,
-    height: height,
-    landscape: landscape,
-    menuOverScreen: menuOverScreen
-  };
+
+    return {
+      screen: matchingScreens.length > 0 ? matchingScreens[0].name : null,
+      screens: _toConsumableArray__default["default"](matchingScreens).reverse().map(function (_ref3) {
+        var name = _ref3.name;
+        return name;
+      }),
+      width: width,
+      height: height,
+      landscape: landscape,
+      menuOverScreen: menuOverScreen
+    };
+  }, [screens, providedMedia, mediaType, width, height, landscape, menuOverScreen]);
+  return screenSize;
 };
 
 var useScreenSizeFromElement = function useScreenSizeFromElement() {
@@ -1160,28 +1159,31 @@ var useScreenSizeFromElement = function useScreenSizeFromElement() {
 
   var fullWidth = width !== null ? width : calculatedWidth;
   var fullHeight = height !== null ? height : calculatedHeight;
-  var landscape = fullHeight > 0 && fullWidth > fullHeight;
 
   var _ref6 = opts || {},
       _ref6$withoutMaxSize = _ref6.withoutMaxSize,
       withoutMaxSize = _ref6$withoutMaxSize === void 0 ? false : _ref6$withoutMaxSize,
-      _ref6$desktopHeightTh = _ref6.desktopHeightThreshold,
-      desktopHeightThreshold = _ref6$desktopHeightTh === void 0 ? 600 : _ref6$desktopHeightTh,
-      _ref6$desktopHeightRa = _ref6.desktopHeightRatio,
-      desktopHeightRatio = _ref6$desktopHeightRa === void 0 ? 3 / 4 : _ref6$desktopHeightRa,
+      _ref6$landscapeMinHei = _ref6.landscapeMinHeight,
+      landscapeMinHeight = _ref6$landscapeMinHei === void 0 ? 600 : _ref6$landscapeMinHei,
+      _ref6$landscapeHeight = _ref6.landscapeHeightRatio,
+      landscapeHeightRatio = _ref6$landscapeHeight === void 0 ? 3 / 4 : _ref6$landscapeHeight,
       _ref6$screenRatio = _ref6.screenRatio,
-      screenRatio = _ref6$screenRatio === void 0 ? 2 / 3 : _ref6$screenRatio;
+      screenRatio = _ref6$screenRatio === void 0 ? 360 / 480 : _ref6$screenRatio,
+      _ref6$landscapeMinRat = _ref6.landscapeMinRatio,
+      landscapeMinRatio = _ref6$landscapeMinRat === void 0 ? 3 / 4 : _ref6$landscapeMinRat;
 
+  var elementRatio = fullWidth / fullHeight;
+  var landscape = fullHeight > 0 && elementRatio > (landscapeMinRatio || screenRatio);
   var landscapeWithMaxSize = landscape && !withoutMaxSize;
   var finalWidth = fullWidth;
   var finalHeight = fullHeight;
   var menuOverScreen = !landscape;
 
   if (landscapeWithMaxSize) {
-    if (fullHeight < desktopHeightThreshold) {
+    if (fullHeight < landscapeMinHeight) {
       menuOverScreen = true;
     } else {
-      finalHeight = Math.round(fullHeight * desktopHeightRatio);
+      finalHeight = Math.round(fullHeight * landscapeHeightRatio);
     }
 
     finalWidth = Math.round(finalHeight * screenRatio);