@micromag/core 0.2.412 → 0.3.0

package/es/contexts.js

@@ -1,14 +1,14 @@
 import _objectSpread from '@babel/runtime/helpers/objectSpread2';
-import React, { useContext, useMemo, useState, useEffect, useCallback, useRef } from 'react';
-import PropTypes from 'prop-types';
 import isString from 'lodash/isString';
+import PropTypes from 'prop-types';
+import React, { useContext, useMemo, useState, useEffect, useCallback, useRef } from 'react';
 import { ComponentsManager, PropTypes as PropTypes$1, FieldsManager, ScreensManager, ColorsParser, Tracking } from '@micromag/core';
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import uniqBy from 'lodash/uniqBy';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import isObject from 'lodash/isObject';
 import { getJSON } from '@folklore/fetch';
+import isObject from 'lodash/isObject';
 import { loadGoogleApi, loadGoogleMaps } from '@folklore/services';
 import { getDisplayName, getScreenExtraField } from '@micromag/core/utils';
 import { generatePath, useHistory } from 'react-router';
@@ -17,6 +17,7 @@ import { TrackingContext, TrackingContainer } from '@folklore/tracking';
 export { TrackingContext } from '@folklore/tracking';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import { v1 } from 'uuid';
+import EventEmitter from 'wolfy87-eventemitter';
 
 var MODALS_NAMESPACE = 'modals';
 var FIELDS_NAMESPACE = 'fields';
