kitchen-simulator 1.0.0-alin.9 → 1.0.0-clark.101

package/lib/components/viewer2d/ruler.js

@@ -10,6 +10,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _convertUnitsLite = require("../../utils/convert-units-lite");
 var _idBroker = _interopRequireDefault(require("../../utils/id-broker"));
 var _constants = require("../../constants");
+var _line = require("./line");
 var STYLE = {
   stroke: _constants.TEXT_COLOR_NEUTRAL_7,
   strokeWidth: '1px'
@@ -22,6 +23,7 @@ var STYLE_TEXT = {
   textAnchor: 'middle',
   fontSize: '12px',
   pointerEvents: 'none',
+  fill: '#455A64',
   //http://stackoverflow.com/questions/826782/how-to-disable-text-selection-highlighting-using-css
   WebkitTouchCallout: 'none' /* iOS Safari */,
   WebkitUserSelect: 'none' /* Chrome/Safari/Opera */,
@@ -35,37 +37,9 @@ function Ruler(_ref) {
     unit = _ref.unit,
     rulerUnit = _ref.rulerUnit,
     transform = _ref.transform,
-    flag = _ref.flag;
-  var update = function update(lengthInput, unitInput, type) {
-    var newLength = toFixedFloat(lengthInput);
-    var merged = null;
-    if (type === 0) {
-      merged = value.merge({
-        _length: newLength,
-        length: (0, _convertUnitsLite.convert)(newLength).from(unitInput).to('cm')
-      });
-    } else {
-      merged = value.merge({
-        _length: (0, _convertUnitsLite.convert)(newLength).from(UNIT_INCH).to(unitInput),
-        _unit: unitInput
-      });
-    }
-    // if (hook) {
-    //   return hook(merged, sourceElement, internalState, state).then(val => {
-    //     return onUpdate(val);
-    //   });
-    // }
-    // return onUpdate(merged);
-  };
-  // let _unit = "in";
-  // let distanceText = convert(length).from(unit).to(rulerUnit);
+    style = _ref.style;
   var distanceText = (0, _convertUnitsLite.convert)(length).from(unit).to(rulerUnit).toFixed(0);
-  var thickness = (0, _convertUnitsLite.convert)(_constants.LINE_THICKNESS).from(unit).to(rulerUnit).toFixed(0);
-  // let _ft_len = convert(_length).from('in').to('ft');
-  // let _ft_val = Math.floor(_ft_len); _ft_len -= _ft_val;
-  // let _in_val = convert(_ft_len).from('ft').to('in').toFixed(0);
-  // let distanceText = `${_ft_val}'${_in_val}"`;
-  var textLength = (distanceText.length + layer.unit.length) * 18;
+  var textLength = (distanceText.length + layer.unit.length) * 9;
   return /*#__PURE__*/_react["default"].createElement("g", {
     transform: transform
   }, /*#__PURE__*/_react["default"].createElement("g", {
@@ -86,18 +60,24 @@ function Ruler(_ref) {
     style: STYLE_TEXT,
     fill: _constants.TEXT_COLOR_NEUTRAL_7
   }, Math.round((0, _convertUnitsLite.convert)(distanceText).from('in').to(layer.unit) * 100) / 100, layer.unit === 'in' ? '"' : layer.unit)), /*#__PURE__*/_react["default"].createElement("line", {
-    x1: "0",
+    x1: style === _line.STYLE_ROOM_SHAPE ? 0 : 4,
     y1: "0",
     x2: (length - textLength) / 2 < 0 ? 0 : (length - textLength) / 2,
     y2: "0",
-    style: STYLE
+    style: style
   }), /*#__PURE__*/_react["default"].createElement("line", {
     x1: (length + textLength) / 2 < 0 ? 0 : (length + textLength) / 2 < length ? (length + textLength) / 2 : length,
     y1: "0",
-    x2: length,
+    x2: style === _line.STYLE_ROOM_SHAPE ? length : length - 4,
     y2: "0",
-    style: STYLE
-  }));
+    style: style
+  }), style !== _line.STYLE_ROOM_SHAPE && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("polygon", {
+    points: "3, 0, 6.5, -2, 6.5, 2 ",
+    style: style
+  }), /*#__PURE__*/_react["default"].createElement("polygon", {
+    points: "".concat(length - 3, ", 0, ").concat(length - 6.5, ", 2, ").concat(length - 6.5, ", -2"),
+    style: style
+  })));
 }
 Ruler.propTypes = {
   length: _propTypes["default"].number.isRequired,

package/lib/components/viewer2d/rulerDist.js

@@ -14,13 +14,15 @@ var ARROW_STYLE = {
   strokeLinecap: 'round'
 };
 var STYLE = {
-  stroke: 'black',
-  strokeWidth: '1.1px'
+  stroke: '#455A64',
+  fill: '#455A64',
+  strokeWidth: '1.5px'
 };
 var STYLE_TEXT = {
   textAnchor: 'middle',
   fontSize: '10px',
   pointerEvents: 'none',
+  fill: '#455A64',
   //http://stackoverflow.com/questions/826782/how-to-disable-text-selection-highlighting-using-css
   WebkitTouchCallout: 'none' /* iOS Safari */,
   WebkitUserSelect: 'none' /* Chrome/Safari/Opera */,
@@ -82,32 +84,24 @@ function RulerDist(_ref) {
       y: "0",
       transform: "translate(".concat(length / 2, ",").concat(ay, ") scale(1, -1) rotate(").concat(textRotation, ")"),
       style: STYLE_TEXT
-    }, Math.round((0, _convertUnitsLite.convert)(distanceText).from('in').to(layer.unit) * 100) / 100, layer.unit)), /*#__PURE__*/_react["default"].createElement("circle", {
-      cx: "1",
-      cy: "0",
-      fill: "white",
-      r: "1.1",
-      stroke: "black",
-      strokeWidth: "0.6"
-    }), /*#__PURE__*/_react["default"].createElement("line", {
+    }, Math.round((0, _convertUnitsLite.convert)(distanceText).from('in').to(layer.unit) * 100) / 100, layer.unit === 'in' ? '"' : layer.unit)), /*#__PURE__*/_react["default"].createElement("line", {
       x1: "2",
       y1: "0",
       x2: (length - textLength) / 2 < 0 ? 0 : length,
       y2: "0",
       style: STYLE
+    }), /*#__PURE__*/_react["default"].createElement("polygon", {
+      points: "1, 0, 4.5, -2, 4.5, 2 ",
+      style: STYLE
     }), /*#__PURE__*/_react["default"].createElement("line", {
       x1: (length + textLength) / 2 < 0 ? 0 : (length + textLength) / 2 < length ? (length + textLength) / 2 : length,
       y1: "0",
       x2: length,
       y2: "0",
       style: STYLE
-    }), /*#__PURE__*/_react["default"].createElement("circle", {
-      cx: length - 1,
-      cy: "0",
-      fill: "white",
-      r: "1.1",
-      stroke: "black",
-      strokeWidth: "0.6"
+    }), /*#__PURE__*/_react["default"].createElement("polygon", {
+      points: "".concat(length - 1, ", 0, ").concat(length - 4.5, ", 2, ").concat(length - 4.5, ", -2"),
+      style: STYLE
     }));
   } else {
     return /*#__PURE__*/_react["default"].createElement("g", {
@@ -117,32 +111,24 @@ function RulerDist(_ref) {
       y: "0",
       transform: "translate(".concat(length / 2, ",").concat(ay, ") scale(1, -1) rotate(").concat(textRotation, ")"),
       style: STYLE_TEXT
-    }, Math.round((0, _convertUnitsLite.convert)(distanceText).from('in').to(layer.unit) * 100) / 100, layer.unit)), /*#__PURE__*/_react["default"].createElement("circle", {
-      cx: "1",
-      cy: "0",
-      fill: "white",
-      r: "1.1",
-      stroke: "black",
-      strokeWidth: "0.6"
-    }), /*#__PURE__*/_react["default"].createElement("line", {
+    }, Math.round((0, _convertUnitsLite.convert)(distanceText).from('in').to(layer.unit) * 100) / 100, layer.unit === 'in' ? '"' : layer.unit)), /*#__PURE__*/_react["default"].createElement("line", {
       x1: "2",
       y1: "0",
       x2: (length - textLength) / 2 < 0 ? 0 : (length - textLength) / 2,
       y2: "0",
       style: STYLE
+    }), /*#__PURE__*/_react["default"].createElement("polygon", {
+      points: "1, 0, 4.5, -2, 4.5, 2 ",
+      style: STYLE
     }), /*#__PURE__*/_react["default"].createElement("line", {
       x1: (length + textLength) / 2 < 0 ? 0 : (length + textLength) / 2 < length ? (length + textLength) / 2 : length,
       y1: "0",
       x2: length,
       y2: "0",
       style: STYLE
-    }), /*#__PURE__*/_react["default"].createElement("circle", {
-      cx: length - 1,
-      cy: "0",
-      fill: "white",
-      r: "1.1",
-      stroke: "black",
-      strokeWidth: "0.6"
+    }), /*#__PURE__*/_react["default"].createElement("polygon", {
+      points: "".concat(length - 1, ", 0, ").concat(length - 4.5, ", 2, ").concat(length - 4.5, ", -2"),
+      style: STYLE
     }));
   }
 }

