kitchen-simulator 11.0.0-react-18 → 11.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (71) hide show
  1. package/es/LiteKitchenConfigurator.js +42 -11
  2. package/es/LiteRenderer.js +2 -24
  3. package/es/actions/export.js +25 -12
  4. package/es/analytics/ga4.js +188 -0
  5. package/es/catalog/utils/item-loader.js +4 -4
  6. package/es/class/item.js +29 -7
  7. package/es/class/line.js +1 -3
  8. package/es/components/content.js +20 -5
  9. package/es/components/export.js +6 -4
  10. package/es/components/style/form-number-input.js +7 -5
  11. package/es/components/style/form-submit-button.js +25 -0
  12. package/es/components/viewer2d/group.js +6 -5
  13. package/es/components/viewer2d/item.js +9 -9
  14. package/es/components/viewer2d/line.js +18 -47
  15. package/es/components/viewer2d/rulerX.js +9 -8
  16. package/es/components/viewer2d/rulerY.js +9 -8
  17. package/es/components/viewer2d/scene.js +9 -9
  18. package/es/components/viewer2d/state.js +1 -1
  19. package/es/components/viewer2d/utils.js +0 -6
  20. package/es/components/viewer2d/viewer2d.js +35 -31
  21. package/es/components/viewer3d/ruler-utils/layer3D.js +2 -2
  22. package/es/components/viewer3d/scene-creator.js +40 -75
  23. package/es/components/viewer3d/viewer3d-first-person.js +13 -8
  24. package/es/components/viewer3d/viewer3d.js +19 -15
  25. package/es/devLiteRenderer.js +913 -0
  26. package/es/events/external/handleExternalEvent.js +1 -0
  27. package/es/events/external/handleExternalEvent.util.js +330 -347
  28. package/es/events/external/handlers.changeDoorStyle.js +5 -3
  29. package/es/events/external/handlers.loadProject.js +5 -3
  30. package/es/events/external/handlers.syncScene.js +1 -1
  31. package/es/mappings/external-events/mappers/ccdfMapper.js +14 -8
  32. package/es/shared/domain/cabinet-warning.js +15 -0
  33. package/es/utils/geometry.js +4 -7
  34. package/es/utils/helper.js +81 -22
  35. package/es/utils/skinPanelEngine.js +5 -9
  36. package/lib/LiteKitchenConfigurator.js +42 -11
  37. package/lib/LiteRenderer.js +3 -25
  38. package/lib/actions/export.js +35 -39
  39. package/lib/analytics/ga4.js +194 -0
  40. package/lib/catalog/utils/item-loader.js +3 -3
  41. package/lib/class/item.js +29 -7
  42. package/lib/class/line.js +1 -3
  43. package/lib/components/content.js +19 -4
  44. package/lib/components/export.js +6 -16
  45. package/lib/components/style/form-number-input.js +7 -5
  46. package/lib/components/style/form-submit-button.js +35 -0
  47. package/lib/components/viewer2d/group.js +6 -5
  48. package/lib/components/viewer2d/item.js +8 -8
  49. package/lib/components/viewer2d/line.js +18 -47
  50. package/lib/components/viewer2d/rulerX.js +9 -8
  51. package/lib/components/viewer2d/rulerY.js +9 -8
  52. package/lib/components/viewer2d/scene.js +9 -9
  53. package/lib/components/viewer2d/state.js +1 -1
  54. package/lib/components/viewer2d/utils.js +0 -7
  55. package/lib/components/viewer2d/viewer2d.js +33 -29
  56. package/lib/components/viewer3d/ruler-utils/layer3D.js +2 -2
  57. package/lib/components/viewer3d/scene-creator.js +39 -75
  58. package/lib/components/viewer3d/viewer3d-first-person.js +13 -8
  59. package/lib/components/viewer3d/viewer3d.js +19 -15
  60. package/lib/devLiteRenderer.js +917 -0
  61. package/lib/events/external/handleExternalEvent.js +1 -0
  62. package/lib/events/external/handleExternalEvent.util.js +330 -347
  63. package/lib/events/external/handlers.changeDoorStyle.js +5 -3
  64. package/lib/events/external/handlers.loadProject.js +5 -3
  65. package/lib/events/external/handlers.syncScene.js +1 -1
  66. package/lib/mappings/external-events/mappers/ccdfMapper.js +14 -8
  67. package/lib/shared/domain/cabinet-warning.js +20 -0
  68. package/lib/utils/geometry.js +4 -7
  69. package/lib/utils/helper.js +82 -24
  70. package/lib/utils/skinPanelEngine.js +4 -8
  71. package/package.json +21 -6
