@configuratorware/configurator-frontendgui 1.28.0-beta.3 → 1.28.3

package/App/Modules/Designer/Designer.js

@@ -1,231 +0,0 @@
-"use strict";
-
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.Designer = void 0;
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _withStyles = _interopRequireDefault(require("@material-ui/core/styles/withStyles"));
-
-var _Editor = _interopRequireDefault(require("redhotmagma-graphics-editor/lib//Components/Editor/Editor"));
-
-var _EditorContainer = _interopRequireDefault(require("redhotmagma-graphics-editor/lib//Components/Editor/EditorContainer"));
-
-var _AlignTargetProvider = require("redhotmagma-visualization/lib//AlignTargetProvider");
-
-var _createCheckerBoardBackground = require("../../../Utils/Styles/createCheckerBoardBackground");
-
-var _excluded = ["children"];
-
-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); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-var mockUploadFunction = function mockUploadFunction(files) {
-  return new Promise(function (resolve, reject) {
-    var reader = new FileReader();
-
-    reader.onload = function () {
-      var dataURL = reader.result;
-      resolve([{
-        src: dataURL
-      }]);
-    };
-
-    reader.onerror = reject;
-    reader.readAsDataURL(files[0]);
-  });
-};
-
-var styles = function styles(theme) {
-  var _root;
-
-  return {
-    root: (_root = {
-      flexShrink: 1,
-      flexBasis: '100%',
-      display: 'flex',
-      flexDirection: 'column',
-      maxWidth: '100%',
-      alignItems: 'center'
-    }, _defineProperty(_root, theme.breakpoints.down('xs'), {
-      minHeight: '150px'
-    }), _defineProperty(_root, '&:before', {
-      content: "''",
-      display: 'block',
-      marginTop: 'auto'
-    }), _defineProperty(_root, '&:after', {
-      content: "''",
-      display: 'block',
-      marginBottom: 'auto'
-    }), _defineProperty(_root, '& > :not(.resize-sensor)', {
-      /**
-       * The pointer events are passed through in the "main" class of DefaultLayout,
-       * but the contained elements may need it (like the Designer and its controls)
-       * @see DefaultLayout
-       */
-      pointerEvents: 'all'
-    }), _root),
-    checkerBoardBackground: _objectSpread({}, (0, _createCheckerBoardBackground.createCheckerBoardBackground)({
-      darkColor: 'rgba(0, 0, 0, 0.1)',
-      lightColor: 'rgba(0, 0, 0, 0.01)'
-    }))
-  };
-};
-
-var CustomEditorContainer = (0, _withStyles["default"])({
-  closeButton: {
-    position: 'absolute',
-    top: -20,
-    right: -20,
-    cursor: 'pointer'
-  }
-}, {
-  name: 'CustomEditorContainer'
-})(function (_ref) {
-  var children = _ref.children,
-      props = _objectWithoutProperties(_ref, _excluded);
-
-  return /*#__PURE__*/_react["default"].createElement(_EditorContainer["default"], props, children);
-});
-
-var getCustomEditorStyle = function getCustomEditorStyle(_ref2) {
-  var hasBorder = _ref2.hasBorder;
-  var style = {};
-
-  if (!hasBorder) {
-    style.borderWidth = 0;
-  }
-
-  return style;
-};
-
-var Designer = function Designer(_ref3) {
-  var renderStandardToolbox = _ref3.renderStandardToolbox,
-      renderSelectionToolbox = _ref3.renderSelectionToolbox,
-      renderInlineToolbox = _ref3.renderInlineToolbox,
-      renderRulers = _ref3.renderRulers,
-      canvasSize = _ref3.canvasSize,
-      classes = _ref3.classes,
-      show = _ref3.show,
-      selectedColor = _ref3.selectedColor,
-      alignTarget = _ref3.alignTarget,
-      EditorContainer = _ref3.EditorContainer,
-      hideDesigner = _ref3.hideDesigner,
-      hasBorder = _ref3.hasBorder,
-      useCheckerBoardBackground = _ref3.useCheckerBoardBackground,
-      renderInCanvasContainer = _ref3.renderInCanvasContainer;
-  var containerReadyHandler = (0, _react.useMemo)(function () {
-    return function (_ref4) {
-      var container = _ref4.container;
-      alignTarget.add(container); // it has to be delayed in the next message, when the correct size is already available
-
-      return function () {
-        return setTimeout(function () {
-          return alignTarget.remove(container);
-        });
-      };
-    };
-  }, [alignTarget]);
-  var containerUpdateHandler = (0, _react.useMemo)(function () {
-    return function () {
-      // re-add it on update to trigger the change which updates the offset
-      setTimeout(function () {
-        alignTarget.add(null);
-        alignTarget.remove(null);
-      });
-    };
-  }, [alignTarget]);
-  var EditorContainerWithInjectedProps = (0, _react.useMemo)(function () {
-    return function (props) {
-      return /*#__PURE__*/_react["default"].createElement(EditorContainer, _extends({}, props, {
-        onClickClose: hideDesigner
-      }));
-    };
-  }, [hideDesigner]);
-  return show && /*#__PURE__*/_react["default"].createElement("div", {
-    className: classes.root
-  }, /*#__PURE__*/_react["default"].createElement(_Editor["default"], {
-    style: getCustomEditorStyle({
-      hasBorder: hasBorder
-    }),
-    containerClassName: useCheckerBoardBackground && classes.checkerBoardBackground,
-    canvasSize: canvasSize,
-    upload: mockUploadFunction,
-    renderStandardToolbox: renderStandardToolbox,
-    renderSelectionToolbox: renderSelectionToolbox,
-    renderInlineToolbox: renderInlineToolbox,
-    renderRulers: renderRulers,
-    subtractSiblingsHeight: true,
-    allowUpScaling: true,
-    selectedColor: selectedColor,
-    onContainerReady: containerReadyHandler,
-    onContainerUpdate: containerUpdateHandler,
-    EditorContainer: EditorContainerWithInjectedProps,
-    renderInCanvasContainer: renderInCanvasContainer
-  }));
-};
-
-exports.Designer = Designer;
-Designer.propTypes = {
-  renderStandardToolbox: _propTypes["default"].func,
-  renderSelectionToolbox: _propTypes["default"].func,
-  renderInlineToolbox: _propTypes["default"].func,
-  renderRulers: _propTypes["default"].func,
-  show: _propTypes["default"].bool,
-  EditorContainer: _propTypes["default"].elementType,
-  hasBorder: _propTypes["default"].bool,
-  selectedColor: _propTypes["default"].string,
-  hideDesigner: _propTypes["default"].func,
-  alignTarget: _propTypes["default"].shape({
-    add: _propTypes["default"].func.isRequired,
-    remove: _propTypes["default"].func.isRequired
-  }).isRequired,
-  classes: _propTypes["default"].object.isRequired,
-  canvasSize: _propTypes["default"].shape({
-    width: _propTypes["default"].number.isRequired,
-    height: _propTypes["default"].number.isRequired,
-    isMetric: _propTypes["default"].bool,
-    dpi: _propTypes["default"].number
-  }).isRequired,
-  useCheckerBoardBackground: _propTypes["default"].bool,
-  renderInCanvasContainer: _propTypes["default"].func
-};
-Designer.defaultProps = {
-  renderStandardToolbox: null,
-  renderSelectionToolbox: null,
-  renderInlineToolbox: null,
-  show: true,
-  hasBorder: true,
-  renderRulers: null,
-  selectedColor: '',
-  hideDesigner: null,
-  EditorContainer: CustomEditorContainer,
-  useCheckerBoardBackground: false
-};
-
-var _default = (0, _withStyles["default"])(styles, {
-  name: 'Designer'
-})((0, _AlignTargetProvider.withAlignTarget)(Designer));
-
-exports["default"] = _default;

