@micromag/editor 0.3.15 → 0.3.18

package/assets/css/styles.css

@@ -3,7 +3,7 @@
 .micromag-editor-forms-screen-container{position:relative;padding:.5rem}.micromag-editor-forms-screen-container .micromag-editor-forms-screen-inner{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}
 .micromag-editor-menus-breadcrumb-container li{overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;white-space:nowrap}.micromag-editor-menus-breadcrumb-container li:before{float:none}.micromag-editor-menus-breadcrumb-container li:last-child{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0}
 .micromag-editor-modals-delete-screen-container .micromag-editor-modals-delete-screen-description{margin-bottom:10px}.micromag-editor-modals-delete-screen-container .micromag-editor-modals-delete-screen-actions{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center}
-.micromag-editor-preview-container .micromag-editor-preview-noStory,.micromag-editor-preview-container .micromag-editor-preview-story{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-editor-preview-container{position:relative}.micromag-editor-preview-container>.micromag-editor-preview-inner{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;height:100%}.micromag-editor-preview-container .micromag-editor-preview-top{display:none;padding:20px 0}.micromag-editor-preview-container .micromag-editor-preview-bottom{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;width:100%;max-width:100%;padding:0;overflow:hidden}.micromag-editor-preview-container .micromag-editor-preview-bottom>.micromag-editor-preview-inner{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:100%;margin:0 auto;overflow:hidden}.micromag-editor-preview-container .micromag-editor-preview-preview{width:100%;-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%}.micromag-editor-preview-container .micromag-editor-preview-preview,.micromag-editor-preview-container .micromag-editor-preview-viewerContainer{position:relative;height:100%}.micromag-editor-preview-screen-medium .micromag-editor-preview-top{display:-webkit-flex;display:-ms-flexbox;display:flex;width:100%;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center}.micromag-editor-preview-screen-medium .micromag-editor-preview-bottom{padding:50px 20px}
+.micromag-editor-preview-container .micromag-editor-preview-noStory,.micromag-editor-preview-container .micromag-editor-preview-story{position:absolute;top:0;left:0;width:100%;height:100%}.micromag-editor-preview-container{position:relative}.micromag-editor-preview-container>.micromag-editor-preview-inner{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;height:100%}.micromag-editor-preview-container .micromag-editor-preview-top{display:none;padding:20px 0}.micromag-editor-preview-container .micromag-editor-preview-bottom{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;width:100%;max-width:100%;padding:0;overflow:hidden}.micromag-editor-preview-container .micromag-editor-preview-bottom>.micromag-editor-preview-inner{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:100%;margin:0 auto;overflow:hidden}.micromag-editor-preview-container .micromag-editor-preview-preview{width:100%;-webkit-transform-origin:50% 50%;-ms-transform-origin:50% 50%;transform-origin:50% 50%}.micromag-editor-preview-container .micromag-editor-preview-preview,.micromag-editor-preview-container .micromag-editor-preview-viewerContainer{position:relative;height:100%}.micromag-editor-preview-container .micromag-editor-preview-devices{position:absolute;right:10px;bottom:10px}.micromag-editor-preview-screen-medium .micromag-editor-preview-top{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:100%}.micromag-editor-preview-screen-medium .micromag-editor-preview-bottom{padding:50px 20px}
 .micromag-editor-menus-devices-container{display:inline-block;position:relative}.micromag-editor-menus-devices-container .micromag-editor-menus-devices-button{display:block;width:40px;height:30px;padding:5px}
 .micromag-editor-buttons-device-container .micromag-editor-buttons-device-icon{display:block;width:100%;height:auto;max-height:100%}
 .micromag-editor-partials-screen-states-button{width:50px;min-height:75px}.micromag-editor-partials-screen-states-button.btn-outline-secondary{border-color:#6c6c6c;color:#6c6c6c}.micromag-editor-partials-screen-states-button.btn-outline-secondary:hover{border-color:#e9e9e9;background:rgba(0,0,0,0);color:#e9e9e9}.micromag-editor-partials-screen-states-addButton{border-style:dashed}.micromag-editor-partials-screen-states-title{font-size:.75em}

package/es/index.js

@@ -839,10 +839,8 @@ var EditForm = function EditForm(_ref) {
     setScreenSettingsOpened(false);
   }, [setScreenSettingsOpened, setDeleteScreenModalOpened]);
   var onSettingsClick = useCallback(function () {
-    setScreenSettingsOpened(function (opened) {
-      return !opened;
-    });
-  }, [setScreenSettingsOpened]);
+    setScreenSettingsOpened(!screenSettingsOpened);
+  }, [screenSettingsOpened, setScreenSettingsOpened]);
   var onDropdownClickOutside = useCallback(function () {
     setScreenSettingsOpened(false);
   }, [setScreenSettingsOpened]);
