@micromag/editor 0.3.68 → 0.3.71

package/es/index.js

@@ -309,7 +309,7 @@ var FieldWithContexts = function FieldWithContexts(_ref) {
       props = _objectWithoutProperties(_ref, _excluded$8);
 
   // Get definitions
-  var definition = useScreenDefinition();
+  var definition = useScreenDefinition() || null;
   var _definition$states = definition.states,
       states = _definition$states === void 0 ? null : _definition$states;
   var screenFields = getScreenFieldsWithStates(definition); // const [stateId = null] = name.split('.');
@@ -358,7 +358,8 @@ var FieldWithContexts = function FieldWithContexts(_ref) {
   //           }]
   // : fields;
 
-  return /*#__PURE__*/React.createElement("div", {
+  console.log('def', definition);
+  return definition !== null ? /*#__PURE__*/React.createElement("div", {
     className: classNames({
       'p-2': form === null
     })
@@ -369,7 +370,7 @@ var FieldWithContexts = function FieldWithContexts(_ref) {
     form: form
   }, props)) : /*#__PURE__*/React.createElement(Fields, Object.assign({
     fields: stateFields
-  }, props)));
+  }, props))) : null;
 };
 
 FieldWithContexts.propTypes = propTypes$n;
@@ -421,13 +422,13 @@ var ScreenForm = function ScreenForm(_ref) {
     className: classNames([styles$g.container, _defineProperty({}, className, className)])
   }, /*#__PURE__*/React.createElement("div", {
     className: styles$g.inner
-  }, /*#__PURE__*/React.createElement(Fields, {
+  }, fields !== null ? /*#__PURE__*/React.createElement(Fields, {
     fields: fields,
     value: value,
     onChange: onChange,
     gotoFieldForm: gotoFieldForm,
     closeFieldForm: closeFieldForm
-  })));
+  }) : null));
 };
 
 ScreenForm.propTypes = propTypes$m;
@@ -480,9 +481,13 @@ var Breadcrumb = function Breadcrumb(_ref) {
 
     var type = screens[screenIndex].type;
     var definition = screensManager.getDefinition(type);
-    var states = definition.states;
+
+    var _ref3 = definition || {},
+        _ref3$states = _ref3.states,
+        states = _ref3$states === void 0 ? null : _ref3$states;
+
     return {
-      fields: [].concat(_toConsumableArray(getScreenFieldsWithStates(definition)), [getScreenExtraField(intl)]),
+      fields: definition !== null ? [].concat(_toConsumableArray(getScreenFieldsWithStates(definition)), [getScreenExtraField(intl)]) : null,
       states: states
     };
   }, [screens, screenId, screensManager, intl]),
