@configuratorware/configurator-frontendgui 1.29.3 → 1.29.4

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

@@ -149,6 +149,9 @@ var styles = function styles(theme) {
     },
     dialogContentRootWithZoom: {
       overflow: 'hidden'
+    },
+    detailDialogContentRoot: {
+      overflowY: 'auto'
     }
   };
 };
@@ -359,8 +362,7 @@ var Optiondetail = /*#__PURE__*/function (_React$Component) {
           onClose = _this$props5.onClose,
           details = _this$props5.details,
           classes = _this$props5.classes,
-          width = _this$props5.width,
-          isTabletDevice = _this$props5.isTabletDevice;
+          width = _this$props5.width;
       var _this$state = this.state,
           loading = _this$state.loading,
           loadingContainerHeight = _this$state.loadingContainerHeight;
@@ -385,7 +387,7 @@ var Optiondetail = /*#__PURE__*/function (_React$Component) {
         className: classes.detailsTypography
       }, details.description));
 
-      var showFullScreenModal = ['xs', 'sm'].includes(width) && !isTabletDevice;
+      var showFullScreenModal = ['xs', 'sm'].includes(width);
       var maxZoomedWidth = this.getMaxZoomedWidth(width);
       var isLandscapeFormat = false;
 
@@ -415,8 +417,10 @@ var Optiondetail = /*#__PURE__*/function (_React$Component) {
         fullScreen: showFullScreenModal
       }, /*#__PURE__*/_react["default"].createElement(_DialogContent["default"], {
         classes: this.state.hasZoom ? {
-          root: classes.dialogContentRootWithZoom
-        } : null
+          root: (0, _clsx2["default"])(classes.detailDialogContentRoot, classes.dialogContentRootWithZoom)
+        } : {
+          root: classes.detailDialogContentRoot
+        }
       }, loading ? /*#__PURE__*/_react["default"].createElement("div", {
         style: {
           height: loadingContainerHeight,
@@ -479,7 +483,6 @@ _defineProperty(Optiondetail, "propTypes", {
   onClose: _propTypes["default"].func,
   LoadingComponent: _propTypes["default"].elementType,
   width: _propTypes["default"].string,
-  isTabletDevice: _propTypes["default"].bool,
   isLoading: _propTypes["default"].bool
 });
 

package/package.json

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

package/src/App/Modules/Creator/Components/Optiondetail/__snapshots__/index.test.js.snap

@@ -3,7 +3,7 @@
 exports[`Screens/Components/ImageEditDialog/MessageBox renders as a modal screen on larger screens 1`] = `
 <div>
   <div
-    class="MuiDialogContent-root"
+    class="MuiDialogContent-root Optiondetail-detailDialogContentRoot-14"
   >
     <div>
       <div
@@ -60,7 +60,7 @@ exports[`Screens/Components/ImageEditDialog/MessageBox renders as a modal screen
 exports[`Screens/Components/ImageEditDialog/MessageBox renders as full screen on smaller screens 1`] = `
 <div>
   <div
-    class="MuiDialogContent-root"
+    class="MuiDialogContent-root Optiondetail-detailDialogContentRoot-14"
   >
     <div>
       <div
@@ -117,7 +117,7 @@ exports[`Screens/Components/ImageEditDialog/MessageBox renders as full screen on
 exports[`Screens/Components/ImageEditDialog/MessageBox renders with previous and next navigation buttons 1`] = `
 <div>
   <div
-    class="MuiDialogContent-root"
+    class="MuiDialogContent-root Optiondetail-detailDialogContentRoot-14"
   >
     <div>
       <div

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

@@ -96,6 +96,9 @@ const styles = theme => ({
     dialogContentRootWithZoom: {
         overflow: 'hidden',
     },
+    detailDialogContentRoot: {
+        overflowY: 'auto',
+    },
 });
 
 class Optiondetail extends React.Component {
@@ -112,7 +115,6 @@ class Optiondetail extends React.Component {
         onClose: PropTypes.func,
         LoadingComponent: PropTypes.elementType,
         width: PropTypes.string,
-        isTabletDevice: PropTypes.bool,
         isLoading: PropTypes.bool,
     };
 
@@ -261,16 +263,7 @@ class Optiondetail extends React.Component {
     };
 
     render() {
-        const {
-            LoadingComponent,
-            options,
-            show,
-            onClose,
-            details,
-            classes,
-            width,
-            isTabletDevice,
-        } = this.props;
+        const { LoadingComponent, options, show, onClose, details, classes, width } = this.props;
         const { loading, loadingContainerHeight } = this.state;
         const showNav = _.isArray(options) && options.length > 1;
         const detailImage = details.detailImage;
@@ -307,7 +300,7 @@ class Optiondetail extends React.Component {
             </div>
         );
 
-        const showFullScreenModal = ['xs', 'sm'].includes(width) && !isTabletDevice;
+        const showFullScreenModal = ['xs', 'sm'].includes(width);
         let maxZoomedWidth = this.getMaxZoomedWidth(width);
         let isLandscapeFormat = false;
         if (
@@ -341,7 +334,16 @@ class Optiondetail extends React.Component {
                 fullScreen={showFullScreenModal}
             >
                 <DialogContent
-                    classes={this.state.hasZoom ? { root: classes.dialogContentRootWithZoom } : null}
+                    classes={
+                        this.state.hasZoom
+                            ? {
+                                  root: clsx(
+                                      classes.detailDialogContentRoot,
+                                      classes.dialogContentRootWithZoom
+                                  ),
+                              }
+                            : { root: classes.detailDialogContentRoot }
+                    }
                 >
                     {loading ? (
                         <div style={{ height: loadingContainerHeight, boxSizing: 'border-box' }}>