package/lib/components/viewer2d/viewer2d.js

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = Viewer2D;
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
@@ -134,7 +133,8 @@ function Viewer2D(_ref, _ref2) {
     width = _ref.width,
     height = _ref.height,
     setToolbar = _ref.setToolbar,
-    replaceCabinet = _ref.replaceCabinet;
+    replaceCabinet = _ref.replaceCabinet,
+    onInternalEvent = _ref.onInternalEvent;
   var viewer2DActions = _ref2.viewer2DActions,
     linesActions = _ref2.linesActions,
     holesActions = _ref2.holesActions,
@@ -401,6 +401,7 @@ function Viewer2D(_ref, _ref2) {
       vertices[dragVertexId].y = y;
     }
     var absAngle, lineAngle;
+    var angles = [];
     if (draggingLine.vertices[0] !== draggingLine.vertices[1]) {
       if ((0, _helper.isEmpty)(relatedLines) && mode !== 'DRAGGING_LINE') {
         endDrag.push(true);
@@ -419,6 +420,7 @@ function Viewer2D(_ref, _ref2) {
         absAngle = Math.abs(lineAngle);
         var tmpRelated = [];
         _export2.GeometryUtils.getRelatedLines(tmpRelated, line, vertices, allLines, draggingLine.id);
+        angles.push(lineAngle);
         for (var j = 0; j < tmpRelated.length; j++) {
           var tmpAngle = Math.abs(_export2.GeometryUtils.angleBetweenTwoLines(tmpRelated[j], line, vertices));
           if (tmpAngle < _constants.MIN_ANGLE_DISALLOW_DRAW_WALL || tmpAngle > 360 - _constants.MIN_ANGLE_DISALLOW_DRAW_WALL) {
@@ -436,7 +438,6 @@ function Viewer2D(_ref, _ref2) {
       vtx = x;
       vty = y;
     } else {
-      var rest = _constants.MIN_ANGLE_DISALLOW_DRAW_WALL - absAngle;
       // the origin point of rotation(snapping)
       var _originVerId = draggingLine.vertices.findIndex(function (vertice) {
         return vertice !== dragVertexId;
@@ -445,12 +446,22 @@ function Viewer2D(_ref, _ref2) {
       if (stepUnit) {
         var _ox = vertices[_originVerId].x;
         var _oy = vertices[_originVerId].y;
-        // determine the direction of rotation.
-        rest = lineAngle > 0 ? -rest : rest;
-        // rotate the current point to last point around the first point of drawing line.
-        var res = _export2.GeometryUtils.rotatePointAroundPoint(x, y, _ox, _oy, rest);
-        vtx = res.x;
-        vty = res.y;
+        angles.forEach(function (angle, index) {
+          if (Math.abs(angle) < _constants.MIN_ANGLE_DISALLOW_DRAW_WALL || Math.abs(angle) > 360 - _constants.MIN_ANGLE_DISALLOW_DRAW_WALL) {
+            var absVal = Math.abs(angle);
+            var rest = _constants.MIN_ANGLE_DISALLOW_DRAW_WALL - absVal;
+            if (absVal > 360 - _constants.MIN_ANGLE_DISALLOW_DRAW_WALL) {
+              absVal = 360 - absVal;
+              rest = -(_constants.MIN_ANGLE_DISALLOW_DRAW_WALL - absVal);
+            }
+            // determine the direction of rotation.
+            rest = angle > 0 ? -rest : rest;
+            // rotate the current point to last point around the first point of drawing line.
+            var res = _export2.GeometryUtils.rotatePointAroundPoint(x, y, _ox, _oy, rest);
+            vtx = res.x;
+            vty = res.y;
+          }
+        });
       }
     }
 
@@ -546,48 +557,18 @@ function Viewer2D(_ref, _ref2) {
       rectCenterPoint: [[point(mx, my), 180], [point(m1x, m1y), -90], [point(m2x, m2y), 0], [point(m3x, m3y), 90]]
     };
   };
-  var calcDistanceArray = function calcDistanceArray() {
-    var items = layer === null || layer === void 0 ? void 0 : layer.get('items');
-    if (!items) return;
-    items.forEach(function (item) {
-      if ((item === null || item === void 0 ? void 0 : item.selected) === true) {
-        var x = item.x,
-          y = item.y,
-          rotation = item.rotation,
-          id = item.id;
-        if (x == null || y == null) return;
-        var val = {
-          pos: {
-            x: x,
-            y: y
-          },
-          rotRad: rotation / 180 * Math.PI
-        };
-        var _width = getProperties(item, 'width');
-        var depth = getProperties(item, 'depth');
-        val.size = {
-          width: _width,
-          height: depth
-        };
-
-        // collect geometry
-        var _allLines = _export2.GeometryUtils.getAllLines(layer) || [];
-        var _allLineRects = _export2.GeometryUtils.buildRectFromLines(layer, _allLines) || [];
-        var _allItemRect = _export2.GeometryUtils.getAllItems(scene, catalog, _allLineRects) || {
-          others: []
-        };
-        var _allRect = [].concat((0, _toConsumableArray2["default"])(_allItemRect.others || []), (0, _toConsumableArray2["default"])(_allLineRects));
-
-        // current item
-        var curItemInfo = getCalcRectFromItem(val);
-        var pointArray = getDistant(x, y, val.rotRad, curItemInfo, _allRect);
-
-        // store results safely
-        if (Array.isArray(pointArray)) {
-          itemsActions.storeDistArray(layerID, id, pointArray);
-        }
-      }
-    });
+  var getConnectedLines = function getConnectedLines() {
+    var _state$getIn;
+    var vertices = state.getIn(['scene', 'layers', layerID, 'vertices']).toJS();
+    var lines = state.getIn(['scene', 'layers', layerID, 'lines']).toJS();
+    var lineID = state.getIn(['scene', 'layers', layerID, 'selected', 'lines']).first();
+    var drawingLine = (_state$getIn = state.getIn(['scene', 'layers', layerID, 'lines', lineID])) === null || _state$getIn === void 0 ? void 0 : _state$getIn.toJS();
+    // get the lines that have same points with drawing line.
+    if (!(0, _helper.isEmpty)(drawingLine)) {
+      var tlines = [];
+      getRelatedLines(tlines, drawingLine, vertices, lines);
+      setRelatedLines(tlines);
+    }
   };
   var onMouseMove = function onMouseMove(viewerEvent) {
     //workaround that allow imageful component to work
@@ -637,7 +618,6 @@ function Viewer2D(_ref, _ref2) {
         holesActions.updateDrawingHole(layerID, x, y);
         break;
       case constants.MODE_DRAWING_ITEM:
-        calcDistanceArray();
         var _layer = scene.layers.get(layerID);
         var flag = false;
         _layer.items.some(function (item) {
@@ -723,11 +703,11 @@ function Viewer2D(_ref, _ref2) {
         break;
       case constants.MODE_DRAGGING_VERTEX:
         var vertices = state.getIn(['scene', 'layers', layerID, 'vertices']).toJS();
+        getConnectedLines();
         var result = getEndPoint(vertices, x, y, 'DRAGGING_VERTEX');
         verticesActions.updateDraggingVertex(result.x, result.y, state.snapMask);
         break;
       case constants.MODE_DRAGGING_ITEM:
-        calcDistanceArray();
         prepareSnap();
         var _GeometryUtils$calcSn2 = _export2.GeometryUtils.calcSnap(allItemRect, allItemSnap, allLineRects, allLineSnap, allRect, x, y, allArea),
           nx = _GeometryUtils$calcSn2.nx,
@@ -811,35 +791,42 @@ function Viewer2D(_ref, _ref2) {
     if (mode === constants.MODE_IDLE) {
       var elementData = extractElementData(event.target);
       if (!elementData) return;
-      if (sCount < 2) switch (elementData.prototype) {
-        case 'lines':
-          if (elementData.selected) {
-            if (elementData.part === 'remove') break;else if (elementData.part === 'elevation') break;
-            linesActions.beginDraggingLine(elementData.layer, elementData.id, x, y, state.snapMask);
-          }
-          break;
-        case 'vertices':
-          verticesActions.beginDraggingVertex(elementData.layer, elementData.id, x, y, state.snapMask);
-          break;
-        case 'items':
-          setToolbar('');
-          current_sel_obj_id = elementData.id;
-          if (elementData.part === 'rotation-anchor') itemsActions.beginRotatingItem(elementData.layer, elementData.id, x, y);else if (elementData.part === 'remove') break;else if (elementData.part === 'duplicate') break;else if (elementData.part === 'warning_edit') break;else {
-            // closes the setting dialog
-            if (document.getElementById('setting_dialog')) {
-              document.getElementById('setting_dialog').style.display = 'none';
+      if (sCount < 2) {
+        switch (elementData.prototype) {
+          case 'lines':
+            if (elementData.selected) {
+              if (elementData.part === 'remove') break;else if (elementData.part === 'elevation') break;
+              linesActions.beginDraggingLine(elementData.layer, elementData.id, x, y, state.snapMask);
             }
-            itemsActions.selectItem(elementData.layer, elementData.id);
-            // projectActions.setMode(constants.MODE_DRAGGING_ITEM);
-            itemsActions.beginDraggingItem(elementData.layer, elementData.id, x, y);
-            replaceCabinet(false);
-          }
-          break;
-        case 'holes':
-          if (elementData.selected) holesActions.beginDraggingHole(elementData.layer, elementData.id, x, y);
-          break;
-        default:
-          break;
+            break;
+          case 'vertices':
+            verticesActions.beginDraggingVertex(elementData.layer, elementData.id, x, y, state.snapMask);
+            break;
+          case 'items':
+            setToolbar('');
+            current_sel_obj_id = elementData.id;
+            if (elementData.part === 'rotation-anchor') itemsActions.beginRotatingItem(elementData.layer, elementData.id, x, y);else if (elementData.part === 'remove') break;else if (elementData.part === 'duplicate') break;else if (elementData.part === 'warning_edit') break;else {
+              // closes the setting dialog
+              if (document.getElementById('setting_dialog')) {
+                document.getElementById('setting_dialog').style.display = 'none';
+              }
+              itemsActions.selectItem(elementData.layer, elementData.id);
+              // projectActions.setMode(constants.MODE_DRAGGING_ITEM);
+              itemsActions.beginDraggingItem(elementData.layer, elementData.id, x, y);
+              replaceCabinet(false);
+            }
+            break;
+          case 'holes':
+            if (elementData.selected) holesActions.beginDraggingHole(elementData.layer, elementData.id, x, y);
+            break;
+          default:
+            break;
+        }
+        var currentObject = state.getIn(['scene', 'layers', layerID, elementData.prototype, elementData.id]);
+        onInternalEvent === null || onInternalEvent === void 0 || onInternalEvent({
+          type: _constants.INTERNAL_EVENT_SELECT_ELEMENT,
+          value: currentObject.toJS()
+        });
       } else {
         sPoint.x = x;
         sPoint.y = y;
@@ -875,10 +862,47 @@ function Viewer2D(_ref, _ref2) {
       y = _mapCursorPosition3.y;
     var vertices = state.getIn(['scene', 'layers', layerID, 'vertices']).toJS();
     var lines = state.getIn(['scene', 'layers', layerID, 'lines']).toJS();
+    var elementData = extractElementData(event.target);
+    var selectedLayer = scene.getIn(['layers', layerID]);
+    var elementPrototype = null;
+    var elementID = null;
+    var internalType = '';
+    switch (mode) {
+      case constants.MODE_DRAWING_LINE:
+        elementPrototype = 'lines';
+        internalType = _constants.INTERNAL_EVENT_DRAW_ELEMENT;
+        break;
+      case constants.MODE_DRAWING_HOLE:
+        elementPrototype = 'holes';
+        internalType = _constants.INTERNAL_EVENT_DRAW_ELEMENT;
+        break;
+      case constants.MODE_DRAWING_ITEM:
+        elementPrototype = 'items';
+        internalType = _constants.INTERNAL_EVENT_DRAW_ELEMENT;
+        break;
+      case constants.MODE_DRAGGING_LINE:
+        elementPrototype = 'lines';
+        internalType = _constants.INTERNAL_EVENT_DRAG_ELEMENT;
+        break;
+      case constants.MODE_DRAGGING_HOLE:
+        elementPrototype = 'holes';
+        internalType = _constants.INTERNAL_EVENT_DRAG_ELEMENT;
+        break;
+      case constants.MODE_DRAGGING_ITEM:
+        elementPrototype = 'items';
+        internalType = _constants.INTERNAL_EVENT_DRAG_ELEMENT;
+        break;
+      case constants.MODE_DRAGGING_VERTEX:
+        elementPrototype = 'lines';
+        internalType = _constants.INTERNAL_EVENT_DRAG_ELEMENT;
+        break;
+      case constants.MODE_ROTATING_ITEM:
+        elementPrototype = 'items';
+        internalType = _constants.INTERNAL_EVENT_ROTATE_ELEMENT;
+        break;
+    }
     switch (mode) {
       case constants.MODE_IDLE:
-        var elementData = extractElementData(event.target);
-        var selectedLayer = scene.getIn(['layers', layerID]);
         switch (elementData ? elementData.prototype : 'none') {
           case 'areas':
             if (document.getElementById('setting_dialog')) {
@@ -899,10 +923,10 @@ function Viewer2D(_ref, _ref2) {
               projectActions.setMode(_mode);
               break;
             } else {
-              var _tlines = [];
-              var _drawingLine = state.getIn(['scene', 'layers', layerID, 'lines', elementData.id]).toJS();
-              getRelatedLines(_tlines, _drawingLine, vertices, lines);
-              setRelatedLines(_tlines);
+              var tlines = [];
+              var drawingLine = state.getIn(['scene', 'layers', layerID, 'lines', elementData.id]).toJS();
+              getRelatedLines(tlines, drawingLine, vertices, lines);
+              setRelatedLines(tlines);
               linesActions.selectLine(elementData.layer, elementData.id);
               break;
             }
@@ -1188,12 +1212,7 @@ function Viewer2D(_ref, _ref2) {
         // if (dx > dy) y = prevVertex.y
         // else x = prevVertex.x;
         setdrawStart(true);
-        var lineID = state.getIn(['scene', 'layers', layerID, 'selected', 'lines']).first();
-        var drawingLine = state.getIn(['scene', 'layers', layerID, 'lines', lineID]).toJS();
-        // get the lines that have same points with drawing line.
-        var tlines = [];
-        getRelatedLines(tlines, drawingLine, vertices, lines);
-        setRelatedLines(tlines);
+        getConnectedLines();
         var endInfor = getEndPoint(vertices, x, y, 'END_DRAWIN_LINE');
         linesActions.endDrawingLine(endInfor.x, endInfor.y, state.snapMask);
         linesActions.beginDrawingLine(layerID, endInfor.x, endInfor.y, state.snapMask);
@@ -1208,6 +1227,7 @@ function Viewer2D(_ref, _ref2) {
         linesActions.endDraggingLine(x, y, relatedLines, state.snapMask);
         break;
       case constants.MODE_DRAGGING_VERTEX:
+        getConnectedLines();
         var result = getEndPoint(vertices, x, y, 'DRAGGING_VERTEX');
         verticesActions.endDraggingVertex(result.x, result.y, state.snapMask);
         break;
@@ -1222,6 +1242,14 @@ function Viewer2D(_ref, _ref2) {
         itemsActions.endRotatingItem(x, y);
         break;
     }
+    if (elementPrototype) {
+      elementID = state.getIn(['scene', 'layers', layerID, 'selected', elementPrototype]).first();
+      var _currentObject = state.getIn(['scene', 'layers', layerID, elementPrototype, elementID]);
+      onInternalEvent === null || onInternalEvent === void 0 || onInternalEvent({
+        type: internalType,
+        value: _currentObject.toJS()
+      });
+    }
     event.stopPropagation();
   };
   var onChangeValue = function onChangeValue(value) {

package/lib/components/viewer3d/libs/mtl-loader.js

@@ -1,12 +1,18 @@
 "use strict";
 
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var THREE = _interopRequireWildcard(require("three"));
+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); }
 /**
  * Loads a Wavefront .mtl file specifying materials
  *
  * @author angelxuanchang
  */
 
-var THREE = window.THREE || require('three');
 var MTLLoader;
 MTLLoader = function MTLLoader(manager) {
   this.manager = manager !== undefined ? manager : THREE.DefaultLoadingManager;
@@ -356,4 +362,5 @@ MTLLoader.MaterialCreator.prototype = {
     return texture;
   }
 };
-module.exports = MTLLoader;
+var _default = exports["default"] = MTLLoader;
+module.exports = exports.default;

package/lib/components/viewer3d/libs/obj-loader.js

@@ -1,10 +1,16 @@
 "use strict";
 
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var THREE = _interopRequireWildcard(require("three"));
+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); }
 /**
  * @author mrdoob / http://mrdoob.com/
  */
 
-var THREE = window.THREE || require('three');
 var OBJLoader;
 OBJLoader = function OBJLoader(manager) {
   this.manager = manager !== undefined ? manager : THREE.DefaultLoadingManager;
@@ -461,4 +467,5 @@ OBJLoader.prototype = {
     return container;
   }
 };
-module.exports = OBJLoader;
+var _default = exports["default"] = OBJLoader;
+module.exports = exports.default;

package/lib/components/viewer3d/libs/orbit-controls.js

@@ -1,5 +1,12 @@
 "use strict";
 
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = OrbitControls;
+var THREE = _interopRequireWildcard(require("three"));
+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); }
 /**
  * @author qiao / https://github.com/qiao
  * @author mrdoob / http://mrdoob.com
@@ -15,9 +22,7 @@
 //    Zoom - middle mouse, or mousewheel / touch: two finger spread or squish
 //    Pan - right mouse, or arrow keys / touch: three finter swipe
 
-var THREE = window.THREE || require('three');
-var OrbitControls;
-module.exports = OrbitControls = function OrbitControls(object, domElement) {
+function OrbitControls(object, domElement) {
   this.object = object;
   this.domElement = domElement !== undefined ? domElement : document;
 
@@ -625,7 +630,7 @@ module.exports = OrbitControls = function OrbitControls(object, domElement) {
   // force an update at start
 
   this.update();
-};
+}
 OrbitControls.prototype = Object.create(THREE.EventDispatcher.prototype);
 OrbitControls.prototype.constructor = OrbitControls;
 Object.defineProperties(OrbitControls.prototype, {
@@ -697,4 +702,5 @@ Object.defineProperties(OrbitControls.prototype, {
       this.dampingFactor = value;
     }
   }
-});
+});
+module.exports = exports.default;

package/lib/components/viewer3d/libs/pointer-lock-controls.js

@@ -1,12 +1,18 @@
 "use strict";
 
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = PointerLockControls;
+var THREE = _interopRequireWildcard(require("three"));
+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); }
 /**
  * @author mrdoob / http://mrdoob.com/
+ * Converted to ESM
  */
 
-var THREE = window.THREE || require('three');
-var PointerLockControls;
-module.exports = PointerLockControls = function PointerLockControls(camera) {
+function PointerLockControls(camera) {
   var scope = this;
   camera.rotation.set(0, 0, 0);
   var pitchObject = new THREE.Object3D();
@@ -17,14 +23,14 @@ module.exports = PointerLockControls = function PointerLockControls(camera) {
   yawObject.position.y = 10;
   yawObject.add(pitchObject);
   var PI_2 = Math.PI / 2;
-  var onMouseMove = function onMouseMove(event) {
+  function onMouseMove(event) {
     if (scope.enabled === false) return;
     var movementX = event.movementX || event.mozMovementX || event.webkitMovementX || 0;
     var movementY = event.movementY || event.mozMovementY || event.webkitMovementY || 0;
     yawObject.rotation.y -= movementX * 0.002;
     pitchObject.rotation.x -= movementY * 0.002;
     pitchObject.rotation.x = Math.max(-PI_2, Math.min(PI_2, pitchObject.rotation.x));
-  };
+  }
   this.dispose = function () {
     document.removeEventListener('mousemove', onMouseMove, false);
   };
@@ -35,7 +41,6 @@ module.exports = PointerLockControls = function PointerLockControls(camera) {
   };
   this.getDirection = function () {
     // assumes the camera itself is not rotated
-
     var direction = new THREE.Vector3(0, 0, -1);
     var rotation = new THREE.Euler(0, 0, 0, 'YXZ');
     return function (v) {
@@ -44,4 +49,5 @@ module.exports = PointerLockControls = function PointerLockControls(camera) {
       return v;
     };
   }();
-};
+}
+module.exports = exports.default;