@@ -321,7 +322,8 @@ var EditorProvider = function EditorProvider(_ref2) {
   }, [parser]);
   var getColors = useCallback(function () {
     return parse(story);
-  }, [parse, story]);
+  }, [parse, story]); // eslint-disable-next-line react/jsx-no-constructed-context-values
+
   return /*#__PURE__*/React.createElement(EditorContext.Provider, {
     value: {
       getColors: getColors
@@ -376,10 +378,13 @@ var GoogleKeysProvider = function GoogleKeysProvider(_ref) {
   var _useGoogleKeys = useGoogleKeys(),
       previousApiKey = _useGoogleKeys.apiKey;
 
-  return /*#__PURE__*/React.createElement(GoogleKeysContext.Provider, {
-    value: {
+  var value = useMemo(function () {
+    return {
       apiKey: apiKey || previousApiKey
-    }
+    };
+  }, [apiKey, previousApiKey]);
+  return /*#__PURE__*/React.createElement(GoogleKeysContext.Provider, {
+    value: value
   }, children);
 };
 GoogleKeysProvider.propTypes = propTypes$c;
@@ -710,14 +715,17 @@ var ModalsProvider = function ModalsProvider(_ref2) {
       modalsRef.current = newModals;
     }
   }, [modals, setModals]);
-  return /*#__PURE__*/React.createElement(ModalsContext.Provider, {
-    value: {
+  var value = useMemo(function () {
+    return {
       modals: modals,
       container: container,
       setContainer: setContainer,
       register: register,
       unregister: unregister
-    }
+    };
+  }, [modals, container, setContainer, register, unregister]);
+  return /*#__PURE__*/React.createElement(ModalsContext.Provider, {
+    value: value
   }, children);
 };
 ModalsProvider.propTypes = propTypes$8;
@@ -798,14 +806,17 @@ var PanelsProvider = function PanelsProvider(_ref2) {
       panelsRef.current = newPanels;
     }
   }, [panels, setPanels]);
-  return /*#__PURE__*/React.createElement(PanelsContext.Provider, {
-    value: {
+  var value = useMemo(function () {
+    return {
       panels: panels,
       setContainer: setContainer,
       container: container,
       register: register,
       unregister: unregister
-    }
+    };
+  }, [panels, setContainer, container, register, unregister]);
+  return /*#__PURE__*/React.createElement(PanelsContext.Provider, {
+    value: value
   }, children);
 };
 PanelsProvider.propTypes = propTypes$7;
@@ -877,11 +888,14 @@ var RoutesProvider = function RoutesProvider(_ref2) {
   var routes = _ref2.routes,
       basePath = _ref2.basePath,
       children = _ref2.children;
-  return /*#__PURE__*/React.createElement(RoutesContext.Provider, {
-    value: {
+  var value = useMemo(function () {
+    return {
       routes: routes,
       basePath: basePath
-    }
+    };
+  }, []);
+  return /*#__PURE__*/React.createElement(RoutesContext.Provider, {
+    value: value
   }, children);
 };
 RoutesProvider.propTypes = propTypes$6;
@@ -938,48 +952,61 @@ var useScreenRenderContext = function useScreenRenderContext() {
     isCapture: isCapture
   };
 };
+var useScreenState = function useScreenState() {
+  var _ref5 = useScreen() || {},
+      screenState = _ref5.screenState;
+
+  return screenState;
+};
 var propTypes$5 = {
   children: PropTypes.node.isRequired,
   data: PropTypes$1.screen,
   definition: PropTypes$1.screenDefinition,
-  renderContext: PropTypes$1.renderContext
+  renderContext: PropTypes$1.renderContext,
+  screenState: PropTypes.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 = useMemo(function () {
     return {
       data: finalData,
       definition: finalDefinition,
-      renderContext: finalRenderContext
+      renderContext: finalRenderContext,
+      screenState: finalScreenState
     };
-  }, [finalData, finalDefinition, finalRenderContext]);
+  }, [finalData, finalDefinition, finalRenderContext, finalScreenState]);
   return /*#__PURE__*/React.createElement(ScreenContext.Provider, {
     value: value
   }, children);
@@ -1157,70 +1184,6 @@ var _excluded$2 = ["default"];
 
 var packagesCache$1 = {};
 var defaultPackagesMap$1 = {
-  transloadit: null,
-  // Disabled for compatibility reasons
-  tus: function tus() {
-    return import('@uppy/tus');
-  },
-  xhr: function xhr() {
-    return import('@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 = useState({
-    "package": packagesCache$1[transport] || null
-  }),
-      _useState2 = _slicedToArray(_useState, 2),
-      loadedPackage = _useState2[0]["package"],
-      setLoadedPackage = _useState2[1];
-
-  var packageLoader = packagesMap[transport] || null;
-  useEffect(function () {
-    var canceled = false;
-
-    if (loadedPackage !== null || packageLoader === null) {
-      return function () {
-        canceled = true;
-      };
-    }
-
-    packageLoader().then(function (_ref2) {
-      var pack = _ref2["default"],
-          others = _objectWithoutProperties(_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 import('@uppy/webcam');
   },
@@ -1241,12 +1204,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 = useState({
     packages: sources.reduce(function (map, source) {
-      var sourcePackage = packagesCache[source] || null;
+      var sourcePackage = packagesCache$1[source] || null;
 
       if (sourcePackage === null) {
         return map;
@@ -1288,7 +1251,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(_packagesLoaded$index, _excluded$1);
+            others = _objectWithoutProperties(_packagesLoaded$index, _excluded$2);
 
         return _objectSpread(_objectSpread({}, map), {}, _defineProperty({}, source, Object.keys(others).reduce(function (otherMap, key) {
           otherMap[key] = others[key]; // eslint-disable-line no-param-reassign
@@ -1296,7 +1259,7 @@ var useUppySources = function useUppySources(sources) {
           return otherMap;
         }, pack)));
       }, {});
-      packagesCache = _objectSpread(_objectSpread({}, packagesCache), newLoadedPackages);
+      packagesCache$1 = _objectSpread(_objectSpread({}, packagesCache$1), newLoadedPackages);
 
       if (!canceled) {
         setLoadedPackages({
@@ -1311,6 +1274,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 import('@uppy/tus');
+  },
+  xhr: function xhr() {
+    return import('@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 = useState({
+    "package": packagesCache[transport] || null
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      loadedPackage = _useState2[0]["package"],
+      setLoadedPackage = _useState2[1];
+
+  var packageLoader = packagesMap[transport] || null;
+  useEffect(function () {
+    var canceled = false;
+
+    if (loadedPackage !== null || packageLoader === null) {
+      return function () {
+        canceled = true;
+      };
+    }
+
+    packageLoader().then(function (_ref2) {
+      var pack = _ref2["default"],
+          others = _objectWithoutProperties(_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];
@@ -1593,8 +1620,8 @@ var UppyProvider = function UppyProvider(_ref5) {
       return newUppy;
     };
   }, [Uppy, uppyLocale, uppyTransport, uppySources, transport, sources, transloadit, companion, tus, xhr]);
-  return /*#__PURE__*/React.createElement(UppyContext.Provider, {
-    value: {
+  var value = useMemo(function () {
+    return {
       transport: transport,
       locale: locale,
       sources: sources,
@@ -1607,7 +1634,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.createElement(UppyContext.Provider, {
+    value: value
   }, children);
 };
 UppyProvider.propTypes = propTypes$2;
@@ -1655,19 +1685,25 @@ var UserInteractionProvider = function UserInteractionProvider(_ref) {
       document.removeEventListener('pointerup', set);
     };
   }, [userInteracted, setUserInteracted]);
-  return /*#__PURE__*/React.createElement(UserInteractionContext.Provider, {
-    value: {
+  var value = useMemo(function () {
+    return {
       userInteracted: userInteracted,
       setUserInteracted: setUserInteracted
-    }
+    };
+  }, [userInteracted, setUserInteracted]);
+  return /*#__PURE__*/React.createElement(UserInteractionContext.Provider, {
+    value: value
   }, children);
 };
 UserInteractionProvider.propTypes = propTypes$1;
 UserInteractionProvider.defaultProps = defaultProps$1;
 
 var defaultValue = {
+  events: new EventEmitter(),
   menuVisible: false,
-  menuSize: 0
+  menuSize: 0,
+  disableInteraction: null,
+  enableInteraction: null
 };
 var ViewerContext = /*#__PURE__*/React.createContext(defaultValue);
 var useViewer = function useViewer() {
@@ -1683,30 +1719,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.node.isRequired,
+  events: PropTypes.instanceOf(EventEmitter),
   menuVisible: PropTypes.bool,
   menuSize: PropTypes.number,
   gotoNextScreen: PropTypes.func.isRequired,
-  gotoPreviousScreen: PropTypes.func.isRequired
+  gotoPreviousScreen: PropTypes.func.isRequired,
+  disableInteraction: PropTypes.func,
+  enableInteraction: PropTypes.func
 };
 
 var defaultProps = _objectSpread({}, 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 = 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.createElement(ViewerContext.Provider, {
     value: value
   }, children);
@@ -1714,4 +1775,4 @@ var ViewerProvider = function ViewerProvider(_ref) {
 ViewerProvider.propTypes = propTypes;
 ViewerProvider.defaultProps = defaultProps;
 
-export { ComponentsContext, ComponentsProvider, ELEMENTS_NAMESPACE, EditorContext, EditorProvider, FIELDS_NAMESPACE, FORMS_NAMESPACE, FieldContext, FieldContextProvider, FieldsContext, FieldsProvider, FontsContext, FontsProvider, GoogleApiClientContext, GoogleApiClientProvider, GoogleKeysContext, GoogleKeysProvider, GoogleMapsClientContext, GoogleMapsClientProvider, MODALS_NAMESPACE, ModalsContext, ModalsProvider, PanelsContext, PanelsProvider, RoutesContext, RoutesProvider, SCREENS_NAMESPACE, ScreenContext, ScreenProvider, ScreenSizeContext, ScreenSizeProvider, ScreensContext, ScreensProvider, StoryContext, StoryProvider, TrackingProvider, UppyContext, UppyProvider, UserInteractionContext, UserInteractionProvider, ViewerContext, ViewerProvider, useComponent, useComponents, useComponentsManager, useEditor, useElementComponent, useElementsComponents, useElementsComponentsManager, useFieldComponent, useFieldContext, useFieldDefinition, useFieldsComponents, useFieldsComponentsManager, useFieldsManager, useFonts, useFormComponent, useFormsComponents, useFormsComponentsManager, useGetColors, useGoogleApiClient, useGoogleFonts, useGoogleKeys, useGoogleMapsClient, useModalComponent, useModals, useModalsComponents, useModalsComponentsManager, usePanels, useRouteBack, useRoutePush, useRoutes, useScreen, useScreenComponent, useScreenData, useScreenDefinition, useScreenRenderContext, useScreenSize, useScreensComponents, useScreensComponentsManager, useScreensManager, useStory, useStoryContext, useTracking, useUppy, useUrlGenerator, useUserInteracted, useViewer, useViewerNavigation, withGoogleApiClient, withGoogleMapsClient, withModals, withPanels };
+export { ComponentsContext, ComponentsProvider, ELEMENTS_NAMESPACE, EditorContext, EditorProvider, FIELDS_NAMESPACE, FORMS_NAMESPACE, FieldContext, FieldContextProvider, FieldsContext, FieldsProvider, FontsContext, FontsProvider, GoogleApiClientContext, GoogleApiClientProvider, GoogleKeysContext, GoogleKeysProvider, GoogleMapsClientContext, GoogleMapsClientProvider, MODALS_NAMESPACE, ModalsContext, ModalsProvider, PanelsContext, PanelsProvider, RoutesContext, RoutesProvider, SCREENS_NAMESPACE, ScreenContext, ScreenProvider, ScreenSizeContext, ScreenSizeProvider, ScreensContext, ScreensProvider, StoryContext, StoryProvider, TrackingProvider, UppyContext, UppyProvider, UserInteractionContext, UserInteractionProvider, ViewerContext, ViewerProvider, useComponent, useComponents, useComponentsManager, useEditor, useElementComponent, useElementsComponents, useElementsComponentsManager, useFieldComponent, useFieldContext, useFieldDefinition, useFieldsComponents, useFieldsComponentsManager, useFieldsManager, useFonts, useFormComponent, useFormsComponents, useFormsComponentsManager, useGetColors, useGoogleApiClient, useGoogleFonts, useGoogleKeys, useGoogleMapsClient, useModalComponent, useModals, useModalsComponents, useModalsComponentsManager, usePanels, useRouteBack, useRoutePush, useRoutes, useScreen, useScreenComponent, useScreenData, useScreenDefinition, useScreenRenderContext, useScreenSize, useScreenState, useScreensComponents, useScreensComponentsManager, useScreensManager, useStory, useStoryContext, useTracking, useUppy, useUrlGenerator, useUserInteracted, useViewer, useViewerEvents, useViewerInteraction, useViewerNavigation, withGoogleApiClient, withGoogleMapsClient, withModals, withPanels };

package/es/hooks.js

@@ -1075,33 +1075,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 = useMemo(function () {
-    return providedMedia !== null ? providedMedia : {
+  var screenSize = 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 = useMemo(function () {
-    return _toConsumableArray(screens).reverse().filter(function (_ref2) {
+    var matchingScreens = _toConsumableArray(screens).reverse().filter(function (_ref2) {
       var _ref2$mediaQuery = _ref2.mediaQuery,
           mediaQuery = _ref2$mediaQuery === void 0 ? null : _ref2$mediaQuery;
       return mediaQuery === null || match(mediaQuery, media);
     });
-  }, [screens, media]);
-  return {
-    screen: matchingScreens.length > 0 ? matchingScreens[0].name : null,
-    screens: _toConsumableArray(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(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() {
@@ -1124,28 +1123,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);

package/es/index.js

@@ -63,6 +63,10 @@ var target = PropTypes$1.oneOf(['_blank', '_self', '_parent']);
 var interaction = PropTypes$1.oneOf(['tap', 'swipe']);
 var interactions = PropTypes$1.arrayOf(interaction);
 var trackingVariables = PropTypes$1.objectOf(PropTypes$1.oneOfType([PropTypes$1.string, PropTypes$1.number, PropTypes$1.array]));
+var progress = PropTypes$1.shape({
+  currentTime: PropTypes$1.number,
+  duration: PropTypes$1.number
+});
 /**
  * Site
  */
@@ -110,7 +114,7 @@ var bootstrapThemes = PropTypes$1.oneOf(bootstrapThemeStrings);
 var buttonTheme = PropTypes$1.oneOf([].concat(bootstrapThemeStrings, ['outline-primary', 'outline-secondary', 'outline-success', 'outline-danger', 'outline-warning', 'outline-info', 'outline-light', 'outline-dark', 'outline-link', null]));
 var buttonSize = PropTypes$1.oneOf(['lg', 'sm', null]);
 var formControlSize = PropTypes$1.oneOf(['lg', 'sm', null]);
-var dropdownAlign = PropTypes$1.oneOf(['left', 'right']);
+var dropdownAlign = PropTypes$1.oneOf(['start', 'end']);
 var componentNames = function componentNames(Components) {
   return PropTypes$1.oneOf(Object.keys(Components).map(function (it) {
     return snakeCase(it);
@@ -232,7 +236,7 @@ var borderStyle = PropTypes$1.shape({
   radius: PropTypes$1.number,
   color: color
 });
-var buttonStyle = PropTypes$1.shape({
+var boxStyle = PropTypes$1.shape({
   backgroundColor: color,
   borderRadius: PropTypes$1.number,
   borderWidth: PropTypes$1.number,
@@ -467,7 +471,8 @@ var screenSize = PropTypes$1.shape({
   screen: PropTypes$1.string,
   screens: PropTypes$1.arrayOf(PropTypes$1.string),
   width: PropTypes$1.number,
-  height: PropTypes$1.number
+  height: PropTypes$1.number,
+  landscape: PropTypes$1.number
 });
 var renderContext = PropTypes$1.oneOf(['view', 'placeholder', 'edit', 'preview', 'static', 'capture']);
 /**
@@ -574,6 +579,7 @@ var PropTypes = /*#__PURE__*/Object.freeze({
     interaction: interaction,
     interactions: interactions,
     trackingVariables: trackingVariables,
+    progress: progress,
     user: user,
     menuItem: menuItem,
     menuItems: menuItems,
@@ -621,7 +627,7 @@ var PropTypes = /*#__PURE__*/Object.freeze({
     textStyle: textStyle,
     borderTypes: borderTypes,
     borderStyle: borderStyle,
-    buttonStyle: buttonStyle,
+    boxStyle: boxStyle,
     margin: margin,
     gridLayout: gridLayout,
     objectFitSize: objectFitSize,
@@ -844,7 +850,7 @@ var ColorsParser = /*#__PURE__*/function () {
           colors: color !== null ? [].concat(_toConsumableArray(currentColors || []), _toConsumableArray(subColors || []), [color]) : [].concat(_toConsumableArray(currentColors || []), _toConsumableArray(subColors || []))
         };
       }, {
-        data: null,
+        data: keys.length === 0 ? data : null,
         colors: colors
       });
     }
@@ -1329,7 +1335,8 @@ var MediasParser = /*#__PURE__*/function () {
       var medias = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
       var keyPrefix = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
       var dataIsArray = isArray(data);
-      return MediasParser.keys(data).reduce(function (_ref9, key) {
+      var dataKeys = MediasParser.keys(data);
+      return dataKeys.reduce(function (_ref9, key) {
         var currentData = _ref9.data,
             currentMedias = _ref9.medias;
         var path = [keyPrefix, key].filter(function (it) {
@@ -1360,7 +1367,7 @@ var MediasParser = /*#__PURE__*/function () {
           medias: media !== null ? _objectSpread(_objectSpread(_objectSpread({}, currentMedias), subMedias), {}, _defineProperty({}, newValue, media)) : _objectSpread(_objectSpread({}, currentMedias), subMedias)
         };
       }, {
-        data: null,
+        data: dataKeys.length === 0 ? data : null,
         medias: medias
       });
     }