@@ -999,7 +997,7 @@ var useThemeValue = function useThemeValue(value) {
   return valueWithTheme;
 };
 
-var styles$d = {"container":"micromag-editor-preview-container","noStory":"micromag-editor-preview-noStory","story":"micromag-editor-preview-story","inner":"micromag-editor-preview-inner","top":"micromag-editor-preview-top","bottom":"micromag-editor-preview-bottom","preview":"micromag-editor-preview-preview","viewerContainer":"micromag-editor-preview-viewerContainer","screen-medium":"micromag-editor-preview-screen-medium"};
+var styles$d = {"container":"micromag-editor-preview-container","noStory":"micromag-editor-preview-noStory","story":"micromag-editor-preview-story","inner":"micromag-editor-preview-inner","top":"micromag-editor-preview-top","bottom":"micromag-editor-preview-bottom","preview":"micromag-editor-preview-preview","viewerContainer":"micromag-editor-preview-viewerContainer","devices":"micromag-editor-preview-devices","screen-medium":"micromag-editor-preview-screen-medium"};
 
 var styles$c = {"container":"micromag-editor-menus-devices-container","button":"micromag-editor-menus-devices-button"};
 
@@ -1460,7 +1458,7 @@ var defaultProps$b = {
   className: null,
   onScreenChange: null,
   onChange: null,
-  withoutDevicesSizes: true
+  withoutDevicesSizes: false
 };
 
 var EditorPreview = function EditorPreview(_ref) {
@@ -1576,17 +1574,7 @@ var EditorPreview = function EditorPreview(_ref) {
     }), (_ref9 = {}, _defineProperty(_ref9, className, className), _defineProperty(_ref9, styles$d.withoutDevicesSizes, withoutDevicesSizes), _ref9)])
   }, /*#__PURE__*/React.createElement("div", {
     className: styles$d.inner
-  }, !withoutDevicesSizes ? /*#__PURE__*/React.createElement("div", {
-    className: styles$d.top
-  }, /*#__PURE__*/React.createElement(DevicesMenu, {
-    items: devices.map(function (it) {
-      return _objectSpread(_objectSpread({}, it), {}, {
-        active: it.id === deviceId
-      });
-    }),
-    onClickItem: onClickDeviceItem,
-    className: styles$d.devices
-  })) : null, currentScreenStates !== null && currentScreen !== null ? /*#__PURE__*/React.createElement("div", {
+  }, currentScreenStates !== null && currentScreen !== null ? /*#__PURE__*/React.createElement("div", {
     className: classNames([styles$d.top, 'px-1'])
   }, /*#__PURE__*/React.createElement(ScreenStates, {
     screen: currentScreen,
@@ -1613,7 +1601,17 @@ var EditorPreview = function EditorPreview(_ref) {
     interactions: null,
     renderContext: "edit",
     onScreenChange: onScreenChange
-  })))))));
+  }))))), !withoutDevicesSizes ? /*#__PURE__*/React.createElement("div", {
+    className: styles$d.deviceMenu
+  }, /*#__PURE__*/React.createElement(DevicesMenu, {
+    items: devices.map(function (it) {
+      return _objectSpread(_objectSpread({}, it), {}, {
+        active: it.id === deviceId
+      });
+    }),
+    onClickItem: onClickDeviceItem,
+    className: styles$d.devices
+  })) : null));
 };
 
 EditorPreview.propTypes = propTypes$b;

package/lib/index.js

@@ -859,10 +859,8 @@ var EditForm = function EditForm(_ref) {
     setScreenSettingsOpened(false);
   }, [setScreenSettingsOpened, setDeleteScreenModalOpened]);
   var onSettingsClick = React.useCallback(function () {
-    setScreenSettingsOpened(function (opened) {
-      return !opened;
-    });
-  }, [setScreenSettingsOpened]);
+    setScreenSettingsOpened(!screenSettingsOpened);
+  }, [screenSettingsOpened, setScreenSettingsOpened]);
   var onDropdownClickOutside = React.useCallback(function () {
     setScreenSettingsOpened(false);
   }, [setScreenSettingsOpened]);
@@ -1019,7 +1017,7 @@ var useThemeValue = function useThemeValue(value) {
   return valueWithTheme;
 };
 
