@configuratorware/configurator-frontendgui 1.34.2 → 1.34.4

package/App/Modules/Designer/Components/DesignerSelectionToolbox/DesignerSelectionToolbox.js

@@ -196,7 +196,8 @@ var DesignerSelectionToolbox = function DesignerSelectionToolbox(props) {
       addCustomFont = props.addCustomFont,
       defaultFont = props.defaultFont,
       loadFonts = props.loadFonts,
-      initialColor = props.initialColor;
+      initialColor = props.initialColor,
+      autoFocusEditor = props.autoFocusEditor;
   var rteRef = (0, _react.useRef)(null);
   var editorRef = (0, _react.useRef)(null);
 
@@ -312,6 +313,13 @@ var DesignerSelectionToolbox = function DesignerSelectionToolbox(props) {
                 if ((0, _Selectors.isPlaceholderContent)(selectedObject.content)) {
                   canvas.selectedObject.content = '';
                 }
+              },
+              onBlur: function onBlur() {
+                var regex = /<\/span>/;
+
+                if (selectedObject.content.search(regex) === -1) {
+                  canvas.selectedObject.remove();
+                }
               }
             };
 
@@ -323,7 +331,7 @@ var DesignerSelectionToolbox = function DesignerSelectionToolbox(props) {
             }
 
             return renderTextEditor(_objectSpread(_objectSpread({}, textToolsRenderObj), {}, {
-              autoFocusWhenMounted: !((0, _Selectors.isPlaceholderContent)(selectedObject.content) || (0, _isMobileDevice["default"])()),
+              autoFocusWhenMounted: autoFocusEditor || !((0, _Selectors.isPlaceholderContent)(selectedObject.content) || (0, _isMobileDevice["default"])()),
               textEditorElementProps: textEditorElementProps,
               onChangeHTML: function onChangeHTML() {
                 // call the original function first with all the args
@@ -404,7 +412,8 @@ DesignerSelectionToolbox.propTypes = {
   calculateTextEditorBackgroundColor: _propTypes["default"].func,
   addCustomFont: _propTypes["default"].func,
   defaultFont: _propTypes["default"].object,
-  initialColor: _propTypes["default"].object
+  initialColor: _propTypes["default"].object,
+  autoFocusEditor: _propTypes["default"].bool
 };
 DesignerSelectionToolbox.defaultProps = {
   TextControlboxComponent: _TextControlbox["default"],
@@ -415,7 +424,8 @@ DesignerSelectionToolbox.defaultProps = {
   classes: {},
   width: '',
   isActiveBulkName: false,
-  isPortraitMode: false
+  isPortraitMode: false,
+  autoFocusEditor: false
 };
 
 var _default = (0, _withWidth["default"])()((0, _withStyles["default"])(styles, {

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@configuratorware/configurator-frontendgui",
-  "version": "1.34.2",
+  "version": "1.34.4",
   "license": "UNLICENSED",
   "private": false,
   "main": "./index.js",
   "dependencies": {
     "@babel/polyfill": "^7.12.1",
-    "@configuratorware/scripts": "1.34.2",
+    "@configuratorware/scripts": "1.34.4",
     "@hot-loader/react-dom": "^17.0.1",
     "@material-ui/core": "^4.12.2",
     "@material-ui/icons": "^4.11.2",
@@ -39,8 +39,8 @@
     "react-router-dom": "^5.2.0",
     "react-swipeable": "^5.5.1",
     "react-zoom-pan-pinch": "^2.1.3",
-    "redhotmagma-graphics-editor": "1.34.2",
-    "redhotmagma-visualization": "1.34.2",
+    "redhotmagma-graphics-editor": "1.34.4",
+    "redhotmagma-visualization": "1.34.4",
     "redux": "^4.1.0",
     "redux-logger": "^3.0.6",
     "redux-persist": "^5.10.0",

package/src/App/Modules/Designer/Components/DesignerSelectionToolbox/DesignerSelectionToolbox.js

@@ -132,6 +132,7 @@ const DesignerSelectionToolbox = props => {
         defaultFont,
         loadFonts,
         initialColor,
+        autoFocusEditor,
     } = props;
 
     const rteRef = useRef(null);
@@ -271,6 +272,12 @@ const DesignerSelectionToolbox = props => {
                                                                 canvas.selectedObject.content = '';
                                                             }
                                                         },
+                                                        onBlur: () => {
+                                                            const regex = /<\/span>/;
+                                                            if (selectedObject.content.search(regex) === -1) {
+                                                                canvas.selectedObject.remove();
+                                                            }
+                                                        },
                                                     };
 
                                                     if (selectedObject.isBulkName) {
@@ -285,10 +292,13 @@ const DesignerSelectionToolbox = props => {
 
                                                     return renderTextEditor({
                                                         ...textToolsRenderObj,
-                                                        autoFocusWhenMounted: !(
-                                                            isPlaceholderContent(selectedObject.content) ||
-                                                            isMobileDevice()
-                                                        ),
+                                                        autoFocusWhenMounted:
+                                                            autoFocusEditor ||
+                                                            !(
+                                                                isPlaceholderContent(
+                                                                    selectedObject.content
+                                                                ) || isMobileDevice()
+                                                            ),
                                                         textEditorElementProps,
                                                         onChangeHTML: (...args) => {
                                                             // call the original function first with all the args
@@ -390,6 +400,7 @@ DesignerSelectionToolbox.propTypes = {
     addCustomFont: PropTypes.func,
     defaultFont: PropTypes.object,
     initialColor: PropTypes.object,
+    autoFocusEditor: PropTypes.bool,
 };
 
 DesignerSelectionToolbox.defaultProps = {
@@ -402,6 +413,7 @@ DesignerSelectionToolbox.defaultProps = {
     width: '',
     isActiveBulkName: false,
     isPortraitMode: false,
+    autoFocusEditor: false,
 };
 
 export default withWidth()(