@@ -25,7 +25,6 @@ exports.parseData = parseData;
25
25
  exports.removeItem = removeItem;
26
26
  exports.removeSelItemMesh = removeSelItemMesh;
27
27
  exports.sameSign = sameSign;
28
- exports.showYelloBox = showYelloBox;
29
28
  exports.threedfabs = threedfabs;
30
29
  exports.tryAdjacentMD = tryAdjacentMD;
31
30
  exports.updateDoorHandleMesh = updateDoorHandleMesh;
@@ -44,9 +43,11 @@ var _convertUnitsLite = require("../../utils/convert-units-lite");
44
43
  var _geometry2 = require("../../utils/geometry");
45
44
  var GeomUtils = _interopRequireWildcard(require("../../catalog/utils/geom-utils"));
46
45
  var _itemLoader = require("../../catalog/utils/item-loader");
46
+ var _cabinetWarning = require("../../shared/domain/cabinet-warning");
47
47
  var _utils = require("../viewer2d/utils");
48
48
  var _helper = require("../../utils/helper");
49
49
  var _math = require("../../utils/math");
50
+ var _immutable = require("../../shared/objects/immutable");
50
51
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
51
52
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
52
53
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -537,16 +538,14 @@ function replaceObject(modifiedPath, layer, planData, actions, sceneData, oldSce
537
538
  }
538
539
  var mBoxColor = 0x99c3fb;
539
540
  var _item = item.toJS();
