@configuratorware/configurator-frontendgui 1.35.8 → 1.36.0

package/App/Modules/Creator/Components/Option/index.js

@@ -309,6 +309,10 @@ var Option = function Option(_ref) {
     }));
   };
 
+  var onAbstractClicked = function onAbstractClicked(event) {
+    event.stopPropagation();
+  };
+
   var onDetailsClicked = function onDetailsClicked(event) {
     event.stopPropagation();
     event.preventDefault();
@@ -450,7 +454,8 @@ var Option = function Option(_ref) {
     }, option.title), hasTextinput && renderTextInput(), !hidePrices && /*#__PURE__*/_react["default"].createElement("div", {
       className: classes.price
     }, option.priceFormatted), smallerScreen && renderControls('horizontal'), option["abstract"] && /*#__PURE__*/_react["default"].createElement(_Markdown["default"], {
-      className: classes.description
+      className: classes.description,
+      onClick: onAbstractClicked
     }, option["abstract"]), renderActions()));
   };
 
@@ -508,6 +513,7 @@ var Option = function Option(_ref) {
       onOptionSelected: onOptionSelected,
       onOptionClicked: onOptionClicked,
       onAmountChanged: onAmountChanged,
+      onAbstractClicked: onAbstractClicked,
       onDetailsClicked: onDetailsClicked,
       onIncompatibilityClicked: onIncompatibilityClicked,
       onOptionGroupClicked: onOptionGroupClicked,

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

@@ -41,6 +41,8 @@ var _i18n = require("../../../../../Framework/i18n");
 
 var _Transformers = require("../../Utils/Transformers");
 
+var _reactRedux = require("react-redux");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -206,6 +208,9 @@ var DesignerSelectionToolbox = function DesignerSelectionToolbox(props) {
       showCustomFontOverlay = _useState2[0],
       toggleCustomFontOverlay = _useState2[1];
 
+  var disableLinebreaks = (0, _reactRedux.useSelector)(function (state) {
+    return (0, _Selectors.isOneLineText)(state);
+  });
   return /*#__PURE__*/_react["default"].createElement("div", {
     className: classes.root
   }, /*#__PURE__*/_react["default"].createElement(_SelectionToolbox["default"], null, function (_ref) {
@@ -331,6 +336,7 @@ var DesignerSelectionToolbox = function DesignerSelectionToolbox(props) {
             }
 
             return renderTextEditor(_objectSpread(_objectSpread({}, textToolsRenderObj), {}, {
+              disableLinebreaks: disableLinebreaks,
               autoFocusWhenMounted: autoFocusEditor || !((0, _Selectors.isPlaceholderContent)(selectedObject.content) || (0, _isMobileDevice["default"])()),
               textEditorElementProps: textEditorElementProps,
               onChangeHTML: function onChangeHTML() {

package/App/Reducers/DesignArea/Selectors.js

@@ -62,6 +62,7 @@ var _exportNames = {
   parseColorData: true,
   getCameraViewListForDesignAreaList: true,
   getDesignViewListForDesignAreas: true,
+  getDesignAreaFromSelectedDesignView: true,
   getDefaultDesignAreaIdentifierFromProductionMethod: true,
   getDefaultColorsFromDesignProductionMethod: true,
   getDefaultTextColor: true,
@@ -76,7 +77,8 @@ var _exportNames = {
   getDesignAreaPreSelection: true,
   getDesignAreaColorAmount: true,
   getVectorizeForDesignProductionMethods: true,
-  getImagesByDesignArea: true
+  getImagesByDesignArea: true,
+  isOneLineText: true
 };
 exports.getDesignProductionMethods = getDesignProductionMethods;
 exports.getDesignDataByDesignAreaIdentifier = getDesignDataByDesignAreaIdentifier;
@@ -122,13 +124,14 @@ exports.getColorsWithPalette = getColorsWithPalette;
 exports.getColorsFromCanvasData = getColorsFromCanvasData;
 exports.getColorsFromCanvasDataWithPalette = getColorsFromCanvasDataWithPalette;
 exports.findSmallestFontSizeInCanvasData = findSmallestFontSizeInCanvasData;
-exports.getImagesByDesignArea = exports.getVectorizeForDesignProductionMethods = exports.getDesignAreaColorAmount = exports.getDesignAreaPreSelection = exports.hasLastEditedDesignArea = exports.areAllDesignAreasEmpty = exports.getVectorizedImageColor = exports.areHashesCompatible = exports.getCurrentCompatibilityInfoHash = exports.getDesignAreaImageCompatibilityInfo = exports.contentHasText = exports.isPlaceholderContent = exports.getDefaultTextColor = exports.getDefaultColorsFromDesignProductionMethod = exports.getDefaultDesignAreaIdentifierFromProductionMethod = exports.getDesignViewListForDesignAreas = exports.getCameraViewListForDesignAreaList = exports.parseColorData = exports.createColorData = exports.rgbObjToHex = exports.rgbString2hex = exports.rgbToHex = exports.calculateColorDistance = exports.hexToRgbNumbers = exports.hexToRgb = exports.isValidHex = exports.getColorPalettes = exports.hasPlaceHolderImagesForActiveDesignArea = exports.getDesignAreaIdentifierToOpen = void 0;
+exports.isOneLineText = isOneLineText;
+exports.getImagesByDesignArea = exports.getVectorizeForDesignProductionMethods = exports.getDesignAreaColorAmount = exports.getDesignAreaPreSelection = exports.hasLastEditedDesignArea = exports.areAllDesignAreasEmpty = exports.getVectorizedImageColor = exports.areHashesCompatible = exports.getCurrentCompatibilityInfoHash = exports.getDesignAreaImageCompatibilityInfo = exports.contentHasText = exports.isPlaceholderContent = exports.getDefaultTextColor = exports.getDefaultColorsFromDesignProductionMethod = exports.getDefaultDesignAreaIdentifierFromProductionMethod = exports.getDesignAreaFromSelectedDesignView = exports.getDesignViewListForDesignAreas = exports.getCameraViewListForDesignAreaList = exports.parseColorData = exports.createColorData = exports.rgbObjToHex = exports.rgbString2hex = exports.rgbToHex = exports.calculateColorDistance = exports.hexToRgbNumbers = exports.hexToRgb = exports.isValidHex = exports.getColorPalettes = exports.hasPlaceHolderImagesForActiveDesignArea = exports.getDesignAreaIdentifierToOpen = void 0;
 
 var _get = _interopRequireDefault(require("lodash/get"));
 
 var _first = _interopRequireDefault(require("lodash/first"));
 
-var _find = _interopRequireDefault(require("lodash/find"));
+var _find2 = _interopRequireDefault(require("lodash/find"));
 
 var _findKey = _interopRequireDefault(require("lodash/findKey"));
 
@@ -348,8 +351,9 @@ var getDesignAreaIdentifierToOpen = function getDesignAreaIdentifierToOpen(state
   var identifier = state.designArea.selectedDesignArea.identifier;
   var previousEditedDesignAreaIdentifier = getPreviousEditedDesignAreaIdentifier(state);
   var firstEditedDesignAreafromDesignData = getFirstEditedDesignAreafromDesignData(state);
+  var designAreaFromSelectedDesignView = getDesignAreaFromSelectedDesignView(state);
   var defaultDesignAreaFromProductionMethod = getDefaultDesignAreaIdentifierFromProductionMethod(state);
-  return identifier || previousEditedDesignAreaIdentifier || firstEditedDesignAreafromDesignData || defaultDesignAreaFromProductionMethod || null;
+  return identifier || previousEditedDesignAreaIdentifier || firstEditedDesignAreafromDesignData || designAreaFromSelectedDesignView || defaultDesignAreaFromProductionMethod || null;
 };
 
 exports.getDesignAreaIdentifierToOpen = getDesignAreaIdentifierToOpen;
@@ -386,7 +390,7 @@ function getSelectedDesignProductionMethod(state) {
   var designProductionMethods = getDesignProductionMethods(state);
   var designAreaData = getDesignDataForSelectedDesignArea(state);
   var designProductionMethodIdentifier = designAreaData.designProductionMethodIdentifier;
-  return (0, _find["default"])(designProductionMethods, {
+  return (0, _find2["default"])(designProductionMethods, {
     identifier: designProductionMethodIdentifier
   }) || (0, _first["default"])(designProductionMethods);
 }
@@ -487,14 +491,14 @@ function getSelectedDesignProductionMethodForDesignArea(state, designArea) {
   var _ref8 = designAreaData || {},
       designProductionMethodIdentifier = _ref8.designProductionMethodIdentifier;
 
-  return (0, _find["default"])(designProductionMethods, {
+  return (0, _find2["default"])(designProductionMethods, {
     identifier: designProductionMethodIdentifier
   }) || (0, _first["default"])(designProductionMethods);
 }
 
 function getDesignProductionMethodByIdentifier(state, identifier) {
   var designProductionMethods = getDesignProductionMethods(state);
-  return (0, _find["default"])(designProductionMethods, {
+  return (0, _find2["default"])(designProductionMethods, {
     identifier: identifier
   });
 }
@@ -678,7 +682,7 @@ function getEngravingBackgroundColor(state, designProductionMethod) {
   var _designProductionMethod = designProductionMethod || getSelectedDesignProductionMethod(state) || {};
 
   var engravingBackgroundColors = _designProductionMethod.engravingBackgroundColors;
-  return (0, _get["default"])((0, _find["default"])(engravingBackgroundColors, {
+  return (0, _get["default"])((0, _find2["default"])(engravingBackgroundColors, {
     itemIdentifier: variantIdentifier || (0, _Selectors.getSelectedVariantIdentifier)((0, _Selectors.getConfigurator)(state))
   }), 'colorHex', 'rgba(0, 0, 0, 0.5)');
 }
@@ -1027,6 +1031,16 @@ var getDesignViewListForDesignAreas = function getDesignViewListForDesignAreas(s
 
 exports.getDesignViewListForDesignAreas = getDesignViewListForDesignAreas;
 
+var getDesignAreaFromSelectedDesignView = function getDesignAreaFromSelectedDesignView(state) {
+  var _find;
+
+  var filteredDesignAreas = state.designArea.filteredDesignAreas,
+      selectedDesignView = state.designView.selectedDesignView;
+  return (_find = (0, _find2["default"])(filteredDesignAreas, ['designView.identifier', selectedDesignView.identifier])) === null || _find === void 0 ? void 0 : _find.identifier;
+};
+
+exports.getDesignAreaFromSelectedDesignView = getDesignAreaFromSelectedDesignView;
+
 var getDefaultDesignAreaIdentifierFromProductionMethod = function getDefaultDesignAreaIdentifierFromProductionMethod(state) {
   //return the first designArea with isDefault: true due to api call accepts multiple productionmethods to be default
   var filteredDesignAreas = state.designArea.filteredDesignAreas;
@@ -1083,12 +1097,12 @@ var getDefaultTextColor = function getDefaultTextColor(state) {
   var variantIdentifier = (0, _Selectors.getSelectedVariantIdentifier)((0, _Selectors.getConfigurator)(state));
 
   if (defaultColors && defaultColors[variantIdentifier]) {
-    var colorPalette = (0, _find["default"])(colorPalettes, {
+    var colorPalette = (0, _find2["default"])(colorPalettes, {
       identifier: Object.keys(defaultColors[variantIdentifier])[0]
     });
 
     if (colorPalette) {
-      var color = (0, _find["default"])(colorPalette.colors, {
+      var color = (0, _find2["default"])(colorPalette.colors, {
         identifier: defaultColors[variantIdentifier][colorPalette.identifier]
       });
 
@@ -1104,7 +1118,7 @@ var getDefaultTextColor = function getDefaultTextColor(state) {
   }
 
   var paletteDefaultColorIdentifier = (0, _get["default"])(colorPalettes[0], 'defaultColor.identifier', '');
-  var paletteDefaultColor = (0, _find["default"])(colorPalettes[0].colors, {
+  var paletteDefaultColor = (0, _find2["default"])(colorPalettes[0].colors, {
     identifier: paletteDefaultColorIdentifier
   });
 
@@ -1254,7 +1268,7 @@ var getDesignAreaPreSelection = function getDesignAreaPreSelection(identifier) {
     return {};
   }
 
-  var preSelection = (0, _find["default"])(designerPreSelection.designAreas, {
+  var preSelection = (0, _find2["default"])(designerPreSelection.designAreas, {
     identifier: identifier
   });
   return preSelection ? preSelection : {};
@@ -1301,4 +1315,8 @@ var getImagesByDesignArea = function getImagesByDesignArea(state, designAreaIden
   });
 };
 
-exports.getImagesByDesignArea = getImagesByDesignArea;
+exports.getImagesByDesignArea = getImagesByDesignArea;
+
+function isOneLineText(state) {
+  return (0, _get["default"])(getSelectedDesignProductionMethod(state), 'oneLineText', false);
+}

package/App/Shared/Components/SendEmail/index.js

@@ -83,6 +83,7 @@ var SendEmail = function SendEmail(props) {
     },
     id: "alert-dialog-description"
   }, (0, _i18n.t)('sendEmailDialog.info'))), /*#__PURE__*/_react["default"].createElement(_DialogActions["default"], null, /*#__PURE__*/_react["default"].createElement(_MainButton["default"], {
+    target: "_blank",
     href: emailUrl,
     onClick: onClose,
     variant: "contained",

package/package.json

@@ -1,12 +1,12 @@
 {
   "name": "@configuratorware/configurator-frontendgui",
-  "version": "1.35.8",
+  "version": "1.36.0",
   "license": "UNLICENSED",
   "private": false,
   "main": "./index.js",
   "dependencies": {
     "@babel/polyfill": "^7.12.1",
-    "@configuratorware/scripts": "1.35.8",
+    "@configuratorware/scripts": "1.36.0",
     "@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.35.8",
-    "redhotmagma-visualization": "1.35.8",
+    "redhotmagma-graphics-editor": "1.36.0",
+    "redhotmagma-visualization": "1.36.0",
     "redux": "^4.1.0",
     "redux-logger": "^3.0.6",
     "redux-persist": "^5.10.0",

package/src/App/Modules/Creator/Components/Option/index.js

@@ -253,6 +253,10 @@ const Option = ({ children, render, ...props }) => {
         });
     };
 
+    const onAbstractClicked = event => {
+        event.stopPropagation();
+    };
+
     const onDetailsClicked = event => {
         event.stopPropagation();
         event.preventDefault();
@@ -409,7 +413,9 @@ const Option = ({ children, render, ...props }) => {
                     {!hidePrices && <div className={classes.price}>{option.priceFormatted}</div>}
                     {smallerScreen && renderControls('horizontal')}
                     {option.abstract && (
-                        <Markdown className={classes.description}>{option.abstract}</Markdown>
+                        <Markdown className={classes.description} onClick={onAbstractClicked}>
+                            {option.abstract}
+                        </Markdown>
                     )}
 
                     {renderActions()}
@@ -481,6 +487,7 @@ const Option = ({ children, render, ...props }) => {
         onOptionSelected,
         onOptionClicked,
         onAmountChanged,
+        onAbstractClicked,
         onDetailsClicked,
         onIncompatibilityClicked,
         onOptionGroupClicked,

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

@@ -10,11 +10,12 @@ import TextControlbox from '../TextControlbox';
 import ImageControlbox from '../ImageControlbox';
 import { CustomFontOverlay } from './CustomFontOverlay';
 import { createFontItemProps, findCurrentFontItem } from './fontItemUtils';
-import { isPlaceholderContent } from 'App/Reducers/DesignArea/Selectors';
+import { isPlaceholderContent, isOneLineText } from 'App/Reducers/DesignArea/Selectors';
 import isMobileDevice from 'Framework/Helpers/isMobileDevice';
 import { hasBackgroundColor } from 'App/Reducers/DesignData/Selectors';
 import { t } from 'Framework/i18n';
 import { isOriginalVector } from '../../Utils/Transformers';
+import { useSelector } from 'react-redux';
 
 const styles = theme => ({
     root: {
@@ -138,6 +139,7 @@ const DesignerSelectionToolbox = props => {
     const rteRef = useRef(null);
     const editorRef = useRef(null);
     const [showCustomFontOverlay, toggleCustomFontOverlay] = useState(false);
+    const disableLinebreaks = useSelector(state => isOneLineText(state));
 
     return (
         <div className={classes.root}>
@@ -292,6 +294,7 @@ const DesignerSelectionToolbox = props => {
 
                                                     return renderTextEditor({
                                                         ...textToolsRenderObj,
+                                                        disableLinebreaks,
                                                         autoFocusWhenMounted:
                                                             autoFocusEditor ||
                                                             !(

package/src/App/Reducers/DesignArea/Selectors.js

@@ -125,11 +125,14 @@ export const getDesignAreaIdentifierToOpen = state => {
     } = state;
     const previousEditedDesignAreaIdentifier = getPreviousEditedDesignAreaIdentifier(state);
     const firstEditedDesignAreafromDesignData = getFirstEditedDesignAreafromDesignData(state);
+    const designAreaFromSelectedDesignView = getDesignAreaFromSelectedDesignView(state);
     const defaultDesignAreaFromProductionMethod = getDefaultDesignAreaIdentifierFromProductionMethod(state);
+
     return (
         identifier ||
         previousEditedDesignAreaIdentifier ||
         firstEditedDesignAreafromDesignData ||
+        designAreaFromSelectedDesignView ||
         defaultDesignAreaFromProductionMethod ||
         null
     );
@@ -672,6 +675,14 @@ export const getDesignViewListForDesignAreas = (state, designAreas) => {
     return designViewList;
 };
 
+export const getDesignAreaFromSelectedDesignView = state => {
+    const {
+        designArea: { filteredDesignAreas },
+        designView: { selectedDesignView },
+    } = state;
+    return find(filteredDesignAreas, ['designView.identifier', selectedDesignView.identifier])?.identifier;
+};
+
 export const getDefaultDesignAreaIdentifierFromProductionMethod = state => {
     //return the first designArea with isDefault: true due to api call accepts multiple productionmethods to be default
     const {
@@ -905,3 +916,7 @@ export const getImagesByDesignArea = (state, designAreaIdentifier) => {
     const designData = getDesignDataByDesignAreaIdentifier(state, designAreaIdentifier);
     return get(designData, 'canvasData.objects', []).filter(({ type }) => type === 'Image');
 };
+
+export function isOneLineText(state) {
+    return get(getSelectedDesignProductionMethod(state), 'oneLineText', false);
+}

package/src/App/Reducers/DesignArea/__tests__/Selectors.test.js

@@ -262,6 +262,11 @@ describe('Reducers/DesignArea/Selectors', () => {
                 selectedDesignArea: { identifier: 'a_2' },
                 previousEditedDesignArea: {},
             },
+            designView: {
+                selectedDesignView: {
+                    identifier: '01_side',
+                },
+            },
             configurator: {
                 configuration: {
                     designdata: {

package/src/App/Services/__tests__/DesignDataService.test.js

@@ -600,6 +600,9 @@ describe('Services/DesignDataService', () => {
                         selectedDesignArea: {},
                         previousEditedDesignArea: {},
                     },
+                    designView: {
+                        selectedDesignView: {},
+                    },
                 };
                 dispatch = jest.fn();
             })();
@@ -624,6 +627,75 @@ describe('Services/DesignDataService', () => {
             expect(srv.selectFirstDesignArea).toHaveBeenCalled();
         }
     );
+    test(
+        '[INTEGRATION] openDesignAreaEditor calls the ui.show action to show the designer, and calls the ' +
+            'designArea from designView because a designView is selected',
+        () => {
+            const mockStoreSrv = new (class StoreService {
+                static serviceName = 'StoreService';
+                state = {
+                    configurator: {
+                        configuration: {
+                            designData: {},
+                        },
+                    },
+                    designArea: {
+                        selectedDesignArea: {},
+                        previousEditedDesignArea: {},
+                        filteredDesignAreas: [
+                            {
+                                identifier: 'back',
+                                designView: {
+                                    identifier: '03_back',
+                                },
+                                designProductionMethods: [],
+                            },
+                            {
+                                identifier: 'front',
+                                designView: {
+                                    identifier: '02_front',
+                                },
+                                designProductionMethods: [],
+                            },
+                            {
+                                identifier: 'side',
+                                designView: {
+                                    identifier: '01_side',
+                                },
+                                designProductionMethods: [],
+                            },
+                        ],
+                    },
+                    designView: {
+                        selectedDesignView: {
+                            identifier: '01_side',
+                        },
+                    },
+                };
+                dispatch = jest.fn();
+            })();
+            ServiceLocator.provide(mockStoreSrv);
+            const mockUISrv = new (class UIService {
+                static serviceName = 'UIService';
+                show = jest.fn();
+            })();
+            ServiceLocator.provide(mockUISrv);
+            const mockVisualizationSrv = new (class VisualizationService {
+                static serviceName = 'VisualizationService';
+                enableUserMovement = jest.fn();
+                disableUserMovement = jest.fn();
+                freeUserMovement = jest.fn();
+                getActiveDesignArea = jest.fn();
+            })();
+            ServiceLocator.provide(mockVisualizationSrv);
+
+            const srv = new DesignDataService();
+            srv.selectDesignArea = jest.fn();
+            srv.openDesignAreaEditor();
+            expect(mockUISrv.show).toHaveBeenCalledWith('designer');
+            expect(srv.selectDesignArea).toHaveBeenCalledWith('side');
+        }
+    );
     test(
         '[INTEGRATION] openDesignAreaEditor calls the ui.show action to show the designer, and calls the ' +
             'designArea from designData with objects to open',
@@ -659,6 +731,9 @@ describe('Services/DesignDataService', () => {
                         selectedDesignArea: {},
                         previousEditedDesignArea: {},
                     },
+                    designView: {
+                        selectedDesignView: {},
+                    },
                 };
                 dispatch = jest.fn();
             })();
@@ -701,6 +776,9 @@ describe('Services/DesignDataService', () => {
                             identifier: 'area-51',
                         },
                     },
+                    designView: {
+                        selectedDesignView: {},
+                    },
                 };
                 dispatch = jest.fn();
             })();
@@ -739,6 +817,9 @@ describe('Services/DesignDataService', () => {
                         },
                         previousEditedDesignArea: {},
                     },
+                    designView: {
+                        selectedDesignView: {},
+                    },
                     configurator: {
                         configuration: {
                             designdata: {

package/src/App/Shared/Components/SendEmail/index.js

@@ -70,6 +70,7 @@ const SendEmail = props => {
             </DialogContent>
             <DialogActions>
                 <MainButton
+                    target="_blank"
                     href={emailUrl}
                     onClick={onClose}
                     variant="contained"