-var styles$d = {"container":"micromag-editor-preview-container","noStory":"micromag-editor-preview-noStory","story":"micromag-editor-preview-story","inner":"micromag-editor-preview-inner","top":"micromag-editor-preview-top","bottom":"micromag-editor-preview-bottom","preview":"micromag-editor-preview-preview","viewerContainer":"micromag-editor-preview-viewerContainer","screen-medium":"micromag-editor-preview-screen-medium"};
+var styles$d = {"container":"micromag-editor-preview-container","noStory":"micromag-editor-preview-noStory","story":"micromag-editor-preview-story","inner":"micromag-editor-preview-inner","top":"micromag-editor-preview-top","bottom":"micromag-editor-preview-bottom","preview":"micromag-editor-preview-preview","viewerContainer":"micromag-editor-preview-viewerContainer","devices":"micromag-editor-preview-devices","screen-medium":"micromag-editor-preview-screen-medium"};
 
 var styles$c = {"container":"micromag-editor-menus-devices-container","button":"micromag-editor-menus-devices-button"};
 
@@ -1480,7 +1478,7 @@ var defaultProps$b = {
   className: null,
   onScreenChange: null,
   onChange: null,
-  withoutDevicesSizes: true
+  withoutDevicesSizes: false
 };
 
 var EditorPreview = function EditorPreview(_ref) {
@@ -1596,17 +1594,7 @@ var EditorPreview = function EditorPreview(_ref) {
     }), (_ref9 = {}, _defineProperty__default["default"](_ref9, className, className), _defineProperty__default["default"](_ref9, styles$d.withoutDevicesSizes, withoutDevicesSizes), _ref9)])
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: styles$d.inner
-  }, !withoutDevicesSizes ? /*#__PURE__*/React__default["default"].createElement("div", {
-    className: styles$d.top
-  }, /*#__PURE__*/React__default["default"].createElement(DevicesMenu, {
-    items: devices.map(function (it) {
-      return _objectSpread__default["default"](_objectSpread__default["default"]({}, it), {}, {
-        active: it.id === deviceId
-      });
-    }),
-    onClickItem: onClickDeviceItem,
-    className: styles$d.devices
-  })) : null, currentScreenStates !== null && currentScreen !== null ? /*#__PURE__*/React__default["default"].createElement("div", {
+  }, currentScreenStates !== null && currentScreen !== null ? /*#__PURE__*/React__default["default"].createElement("div", {
     className: classNames__default["default"]([styles$d.top, 'px-1'])
   }, /*#__PURE__*/React__default["default"].createElement(ScreenStates, {
     screen: currentScreen,
@@ -1633,7 +1621,17 @@ var EditorPreview = function EditorPreview(_ref) {
     interactions: null,
     renderContext: "edit",
     onScreenChange: onScreenChange
-  })))))));
+  }))))), !withoutDevicesSizes ? /*#__PURE__*/React__default["default"].createElement("div", {
+    className: styles$d.deviceMenu
+  }, /*#__PURE__*/React__default["default"].createElement(DevicesMenu, {
+    items: devices.map(function (it) {
+      return _objectSpread__default["default"](_objectSpread__default["default"]({}, it), {}, {
+        active: it.id === deviceId
+      });
+    }),
+    onClickItem: onClickDeviceItem,
+    className: styles$d.devices
+  })) : null));
 };
 
 EditorPreview.propTypes = propTypes$b;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/editor",
-    "version": "0.3.15",
+    "version": "0.3.18",
     "description": "",
     "keywords": [
         "javascript"
@@ -62,11 +62,11 @@
         "@fortawesome/fontawesome-svg-core": "^1.2.32",
         "@fortawesome/free-solid-svg-icons": "^5.15.1",
         "@fortawesome/react-fontawesome": "^0.1.13",
-        "@micromag/core": "^0.3.15",
-        "@micromag/elements": "^0.3.15",
-        "@micromag/fields": "^0.3.15",
-        "@micromag/screens": "^0.3.15",
-        "@micromag/viewer": "^0.3.15",
+        "@micromag/core": "^0.3.18",
+        "@micromag/elements": "^0.3.18",
+        "@micromag/fields": "^0.3.18",
+        "@micromag/screens": "^0.3.18",
+        "@micromag/viewer": "^0.3.18",
         "classnames": "^2.2.6",
         "lodash": "^4.17.21",
         "prop-types": "^15.7.2",
@@ -81,5 +81,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "a0d731425a45515bba7628ebc8c546c2f2e0f0d4"
+    "gitHead": "24f426ccd37e27c953634cd1dd3c204264549acc"
 }