540
- if (_item.doorStyle.doorStyles !== undefined && _item.doorStyle.doorStyles.cds) {
541
- if (showYelloBox(_item)) {
542
- mBoxColor = 'rgba(232,187,47,1)';
543
- var mBox = GeomUtils.makeMBoxfromObject(item3D, mBoxColor);
544
- var warningObj = createWarningObject();
545
- warningObj.position.set(0, item.properties.get('height').get('length') / 3, 0);
546
- if (mBox) {
547
- mBox.add(warningObj);
548
- item3D.add(mBox);
549
- }
541
+ if ((0, _cabinetWarning.isWarningCabinet)(_item)) {
542
+ mBoxColor = 'rgba(232,187,47,1)';
543
+ var mBox = GeomUtils.makeMBoxfromObject(item3D, mBoxColor);
544
+ var warningObj = createWarningObject();
545
+ warningObj.position.set(0, item.properties.get('height').get('length') / 3, 0);
546
+ if (mBox) {
547
+ mBox.add(warningObj);
548
+ item3D.add(mBox);
550
549
  }
551
550
  }
552
551
  }
@@ -727,16 +726,14 @@ function replaceObject(modifiedPath, layer, planData, actions, sceneData, oldSce
727
726
  if (item3D) {
728
727
  var _mBoxColor = 0x99c3fb;
729
728
  var _item2 = item.toJS();
730
- if (_item2.doorStyle.doorStyles !== undefined && _item2.doorStyle.doorStyles.cds) {
731
- if (showYelloBox(_item2)) {
732
- _mBoxColor = 'rgba(232,187,47,1)';
733
- var _mBox2 = GeomUtils.makeMBoxfromObject(item3D, _mBoxColor);
734
- var _warningObj = createWarningObject();
735
- _warningObj.position.set(0, item.properties.get('height').get('length') / 3, 0);
736
- if (_mBox2) {
737
- _mBox2.add(_warningObj);
738
- item3D.add(_mBox2);
739
- }
729
+ if ((0, _cabinetWarning.isWarningCabinet)(_item2)) {
730
+ _mBoxColor = 'rgba(232,187,47,1)';
731
+ var _mBox2 = GeomUtils.makeMBoxfromObject(item3D, _mBoxColor);
732
+ var _warningObj = createWarningObject();
733
+ _warningObj.position.set(0, item.properties.get('height').get('length') / 3, 0);
734
+ if (_mBox2) {
735
+ _mBox2.add(_warningObj);
736
+ item3D.add(_mBox2);
740
737
  }
741
738
  }
742
739
  }
@@ -859,10 +856,8 @@ function replaceObject(modifiedPath, layer, planData, actions, sceneData, oldSce
859
856
  }
860
857
  var _mBoxColor2 = 0x99c3fb;
861
858
  var _item3 = item.toJS();
862
- if (_item3.doorStyle.doorStyles !== undefined && _item3.doorStyle.doorStyles.cds) {
863
- if (showYelloBox(_item3)) {
864
- _mBoxColor2 = 'rgba(232,187,47,1)';
865
- }
859
+ if ((0, _cabinetWarning.isWarningCabinet)(_item3)) {
860
+ _mBoxColor2 = 'rgba(232,187,47,1)';
866
861
  }
867
862
  rItem.children[0].children.forEach(function (rItemElement) {
868
863
  rItemElement.visible = false;
@@ -2082,21 +2077,19 @@ function addItem(sceneData, planData, layer, itemID, catalog, itemsActions) {
2082
2077
  if (pivot) {
2083
2078
  var mBoxColor = 0x99c3fb;
2084
2079
  var _item = item.toJS();
2085
- if (_item.doorStyle.doorStyles !== undefined && _item.doorStyle.doorStyles.cds) {
2086
- if (showYelloBox(_item)) {
2087
- mBoxColor = 'rgba(232,187,47,1)';
2088
- } else {
2089
- pivot.children[0].children.forEach(function (pivotElement) {
2090
- pivotElement.visible = false;
2091
- });
2092
- }
2093
- var mBox = GeomUtils.makeMBoxfromObject(pivot, mBoxColor);
2094
- var warningObj = createWarningObject();
2095
- warningObj.position.set(0, item.properties.get('height').get('length') / 3, 0);
2096
- if (mBox) {
2097
- mBox.add(warningObj);
2098
- pivot.add(mBox);
2099
- }
2080
+ if ((0, _cabinetWarning.isWarningCabinet)(_item)) {
2081
+ mBoxColor = 'rgba(232,187,47,1)';
2082
+ } else {
2083
+ pivot.children[0].children.forEach(function (pivotElement) {
2084
+ pivotElement.visible = false;
2085
+ });
2086
+ }
2087
+ var mBox = GeomUtils.makeMBoxfromObject(pivot, mBoxColor);
2088
+ var warningObj = createWarningObject();
2089
+ warningObj.position.set(0, item.properties.get('height').get('length') / 3, 0);
2090
+ if (mBox) {
2091
+ mBox.add(warningObj);
2092
+ pivot.add(mBox);
2100
2093
  }
2101
2094
  }
2102
2095
 
@@ -2194,8 +2187,8 @@ function addItem(sceneData, planData, layer, itemID, catalog, itemsActions) {
2194
2187
  height: height,
2195
2188
  depth: depth
2196
2189
  };
2197
- val.layoutpos = cat.info.layoutpos;
2198
- val.is_corner = cat.info.is_corner;
2190
+ val.layoutpos = item === null || item === void 0 ? void 0 : item.layoutpos;
2191
+ val.is_corner = item === null || item === void 0 ? void 0 : item.is_corner;
2199
2192
  val.item = item;
2200
2193
  var calcrect = _export.GeometryUtils.getCalcRectFromItem3D(val);
2201
2194
 
@@ -2222,13 +2215,9 @@ function addItem(sceneData, planData, layer, itemID, catalog, itemsActions) {
2222
2215
  });
2223
2216
  if (pivot.children.length > 1) {
2224
2217
  var _item4 = item.toJS();
2225
- if (_item4.doorStyle.doorStyles !== undefined) {
2226
- if (_item4.category === 'cabinet') {
2227
- if (_item4.doorStyle.doorStyles.cds.some(function (element) {
2228
- return element.itemID === item.itemID;
2229
- })) {
2230
- pivot.children.pop();
2231
- }
2218
+ if (_item4.category === _constants.ITEM_TYPE.CABINET) {
2219
+ if (!(0, _cabinetWarning.isWarningCabinet)(item)) {
2220
+ pivot.children.pop();
2232
2221
  } else {
2233
2222
  pivot.children.pop();
2234
2223
  }
@@ -2945,31 +2934,6 @@ function threedfabs(a) {
2945
2934
  function getDistanceBetweenLineSegment(pos1, pos2, pos3, pos4) {
2946
2935
  if (pos1.x == pos2.x && pos3.x == pos4.x) return pos3.x - pos1.x;else if (pos1.y == pos2.y && pos3.y == pos4.y) return pos3.y - pos1.y;else return -1;
2947
2936
  }
2948
-
2949
- /**
2950
- * check to see if an item is suitable for the given doorStyle.
2951
- * @param _item
2952
- * @returns true if it's not suitable.
2953
- */
2954
- function showYelloBox(_item) {
2955
- var _doorStyle;
2956
- var doorStyle = _item === null || _item === void 0 ? void 0 : _item.doorStyle;
2957
-
2958
- // If doorStyle is an Immutable Map, convert to plain JS
2959
- if (doorStyle && typeof doorStyle.toJS === 'function') {
2960
- doorStyle = doorStyle.toJS();
2961
- }
2962
- var isItemCabinet = (_item === null || _item === void 0 ? void 0 : _item.category) === 'cabinet';
2963
- var cds = (_doorStyle = doorStyle) === null || _doorStyle === void 0 || (_doorStyle = _doorStyle.doorStyles) === null || _doorStyle === void 0 ? void 0 : _doorStyle.cds;
2964
-
2965
- // hasItemCDS: item is suitable if its itemID exists in cds
2966
- var hasItemCDS = isItemCabinet && Array.isArray(cds) ? cds.some(function (element) {
2967
- return element.itemID === _item.itemID;
2968
- }) : false;
2969
-
2970
- // return true if it's a cabinet but not suitable for the current doorStyle
2971
- return isItemCabinet && !hasItemCDS;
2972
- }
2973
2937
  function isSimilar(a, b) {
2974
2938
  if (threedfabs(a - b) <= 0.01) return 1;
2975
2939
  return 0;
@@ -3508,7 +3472,7 @@ function addMolding(MGArray, addItem, planData, layer, itemActions, mode) {
3508
3472
  if (addItem.selected && [_constants.MODE_DRAGGING_ITEM_3D, _constants.MODE_ROTATING_ITEM_3D].includes(mode)) return false;
3509
3473
 
3510
3474
  // If the item is not available for current doorStyle
3511
- if (showYelloBox(addItem))
3475
+ if ((0, _cabinetWarning.isWarningCabinet)(addItem))
3512
3476
  // Do not add molding to that item
3513
3477
  return MGArray;
3514
3478
 
@@ -11,10 +11,9 @@ var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/creat
11
11
  var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
12
12
  var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
13
13
  var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
14
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
15
14
  var _react = _interopRequireDefault(require("react"));
16
15
  var _propTypes = _interopRequireDefault(require("prop-types"));
17
- var _AppContext = _interopRequireDefault(require("../../AppContext"));
16
+ var _reactDom = _interopRequireDefault(require("react-dom"));
18
17
  var Three = _interopRequireWildcard(require("three"));
19
18
  var _sceneCreator = require("./scene-creator");
20
19
  var _threeMemoryCleaner = require("./three-memory-cleaner");
@@ -33,7 +32,6 @@ var Viewer3DFirstPerson = exports["default"] = /*#__PURE__*/function (_React$Com
33
32
  _this.width = props.width;
34
33
  _this.height = props.height;
35
34
  _this.stopRendering = false;
36
- _this.canvasWrapperRef = /*#__PURE__*/_react["default"].createRef();
37
35
  _this.renderer = window.__threeRenderer || new Three.WebGLRenderer({
38
36
  preserveDrawingBuffer: true
39
37
  });
@@ -64,7 +62,7 @@ var Viewer3DFirstPerson = exports["default"] = /*#__PURE__*/function (_React$Com
64
62
  };
65
63
  var state = this.props.state;
66
64
  var data = state.scene;
67
- var canvasWrapper = this.canvasWrapperRef.current;
65
+ var canvasWrapper = _reactDom["default"].findDOMNode(this.refs.canvasWrapper);
68
66
  var scene3D = new Three.Scene();
69
67
 
70
68
  // As I need to show the pointer above all scene objects, I use this workaround http://stackoverflow.com/a/13309722
@@ -263,8 +261,8 @@ var Viewer3DFirstPerson = exports["default"] = /*#__PURE__*/function (_React$Com
263
261
  this.renderer.renderLists.dispose();
264
262
  }
265
263
  }, {
266
- key: "UNSAFE_componentWillReceiveProps",
267
- value: function UNSAFE_componentWillReceiveProps(nextProps) {
264
+ key: "componentWillReceiveProps",
265
+ value: function componentWillReceiveProps(nextProps) {
268
266
  var width = nextProps.width,
269
267
  height = nextProps.height;
270
268
  var camera = this.camera,
@@ -297,15 +295,22 @@ var Viewer3DFirstPerson = exports["default"] = /*#__PURE__*/function (_React$Com
297
295
  key: "render",
298
296
  value: function render() {
299
297
  return /*#__PURE__*/_react["default"].createElement('div', {
300
- ref: this.canvasWrapperRef
298
+ ref: 'canvasWrapper'
301
299
  });
302
300
  }
303
301
  }]);
304
302
  }(_react["default"].Component);
305
- (0, _defineProperty2["default"])(Viewer3DFirstPerson, "contextType", _AppContext["default"]);
306
303
  Viewer3DFirstPerson.propTypes = {
307
304
  state: _propTypes["default"].object.isRequired,
308
305
  width: _propTypes["default"].number.isRequired,
309
306
  height: _propTypes["default"].number.isRequired
310
307
  };
308
+ Viewer3DFirstPerson.contextTypes = {
309
+ areaActions: _propTypes["default"].object.isRequired,
310
+ holesActions: _propTypes["default"].object.isRequired,
311
+ itemsActions: _propTypes["default"].object.isRequired,
312
+ linesActions: _propTypes["default"].object.isRequired,
313
+ projectActions: _propTypes["default"].object.isRequired,
314
+ catalog: _propTypes["default"].object
315
+ };
311
316
  module.exports = exports.default;
@@ -7,15 +7,15 @@ Object.defineProperty(exports, "__esModule", {
7
7
  });
8
8
  exports["default"] = void 0;
9
9
  var _readOnlyError2 = _interopRequireDefault(require("@babel/runtime/helpers/readOnlyError"));
10
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
10
11
  var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
11
12
  var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
12
13
  var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
13
14
  var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
14
15
  var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
15
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
16
16
  var _react = _interopRequireDefault(require("react"));
17
17
  var _propTypes = _interopRequireDefault(require("prop-types"));
18
- var _AppContext = _interopRequireDefault(require("../../AppContext"));
18
+ var _reactDom = _interopRequireDefault(require("react-dom"));
19
19
  var Three = _interopRequireWildcard(require("three"));
20
20
  var _sceneCreator = require("./scene-creator");
21
21
  var _threeMemoryCleaner = require("./three-memory-cleaner");
@@ -57,7 +57,6 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
57
57
  _this.width = props.width;
58
58
  _this.height = props.height;
59
59
  _this.renderingID = 0;
60
- _this.canvasWrapperRef = /*#__PURE__*/_react["default"].createRef();
61
60
  var mode = props.state.mode;
62
61
  if (!window.__elevationRendererDownload) {
63
62
  window.__elevationRendererDownload = {};
@@ -552,7 +551,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
552
551
  if (item !== null) {
553
552
  var catid = item.type;
554
553
  var cat = catalog.elements[catid];
555
- layoutpos = cat.info.layoutpos;
554
+ layoutpos = item === null || item === void 0 ? void 0 : item.layoutpos;
556
555
  }
557
556
  var oPos = new Three.Vector2(pos.clone().x, pos.clone().y);
558
557
  var sBounding = obj.children[0].userData;
@@ -572,9 +571,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
572
571
  return false;
573
572
  }
574
573
  var _item = layer.items.getIn([data.id]);
575
- var ocatid = _item.type;
576
- var ocat = catalog.elements[ocatid];
577
- var olayoutpos = ocat.info.layoutpos;
574
+ var olayoutpos = _item.layoutpos;
578
575
  if (!(layoutpos === _constants.BASE_CABINET_LAYOUTPOS && olayoutpos === _constants.WALL_CABINET_LAYOUTPOS || layoutpos === _constants.WALL_CABINET_LAYOUTPOS && olayoutpos === _constants.BASE_CABINET_LAYOUTPOS)) {
579
576
  var tRot = _item.rotation;
580
577
  var tPos = new Three.Vector2(_item.x, _item.y);
@@ -1200,9 +1197,8 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
1200
1197
  var curLayerId = _this2.props.state.scene.selectedLayer;
1201
1198
  var curLayer = _this2.props.state.scene.getIn(['layers', curLayerId]);
1202
1199
  if (!(0, _helper.isEmpty)(evtType) && !(0, _helper.isEmpty)(evtElement)) {
1203
- var _state$get, _this2$props$onIntern, _this2$props;
1204
- var catalog = (_state$get = state.get('catalog')) === null || _state$get === void 0 ? void 0 : _state$get.toJS();
1205
- var payload = (0, _helper.updatePayloadOfInternalEvent)(evtElement, curLayer, catalog, pointArray);
1200
+ var _this2$props$onIntern, _this2$props;
1201
+ var payload = (0, _helper.updatePayloadOfInternalEvent)(evtElement, curLayer, pointArray);
1206
1202
  (_this2$props$onIntern = (_this2$props = _this2.props).onInternalEvent) === null || _this2$props$onIntern === void 0 || _this2$props$onIntern.call(_this2$props, {
1207
1203
  type: evtType,
1208
1204
  value: payload
@@ -2173,7 +2169,7 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
2173
2169
  }
2174
2170
 
2175
2171
  // Add the output of the renderer to the html element
2176
- var canvasWrapper = this.canvasWrapperRef.current;
2172
+ var canvasWrapper = _reactDom["default"].findDOMNode(this.refs.canvasWrapper);
2177
2173
  canvasWrapper && canvasWrapper.appendChild(this.renderer.domElement);
2178
2174
 
2179
2175
  //
@@ -2442,8 +2438,8 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
2442
2438
  this.renderer.renderLists.dispose();
2443
2439
  }
2444
2440
  }, {
2445
- key: "UNSAFE_componentWillReceiveProps",
2446
- value: function UNSAFE_componentWillReceiveProps(nextProps) {
2441
+ key: "componentWillReceiveProps",
2442
+ value: function componentWillReceiveProps(nextProps) {
2447
2443
  var _this4 = this;
2448
2444
  if (this.props.downloadFlag && (0, _immutablediff["default"])(this.props.state, nextProps.state).toJS().length == 0 || (0, _helper.isEmpty)(nextProps.state.scene)) return;
2449
2445
  var width = nextProps.width,
@@ -2653,17 +2649,25 @@ var Scene3DViewer = exports["default"] = /*#__PURE__*/function (_React$Component
2653
2649
  this.renderer.domElement.style.opacity = '1';
2654
2650
  !this.props.downloadFlag && document.getElementById('front') && (document.getElementById('front').style.display = 'block');
2655
2651
  return /*#__PURE__*/_react["default"].createElement('div', {
2656
- ref: this.canvasWrapperRef
2652
+ ref: 'canvasWrapper'
2657
2653
  });
2658
2654
  }
2659
2655
  }
2660
2656
  }]);
2661
2657
  }(_react["default"].Component);
2662
- (0, _defineProperty2["default"])(Scene3DViewer, "contextType", _AppContext["default"]);
2663
2658
  Scene3DViewer.propTypes = {
2664
2659
  state: _propTypes["default"].object.isRequired,
2665
2660
  width: _propTypes["default"].number.isRequired,
2666
2661
  height: _propTypes["default"].number.isRequired,
2667
2662
  replaceCabinet: _propTypes["default"].func.isRequired
2668
2663
  };
2664
+ Scene3DViewer.contextTypes = {
2665
+ areaActions: _propTypes["default"].object.isRequired,
2666
+ holesActions: _propTypes["default"].object.isRequired,
2667
+ itemsActions: _propTypes["default"].object.isRequired,
2668
+ linesActions: _propTypes["default"].object.isRequired,
2669
+ sceneActions: _propTypes["default"].object.isRequired,
2670
+ projectActions: _propTypes["default"].object.isRequired,
2671
+ catalog: _propTypes["default"].object
2672
+ };
2669
2673
  module.exports = exports.default;