package/App/Modules/Designer/DesignerScreen.js

@@ -1,233 +0,0 @@
-"use strict";
-
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.DesignerScreen = DesignerScreen;
-
-var React = _interopRequireWildcard(require("react"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-var _ReactComponent = _interopRequireDefault(require("../../../Shared/PropTypes/ReactComponent"));
-
-var _Header = _interopRequireDefault(require("../../Shared/Containers/Header"));
-
-var _DesignAreaControlbox = _interopRequireDefault(require("./Containers/DesignAreaControlbox"));
-
-var _EditDesignButton = _interopRequireDefault(require("./Containers/EditDesignButton"));
-
-var _CloseGraphicsEditorButton = _interopRequireDefault(require("./Containers/CloseGraphicsEditorButton"));
-
-var _CloseDesignEditor = _interopRequireDefault(require("./Containers/CloseDesignEditor"));
-
-var _ImageEditDialog = _interopRequireDefault(require("./Containers/ImageEditDialog"));
-
-var _DefaultCanvasProvider = require("../../Shared/Providers/DefaultCanvasProvider");
-
-var _DesignerAlignTarget = require("../Visualization/DesignerAlignTarget");
-
-var _DefaultLayout = _interopRequireDefault(require("./Layouts/DefaultLayout"));
-
-var _PopupAreaProvider = require("./Layouts/PopupAreaProvider");
-
-var _TwoSideBottomBar = require("./Layouts/Mobile/TwoSideBottomBar");
-
-var _Designer = _interopRequireDefault(require("./Containers/Designer"));
-
-var _DesignerSelectionToolbox = _interopRequireDefault(require("./Containers/DesignerSelectionToolbox"));
-
-var _AddVisualElement = _interopRequireDefault(require("./Containers/AddVisualElement"));
-
-var _ScreenPropTypes = _interopRequireDefault(require("../../Screens/Configurator/ScreenPropTypes"));
-
-var _FullScreenView = _interopRequireDefault(require("./Components/FullScreenView/FullScreenView"));
-
-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); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-/**
- * Main Screen of the configurator
- */
-function DesignerScreen(props) {
-  var imageOnly = props.imageOnly,
-      showDesigner = props.showDesigner,
-      showProductViewButton = props.showProductViewButton,
-      fallbackMode = props.fallbackMode,
-      is3DvisualMode = props.is3DvisualMode,
-      isPortraitMode = props.isPortraitMode,
-      _renderHeader = props.renderHeader,
-      renderSaveConfiguration = props.renderSaveConfiguration,
-      renderSendEmail = props.renderSendEmail,
-      renderPdfDownload = props.renderPdfDownload,
-      renderLoadConfiguration = props.renderLoadConfiguration,
-      renderError = props.renderError,
-      renderAlertMessages = props.renderAlertMessages,
-      renderConfirm = props.renderConfirm,
-      renderAmountPrice = props.renderAmountPrice,
-      renderDesigner = props.renderDesigner,
-      renderDesignerSelectionToolbox = props.renderDesignerSelectionToolbox,
-      renderDesignerFallback = props.renderDesignerFallback,
-      _renderVisualization = props.renderVisualization,
-      renderDesignAreaControlbox = props.renderDesignAreaControlbox,
-      renderEditDesignButton = props.renderEditDesignButton,
-      renderCloseGraphicsEditorButton = props.renderCloseGraphicsEditorButton,
-      renderImageEditDialog = props.renderImageEditDialog,
-      renderCloseDesignEditor = props.renderCloseDesignEditor,
-      renderAddVisualElement = props.renderAddVisualElement,
-      renderLoader = props.renderLoader,
-      renderLicenseNotice = props.renderLicenseNotice,
-      customElements = props.customElements,
-      CanvasProvider = props.CanvasProvider,
-      CanvasStateProvider = props.CanvasStateProvider,
-      TextEditorStateProvider = props.TextEditorStateProvider,
-      Layout = props.Layout,
-      PopupArea = props.PopupArea,
-      FallbackVisualization = props.FallbackVisualization;
-  return /*#__PURE__*/React.createElement(CanvasProvider, null, /*#__PURE__*/React.createElement(Layout, {
-    imageOnly: imageOnly,
-    isPortraitMode: isPortraitMode,
-    renderHeader: function renderHeader(renderProps) {
-      return renderProps.width === 'xs' && showDesigner ? function () {
-        return /*#__PURE__*/React.createElement("div", null);
-      } : _renderHeader();
-    },
-    fallbackMode: fallbackMode,
-    renderVisualization: function renderVisualization() {
-      return _renderVisualization({
-        fullScreenViewProps: {
-          Component: _FullScreenView["default"],
-          showPreviewButton: !showDesigner
-        }
-      });
-    },
-    renderMain: function renderMain(renderProps) {
-      return /*#__PURE__*/React.createElement(React.Fragment, null, renderProps.width !== 'xs' && isPortraitMode ? /*#__PURE__*/React.createElement("div", {
-        className: renderProps.classes.graphicsEditorWrapper
-      }, showProductViewButton && renderCloseGraphicsEditorButton(renderProps), !showDesigner && renderEditDesignButton({
-        styledButton: false
-      })) : null, renderProps.width === 'xs' ? showDesigner ? renderDesignAreaControlbox(renderProps) : !showProductViewButton && renderEditDesignButton({
-        styledButton: false
-      }) : null, !fallbackMode && /*#__PURE__*/React.createElement(_DesignerAlignTarget.DesignerAlignTarget, null), /*#__PURE__*/React.createElement(FallbackVisualization, {
-        fallbackMode: fallbackMode,
-        showContent: showDesigner
-      }, showDesigner && renderDesigner()), renderError(), renderAlertMessages(), renderConfirm(), renderSaveConfiguration(), renderSendEmail(), renderPdfDownload(), renderLoadConfiguration(), renderImageEditDialog(), renderProps.width !== 'xs' && showDesigner && is3DvisualMode && renderCloseDesignEditor(), customElements.main);
-    },
-    renderSidebar: function renderSidebar(renderProps) {
-      return /*#__PURE__*/React.createElement(CanvasStateProvider, null, /*#__PURE__*/React.createElement(TextEditorStateProvider, null, /*#__PURE__*/React.createElement(PopupArea, null, renderProps.width !== 'xs' && isPortraitMode ? /*#__PURE__*/React.createElement(_TwoSideBottomBar.TwoSideBottomBar, {
-        leftSide: showDesigner && /*#__PURE__*/React.createElement(React.Suspense, {
-          fallback: renderDesignerFallback()
-        }, renderDesignerSelectionToolbox()),
-        rightSide: /*#__PURE__*/React.createElement(React.Fragment, null, renderDesignAreaControlbox(renderProps), renderAmountPrice(props))
-      }) : /*#__PURE__*/React.createElement(React.Fragment, null, renderProps.width !== 'xs' ? showDesigner ? /*#__PURE__*/React.createElement(React.Fragment, null, renderCloseGraphicsEditorButton(renderProps), renderDesignAreaControlbox(renderProps)) : /*#__PURE__*/React.createElement(React.Fragment, null, showProductViewButton && renderCloseGraphicsEditorButton(renderProps), renderEditDesignButton({
-        styledButton: false
-      })) : null, showDesigner ? /*#__PURE__*/React.createElement(React.Suspense, {
-        fallback: renderDesignerFallback()
-      }, renderDesignerSelectionToolbox(), renderProps.width === 'xs' && /*#__PURE__*/React.createElement(React.Fragment, null, renderAddVisualElement(), is3DvisualMode && renderCloseDesignEditor())) : renderProps.width === 'xs' && props.activeDesignArea && renderEditDesignButton({
-        styledButton: true
-      }), /*#__PURE__*/React.createElement("div", {
-        className: renderProps.classes.toBottom
-      }, renderProps.width !== 'xs' ? renderAmountPrice(props) : props.activeDesignArea ? renderCloseGraphicsEditorButton(renderProps) : renderAmountPrice(props))))));
-    },
-    renderLoader: renderLoader,
-    renderLicenseNotice: renderLicenseNotice
-  }));
-}
-
-DesignerScreen.propTypes = _objectSpread(_objectSpread({}, _ScreenPropTypes["default"]), {}, {
-  showProductViewButton: _propTypes["default"].bool,
-  showPreviewButton: _propTypes["default"].bool,
-  area: _propTypes["default"].string,
-  customElements: _propTypes["default"].shape({
-    main: _propTypes["default"].node
-  }),
-  // Render props
-  renderDesignerSelectionToolbox: _propTypes["default"].func,
-  renderVisualizationEdit: _propTypes["default"].func,
-  renderDesignerFallback: _propTypes["default"].func,
-  renderHeader: _propTypes["default"].func,
-  renderDesignAreaControlbox: _propTypes["default"].func,
-  renderEditDesignButton: _propTypes["default"].func,
-  renderCloseGraphicsEditorButton: _propTypes["default"].func,
-  renderImageEditDialog: _propTypes["default"].func,
-  renderCloseDesignEditor: _propTypes["default"].func,
-  renderAddVisualElement: _propTypes["default"].func,
-  // Components
-  CanvasProvider: _ReactComponent["default"].isRequired,
-  CanvasStateProvider: _ReactComponent["default"].isRequired,
-  TextEditorStateProvider: _ReactComponent["default"].isRequired,
-  Layout: _ReactComponent["default"].isRequired,
-  PopupArea: _ReactComponent["default"].isRequired,
-  imageOnly: _propTypes["default"].bool
-}); // eslint-disable-next-line react/prop-types
-
-var renderDesignAreaControlbox = function renderDesignAreaControlbox(_ref) {
-  var area = _ref.area;
-  return /*#__PURE__*/React.createElement(_DesignAreaControlbox["default"], {
-    boxed: area === 'sidebar'
-  });
-}; // eslint-disable-next-line react/prop-types
-
-
-var renderEditDesignButton = function renderEditDesignButton(_ref2) {
-  var styledButton = _ref2.styledButton;
-  return /*#__PURE__*/React.createElement(_EditDesignButton["default"], {
-    buttonXS: styledButton
-  });
-};
-
-DesignerScreen.defaultProps = {
-  // Render props
-  renderCreator: function renderCreator() {
-    return null;
-  },
-  renderDesigner: function renderDesigner() {
-    return /*#__PURE__*/React.createElement(React.Suspense, {
-      fallback: /*#__PURE__*/React.createElement("div", null, "Loading Designer Component...")
-    }, /*#__PURE__*/React.createElement(_Designer["default"], null));
-  },
-  renderDesignerSelectionToolbox: function renderDesignerSelectionToolbox() {
-    return /*#__PURE__*/React.createElement(React.Suspense, {
-      fallback: /*#__PURE__*/React.createElement("div", null, "Loading Designer Toolbox...")
-    }, /*#__PURE__*/React.createElement(_DesignerSelectionToolbox["default"], null));
-  },
-  renderHeader: function renderHeader() {
-    return /*#__PURE__*/React.createElement(_Header["default"], null);
-  },
-  renderDesignerFallback: function renderDesignerFallback() {
-    return /*#__PURE__*/React.createElement("div", null, "Loading Designer Component...");
-  },
-  renderCloseGraphicsEditorButton: function renderCloseGraphicsEditorButton() {
-    return /*#__PURE__*/React.createElement(_CloseGraphicsEditorButton["default"], null);
-  },
-  renderImageEditDialog: function renderImageEditDialog() {
-    return /*#__PURE__*/React.createElement(_ImageEditDialog["default"], null);
-  },
-  renderCloseDesignEditor: function renderCloseDesignEditor() {
-    return /*#__PURE__*/React.createElement(_CloseDesignEditor["default"], null);
-  },
-  renderAddVisualElement: function renderAddVisualElement() {
-    return /*#__PURE__*/React.createElement(_AddVisualElement["default"], {
-      autoHide: true
-    });
-  },
-  renderEditDesignButton: renderEditDesignButton,
-  renderDesignAreaControlbox: renderDesignAreaControlbox,
-  // Components
-  CanvasProvider: _DefaultCanvasProvider.DefaultCanvasProvider,
-  CanvasStateProvider: _DefaultCanvasProvider.DefaultCanvasStateProvider,
-  TextEditorStateProvider: _DefaultCanvasProvider.DefaultTextEditorStateProvider,
-  Layout: _DefaultLayout["default"],
-  PopupArea: _PopupAreaProvider.PopupArea
-};

package/App/Modules/Designer/Layouts/DefaultLayout.js

@@ -1,196 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _styles = require("@material-ui/core/styles");
-
-var _withWidth = _interopRequireDefault(require("@material-ui/core/withWidth"));
-
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-var styles = function styles(theme) {
-  var _$main, _container;
-
-  return {
-    root: {
-      display: 'flex',
-      flexDirection: 'column',
-      position: 'absolute',
-      top: 0,
-      bottom: 0,
-      left: 0,
-      right: 0,
-      overflowX: 'hidden',
-      '&$fallbackMode': {
-        '& $main': (_$main = {}, _defineProperty(_$main, theme.breakpoints.up('md'), {
-          width: "calc(100% - ".concat(theme.layout.sidebar.width, "px)")
-        }), _defineProperty(_$main, '@media (orientation: landscape)', {
-          flexDirection: 'row'
-        }), _$main)
-      },
-      // helper classes can be used on contained elements
-      '& .noShrink': {
-        flexShrink: 0
-      },
-      '& .verticalSpacing': {
-        marginTop: theme.spacing(1),
-        marginBottom: theme.spacing(1)
-      },
-      '& .md': _defineProperty({}, theme.breakpoints.up('md'), {}),
-      '& .sm': _defineProperty({}, theme.breakpoints.down('sm'), {})
-    },
-    fallbackMode: {},
-    header: {},
-    container: (_container = {
-      flex: 1,
-      display: 'flex',
-      flexDirection: 'row'
-    }, _defineProperty(_container, theme.breakpoints.up('md'), {
-      margin: '8px 20px 24px 8px'
-    }), _defineProperty(_container, theme.breakpoints.down('md'), {
-      margin: '8px 20px 16px 8px'
-    }), _defineProperty(_container, theme.breakpoints.down('xs'), {
-      flexDirection: 'column',
-      margin: theme.smallScreen.padding
-    }), _defineProperty(_container, "position", 'relative'), _container),
-    containerTabletPortrait: {
-      flexDirection: 'column'
-    },
-    main: {
-      flex: 1,
-      display: 'flex',
-      flexDirection: 'column',
-      position: 'relative',
-      // the pointer events should be passed through to the visualization component
-      pointerEvents: 'none' // important: don't remove this
-
-    },
-    sidebar: function sidebar(_ref) {
-      var _ref2;
-
-      var isPortraitMode = _ref.isPortraitMode;
-      return _ref2 = {
-        position: 'relative',
-        display: 'flex',
-        flexDirection: 'column',
-        marginTop: theme.spacing(1),
-        width: !isPortraitMode ? theme.layout.sidebar.width : ''
-      }, _defineProperty(_ref2, theme.breakpoints.up('sm'), {
-        marginTop: 0,
-        marginLeft: theme.spacing(1)
-      }), _defineProperty(_ref2, theme.breakpoints.down('xs'), {
-        maxWidth: 'none'
-      }), _defineProperty(_ref2, '& > *', {
-        // make the components in the sidebar overlap the visualization
-        zIndex: 1
-      }), _defineProperty(_ref2, "pointerEvents", 'none'), _ref2;
-    },
-    visualization: _defineProperty({
-      // the visualization is in the background with absolute positioning
-      position: 'absolute',
-      width: '100%',
-      height: '100%'
-    }, theme.breakpoints.down('xs'), {
-      height: 'calc(100% - 156px)',
-      top: 69
-    }),
-    toBottom: {
-      marginTop: 'auto'
-    },
-    overlayContainer: _defineProperty({
-      position: 'absolute',
-      height: '100%',
-      zIndex: 1
-    }, theme.breakpoints.down('xs'), {
-      position: 'absolute'
-    }),
-    graphicsEditorWrapper: {
-      maxWidth: theme.layout.sidebar.width,
-      width: '100%',
-      marginLeft: 'auto',
-      marginRight: '0'
-    }
-  };
-};
-
-var DefaultLayout = function DefaultLayout(_ref3) {
-  var width = _ref3.width,
-      classes = _ref3.classes,
-      renderHeader = _ref3.renderHeader,
-      renderMain = _ref3.renderMain,
-      renderSidebar = _ref3.renderSidebar,
-      renderVisualization = _ref3.renderVisualization,
-      renderLoader = _ref3.renderLoader,
-      renderLicenseNotice = _ref3.renderLicenseNotice,
-      fallbackMode = _ref3.fallbackMode,
-      isPortraitMode = _ref3.isPortraitMode,
-      imageOnly = _ref3.imageOnly;
-  return imageOnly ? /*#__PURE__*/_react["default"].createElement("div", {
-    className: "".concat(classes.root, " ").concat(fallbackMode ? classes.fallbackMode : '')
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "".concat(classes.container, " ").concat(isPortraitMode ? classes.containerTabletPortrait : '')
-  }, !fallbackMode && /*#__PURE__*/_react["default"].createElement("div", {
-    className: classes.visualization
-  }, renderVisualization()), /*#__PURE__*/_react["default"].createElement("div", {
-    className: classes.main
-  }, renderMain({
-    area: 'main',
-    width: width,
-    classes: classes
-  }))), renderLoader()) : /*#__PURE__*/_react["default"].createElement("div", {
-    className: "".concat(classes.root, " ").concat(fallbackMode ? classes.fallbackMode : '')
-  }, renderLicenseNotice(), /*#__PURE__*/_react["default"].createElement("div", {
-    className: classes.header
-  }, renderHeader({
-    area: 'header',
-    width: width,
-    classes: classes
-  })), /*#__PURE__*/_react["default"].createElement("div", {
-    className: "".concat(classes.container, " ").concat(isPortraitMode ? classes.containerTabletPortrait : '')
-  }, !fallbackMode && /*#__PURE__*/_react["default"].createElement("div", {
-    className: classes.visualization
-  }, renderVisualization()), /*#__PURE__*/_react["default"].createElement("div", {
-    className: classes.main
-  }, renderMain({
-    area: 'main',
-    width: width,
-    classes: classes
-  })), /*#__PURE__*/_react["default"].createElement("div", {
-    className: classes.sidebar
-  }, renderSidebar({
-    area: 'sidebar',
-    width: width,
-    classes: classes
-  }))), renderLoader());
-};
-
-DefaultLayout.propTypes = {
-  classes: _propTypes["default"].object,
-  width: _propTypes["default"].string,
-  renderHeader: _propTypes["default"].func,
-  renderMain: _propTypes["default"].func,
-  renderSidebar: _propTypes["default"].func,
-  renderVisualization: _propTypes["default"].func,
-  renderLoader: _propTypes["default"].func,
-  renderLicenseNotice: _propTypes["default"].func,
-  fallbackMode: _propTypes["default"].bool,
-  isPortraitMode: _propTypes["default"].bool,
-  imageOnly: _propTypes["default"].bool
-};
-
-var _default = (0, _styles.withStyles)(styles, {
-  name: 'DefaultLayout'
-})((0, _withWidth["default"])({
-  initialWidth: 'xl'
-})(DefaultLayout));
-
-exports["default"] = _default;