@@ -502,18 +507,18 @@ var Breadcrumb = function Breadcrumb(_ref) {
           _fieldPath$ = _fieldPath[0],
           stateId = _fieldPath$ === void 0 ? null : _fieldPath$;
 
-      currentState = screenStates !== null ? screenStates.find(function (_ref3) {
-        var id = _ref3.id;
+      currentState = screenStates !== null ? screenStates.find(function (_ref4) {
+        var id = _ref4.id;
         return id === stateId;
       }) || null : null;
       var finalFieldPath = fieldPath;
 
       if (currentState !== null) {
-        var _ref4 = currentState || {},
-            _ref4$repeatable = _ref4.repeatable,
-            repeatable = _ref4$repeatable === void 0 ? false : _ref4$repeatable,
-            _ref4$fieldName = _ref4.fieldName,
-            fieldName = _ref4$fieldName === void 0 ? null : _ref4$fieldName;
+        var _ref5 = currentState || {},
+            _ref5$repeatable = _ref5.repeatable,
+            repeatable = _ref5$repeatable === void 0 ? false : _ref5$repeatable,
+            _ref5$fieldName = _ref5.fieldName,
+            fieldName = _ref5$fieldName === void 0 ? null : _ref5$fieldName;
 
         finalFieldPath = (repeatable || fieldName !== null) && fieldPath.length <= (repeatable ? 2 : 1) ? [fieldName || stateId].concat(_toConsumableArray(fieldPath.slice(1))) : fieldPath.slice(1);
       }
@@ -576,9 +581,9 @@ var Breadcrumb = function Breadcrumb(_ref) {
         var fieldLabel = nextFields ? nextFields.breadcrumbLabel || nextFields.label : null;
         var itemLabel = isMessage(fieldLabel) ? intl.formatMessage(fieldLabel) : fieldLabel;
 
-        var _ref5 = parentItem || {},
-            _ref5$label = _ref5.label,
-            parentItemLabel = _ref5$label === void 0 ? null : _ref5$label;
+        var _ref6 = parentItem || {},
+            _ref6$label = _ref6.label,
+            parentItemLabel = _ref6$label === void 0 ? null : _ref6$label;
 
         var finalItemLabel = isListItems ? "".concat(itemLabel, " #").concat(parseInt(key, 10) + 1) : itemLabel || parentItemLabel;
         var item = {
@@ -1508,8 +1513,7 @@ var EditorPreview = function EditorPreview(_ref) {
       _useScreenSize$screen2 = _useScreenSize.screens,
       screens = _useScreenSize$screen2 === void 0 ? [] : _useScreenSize$screen2;
 
-  var valueWithTheme = useThemeValue(value, isTheme); // console.log(valueWithTheme);
-  // const valueParsed = valueWithTheme;
+  var valueWithTheme = useThemeValue(value, isTheme); // const valueParsed = valueWithTheme;
 
   var valueParsed = useParsedStory(valueWithTheme, {
     withTheme: isTheme,
@@ -2902,7 +2906,10 @@ var ScreenTypes = function ScreenTypes(_ref) {
       onClickItem = _ref.onClickItem;
   var intl = useIntl();
   var screensManager = useScreensManager();
-  var finalDefinitions = screens || screensManager.getDefinitions();
+  var screenDefinitions = screens || screensManager.getDefinitions();
+  var finalDefinitions = (screenDefinitions || []).filter(function (s) {
+    return s !== null;
+  });
   var groups = useMemo(function () {
     var groupItems = finalDefinitions.reduce(function (allGroups, definition) {
       var id = definition.id,
@@ -3158,7 +3165,6 @@ var EditorScreens = function EditorScreens(_ref) {
     }, true);
 
     if (!sameOrder || hasScreenProps) {
-      // console.log('order', ids); // eslint-disable-line
       var newValue = _objectSpread(_objectSpread({}, value), {}, {
         components: _toConsumableArray(currentScreens).sort(function (_ref13, _ref14) {
           var idA = _ref13.id;
@@ -3212,8 +3218,7 @@ var EditorScreens = function EditorScreens(_ref) {
   }, [setCreateModalOpened]);
   var onCreateModalRequestClose = useCallback(function () {
     return setCreateModalOpened(false);
-  }, [setCreateModalOpened]); // console.log(screens);
-
+  }, [setCreateModalOpened]);
   return /*#__PURE__*/React.createElement("div", {
     className: classNames(['d-flex', 'flex-column', styles$7.container, className])
   }, /*#__PURE__*/React.createElement(Navbar, {
@@ -3322,7 +3327,6 @@ var Editor = function Editor(_ref) {
       onChange = _ref.onChange,
       fullscreen = _ref.fullscreen,
       className = _ref.className;
-  // console.log('value', value);
   var push = useRoutePush();
   var refScreensContainer = useRef(null);
 
@@ -3421,8 +3425,7 @@ var Editor = function Editor(_ref) {
       var cnt = item.parentNode.parentNode.parentNode;
       screens.scrollTop = cnt.offsetTop + item.offsetTop + item.offsetHeight / 2 - screens.clientHeight / 2;
     }
-  }, [screenId]); // console.log('editor level value', value);
-
+  }, [screenId]);
   return /*#__PURE__*/React.createElement(ModalsProvider, null, /*#__PURE__*/React.createElement(PanelsProvider, null, /*#__PURE__*/React.createElement(ScreenSizeProvider, {
     size: screenSize
   }, /*#__PURE__*/React.createElement("div", {

package/lib/index.js

@@ -329,7 +329,7 @@ var FieldWithContexts = function FieldWithContexts(_ref) {
       props = _objectWithoutProperties__default["default"](_ref, _excluded$8);
 
   // Get definitions
-  var definition = contexts.useScreenDefinition();
+  var definition = contexts.useScreenDefinition() || null;
   var _definition$states = definition.states,
       states = _definition$states === void 0 ? null : _definition$states;
   var screenFields = getScreenFieldsWithStates(definition); // const [stateId = null] = name.split('.');
@@ -378,7 +378,8 @@ var FieldWithContexts = function FieldWithContexts(_ref) {
   //           }]
   // : fields;
 
-  return /*#__PURE__*/React__default["default"].createElement("div", {
+  console.log('def', definition);
+  return definition !== null ? /*#__PURE__*/React__default["default"].createElement("div", {
     className: classNames__default["default"]({
       'p-2': form === null
     })
@@ -389,7 +390,7 @@ var FieldWithContexts = function FieldWithContexts(_ref) {
     form: form
   }, props)) : /*#__PURE__*/React__default["default"].createElement(fields.Fields, Object.assign({
     fields: stateFields
-  }, props)));
+  }, props))) : null;
 };
 
 FieldWithContexts.propTypes = propTypes$n;
@@ -441,13 +442,13 @@ var ScreenForm = function ScreenForm(_ref) {
     className: classNames__default["default"]([styles$g.container, _defineProperty__default["default"]({}, className, className)])
   }, /*#__PURE__*/React__default["default"].createElement("div", {
     className: styles$g.inner
-  }, /*#__PURE__*/React__default["default"].createElement(fields.Fields, {
+  }, fields$1 !== null ? /*#__PURE__*/React__default["default"].createElement(fields.Fields, {
     fields: fields$1,
     value: value,
     onChange: onChange,
     gotoFieldForm: gotoFieldForm,
     closeFieldForm: closeFieldForm
-  })));
+  }) : null));
 };
 
 ScreenForm.propTypes = propTypes$m;
@@ -500,9 +501,13 @@ var Breadcrumb = function Breadcrumb(_ref) {
 
     var type = screens[screenIndex].type;
     var definition = screensManager.getDefinition(type);
-    var states = definition.states;
+
+    var _ref3 = definition || {},
+        _ref3$states = _ref3.states,
+        states = _ref3$states === void 0 ? null : _ref3$states;
+
     return {
-      fields: [].concat(_toConsumableArray__default["default"](getScreenFieldsWithStates(definition)), [utils.getScreenExtraField(intl)]),
+      fields: definition !== null ? [].concat(_toConsumableArray__default["default"](getScreenFieldsWithStates(definition)), [utils.getScreenExtraField(intl)]) : null,
       states: states
     };
   }, [screens, screenId, screensManager, intl]),
@@ -522,18 +527,18 @@ var Breadcrumb = function Breadcrumb(_ref) {
           _fieldPath$ = _fieldPath[0],
           stateId = _fieldPath$ === void 0 ? null : _fieldPath$;
 
-      currentState = screenStates !== null ? screenStates.find(function (_ref3) {
-        var id = _ref3.id;
+      currentState = screenStates !== null ? screenStates.find(function (_ref4) {
+        var id = _ref4.id;
         return id === stateId;
       }) || null : null;
       var finalFieldPath = fieldPath;
 
       if (currentState !== null) {
-        var _ref4 = currentState || {},
-            _ref4$repeatable = _ref4.repeatable,
-            repeatable = _ref4$repeatable === void 0 ? false : _ref4$repeatable,
-            _ref4$fieldName = _ref4.fieldName,
-            fieldName = _ref4$fieldName === void 0 ? null : _ref4$fieldName;
+        var _ref5 = currentState || {},
+            _ref5$repeatable = _ref5.repeatable,
+            repeatable = _ref5$repeatable === void 0 ? false : _ref5$repeatable,
+            _ref5$fieldName = _ref5.fieldName,
+            fieldName = _ref5$fieldName === void 0 ? null : _ref5$fieldName;
 
         finalFieldPath = (repeatable || fieldName !== null) && fieldPath.length <= (repeatable ? 2 : 1) ? [fieldName || stateId].concat(_toConsumableArray__default["default"](fieldPath.slice(1))) : fieldPath.slice(1);
       }
@@ -596,9 +601,9 @@ var Breadcrumb = function Breadcrumb(_ref) {
         var fieldLabel = nextFields ? nextFields.breadcrumbLabel || nextFields.label : null;
         var itemLabel = utils.isMessage(fieldLabel) ? intl.formatMessage(fieldLabel) : fieldLabel;
 
-        var _ref5 = parentItem || {},
-            _ref5$label = _ref5.label,
-            parentItemLabel = _ref5$label === void 0 ? null : _ref5$label;
+        var _ref6 = parentItem || {},
+            _ref6$label = _ref6.label,
+            parentItemLabel = _ref6$label === void 0 ? null : _ref6$label;
 
         var finalItemLabel = isListItems ? "".concat(itemLabel, " #").concat(parseInt(key, 10) + 1) : itemLabel || parentItemLabel;
         var item = {
@@ -1528,8 +1533,7 @@ var EditorPreview = function EditorPreview(_ref) {
       _useScreenSize$screen2 = _useScreenSize.screens,
       screens = _useScreenSize$screen2 === void 0 ? [] : _useScreenSize$screen2;
 
-  var valueWithTheme = useThemeValue(value, isTheme); // console.log(valueWithTheme);
-  // const valueParsed = valueWithTheme;
+  var valueWithTheme = useThemeValue(value, isTheme); // const valueParsed = valueWithTheme;
 
   var valueParsed = hooks.useParsedStory(valueWithTheme, {
     withTheme: isTheme,
@@ -2922,7 +2926,10 @@ var ScreenTypes = function ScreenTypes(_ref) {
       onClickItem = _ref.onClickItem;
   var intl = reactIntl.useIntl();
   var screensManager = contexts.useScreensManager();
-  var finalDefinitions = screens || screensManager.getDefinitions();
+  var screenDefinitions = screens || screensManager.getDefinitions();
+  var finalDefinitions = (screenDefinitions || []).filter(function (s) {
+    return s !== null;
+  });
   var groups = React.useMemo(function () {
     var groupItems = finalDefinitions.reduce(function (allGroups, definition) {
       var id = definition.id,
@@ -3178,7 +3185,6 @@ var EditorScreens = function EditorScreens(_ref) {
     }, true);
 
     if (!sameOrder || hasScreenProps) {
-      // console.log('order', ids); // eslint-disable-line
       var newValue = _objectSpread__default["default"](_objectSpread__default["default"]({}, value), {}, {
         components: _toConsumableArray__default["default"](currentScreens).sort(function (_ref13, _ref14) {
           var idA = _ref13.id;
@@ -3232,8 +3238,7 @@ var EditorScreens = function EditorScreens(_ref) {
   }, [setCreateModalOpened]);
   var onCreateModalRequestClose = React.useCallback(function () {
     return setCreateModalOpened(false);
-  }, [setCreateModalOpened]); // console.log(screens);
-
+  }, [setCreateModalOpened]);
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: classNames__default["default"](['d-flex', 'flex-column', styles$7.container, className])
   }, /*#__PURE__*/React__default["default"].createElement(components.Navbar, {
@@ -3342,7 +3347,6 @@ var Editor = function Editor(_ref) {
       onChange = _ref.onChange,
       fullscreen = _ref.fullscreen,
       className = _ref.className;
-  // console.log('value', value);
   var push = contexts.useRoutePush();
   var refScreensContainer = React.useRef(null);
 
@@ -3441,8 +3445,7 @@ var Editor = function Editor(_ref) {
       var cnt = item.parentNode.parentNode.parentNode;
       screens.scrollTop = cnt.offsetTop + item.offsetTop + item.offsetHeight / 2 - screens.clientHeight / 2;
     }
-  }, [screenId]); // console.log('editor level value', value);
-
+  }, [screenId]);
   return /*#__PURE__*/React__default["default"].createElement(contexts.ModalsProvider, null, /*#__PURE__*/React__default["default"].createElement(contexts.PanelsProvider, null, /*#__PURE__*/React__default["default"].createElement(contexts.ScreenSizeProvider, {
     size: screenSize
   }, /*#__PURE__*/React__default["default"].createElement("div", {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@micromag/editor",
-    "version": "0.3.68",
+    "version": "0.3.71",
     "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.68",
-        "@micromag/elements": "^0.3.68",
-        "@micromag/fields": "^0.3.68",
-        "@micromag/screens": "^0.3.68",
-        "@micromag/viewer": "^0.3.68",
+        "@micromag/core": "^0.3.71",
+        "@micromag/elements": "^0.3.71",
+        "@micromag/fields": "^0.3.71",
+        "@micromag/screens": "^0.3.71",
+        "@micromag/viewer": "^0.3.71",
         "classnames": "^2.2.6",
         "lodash": "^4.17.21",
         "prop-types": "^15.7.2",
@@ -81,5 +81,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "3f6e61d8a3340735f345a20d1f0f86e91c820d9a"
+    "gitHead": "50093d0adc731dfb58656015179c4ac0b1c6765f"
 }