@crystaldesign/web-planner-logic 25.13.0-beta.45 → 25.13.0-beta.47

package/build/esm/{DivaBoxPlanner-b1099e12.js → DivaBoxPlanner-57e531a6.js}

@@ -3,10 +3,10 @@ import _classCallCheck from '@babel/runtime/helpers/classCallCheck';
 import _createClass from '@babel/runtime/helpers/createClass';
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _regeneratorRuntime from '@babel/runtime/regenerator';
-import { c as Vector2, V as Vector3, P as PlannerElementData, B as BoundingBox } from './index-d7b8a9a3.js';
+import { c as Vector2, V as Vector3, P as PlannerElementData, B as BoundingBox } from './index-fea1582c.js';
 import DivaUtils, { DivaError, md5 } from '@crystaldesign/diva-utils';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
-import { d as dockingPointHandlerInst, h as handler2D } from './PlannerHandler2D-710fe586.js';
+import { d as dockingPointHandlerInst, h as handler2D } from './PlannerHandler2D-0449a94e.js';
 import '@babel/runtime/helpers/slicedToArray';
 import '@babel/runtime/helpers/objectWithoutProperties';
 import 'axios';
@@ -2219,6 +2219,7 @@ var ConstructionRulesHandler = /*#__PURE__*/function () {
         //Setze alle Fuße zurück
         //DEPRECTED this.setOptionValue(allElementIds[i], "OPTFAF_LINKS", "OPVOHNE_FAF", optionHandler);
         //DEPRECTED this.setOptionValue(allElementIds[i], "OPTFAF_RECHTS", "OPVOHNE_FAF", optionHandler);
+
         this.setOptionValue(allElementIds[i], 'OPTFAF_L_V', 'OPVOHNE_FAF', optionHandler);
         this.setOptionValue(allElementIds[i], 'OPTFAF_L_H', 'OPVOHNE_FAF', optionHandler);
         this.setOptionValue(allElementIds[i], 'OPTFAF_R_V', 'OPVOHNE_FAF', optionHandler);
@@ -2646,6 +2647,15 @@ var ConstructionRulesHandler = /*#__PURE__*/function () {
         _loop();
       }
     }
+  }, {
+    key: "correctFoot",
+    value: function correctFoot(boxPlannerGrid, optionHandler) {
+      var _this3 = this;
+      var elements = boxPlannerGrid.getAllElementsInFrontGrid();
+      elements.forEach(function (e) {
+        if (boxPlannerGrid.getElementHasBottomElement(e.ElementId)) _this3.setOptionValue(e.ElementId, 'OPTFUSS_SYS', 'OPVOHNE', optionHandler);
+      });
+    }
 
     /*
      *  This function corrects Options that are based on the total planning dimensions
@@ -2653,28 +2663,28 @@ var ConstructionRulesHandler = /*#__PURE__*/function () {
   }, {
     key: "correctOptionsInfluencedByDimensions",
     value: function correctOptionsInfluencedByDimensions(boxPlannerGrid, optionHandler) {
-      var _this3 = this;
+      var _this4 = this;
       if (!this.constructionRules.optionsInfluencedByDimensions) return;
       var boxPlannerSize = boxPlannerGrid.getSizeOfWholeSet(false);
       var allElements = boxPlannerGrid.getAllElementsInFrontGrid();
       this.constructionRules.optionsInfluencedByDimensions.forEach(function (dimRule) {
         if (Array.isArray(dimRule)) {
           if (dimRule.every(function (rule) {
-            return _this3.validateDimensionRule(rule, boxPlannerSize);
+            return _this4.validateDimensionRule(rule, boxPlannerSize);
           })) dimRule.forEach(function (rule) {
             return allElements.forEach(function (element) {
-              return _this3.setOptionDoShow(element.ElementId, rule.option, optionHandler);
+              return _this4.setOptionDoShow(element.ElementId, rule.option, optionHandler);
             });
           });else dimRule.forEach(function (rule) {
             return allElements.forEach(function (element) {
-              return _this3.setOptionDoHide(element.ElementId, rule.option, optionHandler);
+              return _this4.setOptionDoHide(element.ElementId, rule.option, optionHandler);
             });
           });
         } else {
-          if (_this3.validateDimensionRule(dimRule, boxPlannerSize)) allElements.forEach(function (element) {
-            return _this3.setOptionDoShow(element.ElementId, dimRule.option, optionHandler);
+          if (_this4.validateDimensionRule(dimRule, boxPlannerSize)) allElements.forEach(function (element) {
+            return _this4.setOptionDoShow(element.ElementId, dimRule.option, optionHandler);
           });else allElements.forEach(function (element) {
-            return _this3.setOptionDoHide(element.ElementId, dimRule.option, optionHandler);
+            return _this4.setOptionDoHide(element.ElementId, dimRule.option, optionHandler);
           });
         }
       });
@@ -2739,7 +2749,7 @@ var ConstructionRulesHandler = /*#__PURE__*/function () {
   }, {
     key: "correctCoverPlate",
     value: function correctCoverPlate(coverPlateRule, boxPlannerGrid, optionHandler) {
-      var _this4 = this;
+      var _this5 = this;
       if (coverPlateRule.onHighestElementsOnly) return; // System4 not handled by this logic yet
 
       var elementsPerSeries = boxPlannerGrid.getHighestElementsPerSeries(!!coverPlateRule.onBottom);
@@ -2752,9 +2762,9 @@ var ConstructionRulesHandler = /*#__PURE__*/function () {
           var _element$Width2;
           seriesWidth += (_element$Width2 = element.Width) !== null && _element$Width2 !== void 0 ? _element$Width2 : 0;
           boxPlannerGrid.getAllElementsDown(element.ElementId).elements.forEach(function (e) {
-            return _this4.setOptionValue(e, coverPlateRule.optABD, 'OPVOHNE', optionHandler);
+            return _this5.setOptionValue(e, coverPlateRule.optABD, 'OPVOHNE', optionHandler);
           });
-          _this4.setOptionValue(element.ElementId, coverPlateRule.optABD, 'OPVOHNE', optionHandler);
+          _this5.setOptionValue(element.ElementId, coverPlateRule.optABD, 'OPVOHNE', optionHandler);
         });
         var firstUncoveredElement = serie[0];
         var _loop2 = function _loop2() {
@@ -2773,7 +2783,7 @@ var ConstructionRulesHandler = /*#__PURE__*/function () {
             if (!opv) return {
               v: void 0
             };
-            _this4.setOptionValue(firstUncoveredElement.ElementId, coverPlateRule.optABD, opv.plateOpv, optionHandler);
+            _this5.setOptionValue(firstUncoveredElement.ElementId, coverPlateRule.optABD, opv.plateOpv, optionHandler);
             var helperWidth = 0;
             firstUncoveredElement = serie.find(function (e) {
               var _e$Width;
@@ -3187,6 +3197,7 @@ var ConstructionRulesHandler = /*#__PURE__*/function () {
                   }
                 }
               }
+              this.correctFoot(boxPlannerGrid, optionHandler);
               this.correctLadder(boxPlannerGrid, optionHandler);
               this.correctOptionsInfluencedByDimensions(boxPlannerGrid, optionHandler);
               this.correctOverHangingElement((_targetElements = targetElements) === null || _targetElements === void 0 ? void 0 : _targetElements[0], boxPlannerGrid, optionHandler, changedOPTs);
@@ -3198,13 +3209,13 @@ var ConstructionRulesHandler = /*#__PURE__*/function () {
                 }
               }
               doChangeRetailArticleNumbers = this.doChangeRetailArticleNumbers(boxPlannerGrid, optionHandler);
-              _context.next = 28;
+              _context.next = 29;
               return this.updateCfgValuesByPlanner(optionHandler, undefined, this.constructionRules.partlistRules.bundleRules, doChangeRetailArticleNumbers);
-            case 28:
+            case 29:
               LOG$2.debug('BoxPlanner updateOptionLogic - Duration after setting Option Values of all Articles: ' + (new Date().getTime() - startTime));
               LOG$2.debug('BoxPlanner updateOptionLogic - Duration after setting updating configurator: ' + (new Date().getTime() - startTime));
               return _context.abrupt("return", resultMessage);
-            case 31:
+            case 32:
             case "end":
               return _context.stop();
           }
@@ -3414,11 +3425,12 @@ var BoxPlannerGrid = /*#__PURE__*/function () {
      */
   }, {
     key: "getGridColumnWidth",
-    value: function getGridColumnWidth(columnIndex) {
+    value: function getGridColumnWidth(x) {
       var frontGrid = this.generalPlanningState.grids[0].matrix;
-      for (var i = 0; i < frontGrid[columnIndex].length; i++) {
+      for (var y = 0; x < frontGrid[y].length; x++) {
         var _plannedElement$size$, _plannedElement;
-        if (frontGrid[columnIndex][i]) return (_plannedElement$size$ = (_plannedElement = frontGrid[columnIndex][i].plannedElement) === null || _plannedElement === void 0 ? void 0 : _plannedElement.size.width) !== null && _plannedElement$size$ !== void 0 ? _plannedElement$size$ : 0;
+        var cell = frontGrid[x][y];
+        if (cell) return (_plannedElement$size$ = (_plannedElement = cell.plannedElement) === null || _plannedElement === void 0 ? void 0 : _plannedElement.size.width) !== null && _plannedElement$size$ !== void 0 ? _plannedElement$size$ : 0;
       }
       return 0;
     }
@@ -3430,15 +3442,18 @@ var BoxPlannerGrid = /*#__PURE__*/function () {
      */
   }, {
     key: "getGridColumnHeight",
-    value: function getGridColumnHeight(columnIdex) {
+    value: function getGridColumnHeight(x) {
       var height = 0;
       var firstElementFound = false;
       var frontGrid = this.generalPlanningState.grids[0].matrix;
-      if (frontGrid.length > columnIdex) {
-        var allCellsInCol = frontGrid[columnIdex];
-        for (var i = allCellsInCol.length; i >= 0; i--) {
-          if (!firstElementFound && allCellsInCol[i]) firstElementFound = true;
-          if (firstElementFound) height += allCellsInCol[i] == undefined ? 0 : allCellsInCol[i].plannedElement.size.height;
+      if (frontGrid.length > x) {
+        var column = frontGrid[x];
+        for (var y = column.length - 1; y >= 0; y--) {
+          var _plannedElement$size$2, _plannedElement2;
+          var cell = column[y];
+          if (!firstElementFound && cell) firstElementFound = true;
+          if (firstElementFound) height += (_plannedElement$size$2 = (_plannedElement2 = cell.plannedElement) === null || _plannedElement2 === void 0 ? void 0 : _plannedElement2.size.height) !== null && _plannedElement$size$2 !== void 0 ? _plannedElement$size$2 : 0;
+          y = cell.plannedElement ? cell.plannedElement.area.fromY - 1 : y - 1;
         }
       }
       return height;
@@ -3995,7 +4010,7 @@ var BoxPlannerGrid = /*#__PURE__*/function () {
   }, {
     key: "getNeighborElements",
     value: function getNeighborElements(elementId, dir) {
-      var _curGrid$area$toX, _rightNeighbour$plann, _curGrid2, _leftNeightbour$plann, _curGrid$area$fromX, _topNeighbour$planned, _curGrid$area$fromX2, _downNeighbour$planne;
+      var _curGrid$area$toX, _curGrid$area$toX2, _curGrid2, _curGrid3, _curGrid$area$fromX, _topNeighbour$planned, _curGrid$area$fromX2, _downNeighbour$planne;
       var res = this.getCellsInGridByElementId(elementId);
       var curGrid = res.backside ? this.generalPlanningState.grids[1].matrix : this.generalPlanningState.grids[0].matrix;
       var result = [];
@@ -4003,14 +4018,15 @@ var BoxPlannerGrid = /*#__PURE__*/function () {
       if (!plannedElement) return result;
       switch (dir) {
         case 'RIGHT':
-          var rightNeighbour = (_curGrid$area$toX = curGrid[plannedElement.area.toX]) === null || _curGrid$area$toX === void 0 ? void 0 : _curGrid$area$toX[plannedElement.area.fromY];
-          var rElementId = rightNeighbour === null || rightNeighbour === void 0 || (_rightNeighbour$plann = rightNeighbour.plannedElement) === null || _rightNeighbour$plann === void 0 ? void 0 : _rightNeighbour$plann.elementId;
-          if (rElementId) result.push(this.plannerElements.get(rElementId));
+          // only clean neighbours (for docking) add property if you also need clean ones
+          var rLowestNeighbour = (_curGrid$area$toX = curGrid[plannedElement.area.toX]) === null || _curGrid$area$toX === void 0 || (_curGrid$area$toX = _curGrid$area$toX[plannedElement.area.fromY]) === null || _curGrid$area$toX === void 0 || (_curGrid$area$toX = _curGrid$area$toX.plannedElement) === null || _curGrid$area$toX === void 0 ? void 0 : _curGrid$area$toX.elementId;
+          var rHighestNeighbour = (_curGrid$area$toX2 = curGrid[plannedElement.area.toX]) === null || _curGrid$area$toX2 === void 0 || (_curGrid$area$toX2 = _curGrid$area$toX2[plannedElement.area.toY - 1]) === null || _curGrid$area$toX2 === void 0 || (_curGrid$area$toX2 = _curGrid$area$toX2.plannedElement) === null || _curGrid$area$toX2 === void 0 ? void 0 : _curGrid$area$toX2.elementId;
+          if (rLowestNeighbour == rHighestNeighbour && rLowestNeighbour) result.push(this.plannerElements.get(rLowestNeighbour));
           break;
         case 'LEFT':
-          var leftNeightbour = (_curGrid2 = curGrid[plannedElement.area.fromX - 1]) === null || _curGrid2 === void 0 ? void 0 : _curGrid2[plannedElement.area.fromY];
-          var lElementId = leftNeightbour === null || leftNeightbour === void 0 || (_leftNeightbour$plann = leftNeightbour.plannedElement) === null || _leftNeightbour$plann === void 0 ? void 0 : _leftNeightbour$plann.elementId;
-          if (lElementId) result.push(this.plannerElements.get(lElementId));
+          var lowestNeighbour = (_curGrid2 = curGrid[plannedElement.area.fromX - 1]) === null || _curGrid2 === void 0 || (_curGrid2 = _curGrid2[plannedElement.area.fromY]) === null || _curGrid2 === void 0 || (_curGrid2 = _curGrid2.plannedElement) === null || _curGrid2 === void 0 ? void 0 : _curGrid2.elementId;
+          var highestNeighbour = (_curGrid3 = curGrid[plannedElement.area.fromX - 1]) === null || _curGrid3 === void 0 || (_curGrid3 = _curGrid3[plannedElement.area.toY - 1]) === null || _curGrid3 === void 0 || (_curGrid3 = _curGrid3.plannedElement) === null || _curGrid3 === void 0 ? void 0 : _curGrid3.elementId;
+          if (lowestNeighbour == highestNeighbour && lowestNeighbour) result.push(this.plannerElements.get(lowestNeighbour));
           break;
         case 'TOP':
           var topNeighbour = (_curGrid$area$fromX = curGrid[plannedElement.area.fromX]) === null || _curGrid$area$fromX === void 0 ? void 0 : _curGrid$area$fromX[plannedElement.area.toY];
@@ -4083,24 +4099,28 @@ var BoxPlannerGrid = /*#__PURE__*/function () {
       var height = 0;
       var checkedElementIds = [];
       var frontGrid = this.generalPlanningState.grids[0].matrix;
-      for (var i = 0; i < frontGrid.length; i++) {
+      for (var x = 0; x < frontGrid.length;) {
+        var _row$0$plannedElement, _row$0$plannedElement2;
         var curHeight = 0;
-        for (var j = 0; j < frontGrid[i].length; j++) {
-          var _cell4;
-          var cell = frontGrid[i][j];
+        var row = frontGrid[x];
+        for (var y = 0; y < row.length;) {
+          var _cell4, _cell$plannedElement$, _cell$plannedElement8;
+          var cell = row[y];
           var elementId = (_cell4 = cell) === null || _cell4 === void 0 || (_cell4 = _cell4.plannedElement) === null || _cell4 === void 0 ? void 0 : _cell4.elementId;
           if (elementId && cell && checkedElementIds.indexOf(elementId) == -1) {
             curHeight += this.plannerElements.get(elementId).getHeight();
-            if (i == 0 && j == 0) depth = this.plannerElements.get(elementId).getDepth();
+            if (x == 0 && y == 0) depth = this.plannerElements.get(elementId).getDepth();
           }
+          y = (_cell$plannedElement$ = (_cell$plannedElement8 = cell.plannedElement) === null || _cell$plannedElement8 === void 0 ? void 0 : _cell$plannedElement8.area.toY) !== null && _cell$plannedElement$ !== void 0 ? _cell$plannedElement$ : y + 1;
         }
         if (curHeight > height) height = curHeight;
-        var curWidth = this.getGridColumnWidth(i);
-        if (correctSizeSystem4 && i > 0) {
+        var curWidth = this.getGridColumnWidth(x);
+        if (correctSizeSystem4 && x > 0) {
           //Correct width
           if (curWidth == 77.9) curWidth = 75;else if (curWidth == 40.4) curWidth = 37.5;else if (curWidth == 21.7) curWidth = 18.75;
         }
         width += curWidth;
+        x = (_row$0$plannedElement = (_row$0$plannedElement2 = row[0].plannedElement) === null || _row$0$plannedElement2 === void 0 ? void 0 : _row$0$plannedElement2.area.toX) !== null && _row$0$plannedElement !== void 0 ? _row$0$plannedElement : x + 1;
       }
       if (this.hasActiveBackside) depth *= 2;
       return new Vector3(width, height, depth);
@@ -4125,7 +4145,7 @@ var BoxPlannerGrid = /*#__PURE__*/function () {
           height += element.size.height;
           y = element.area.toY;
         }
-        if (height == lastHeight || onBottom) {
+        if (Math.round(height) == Math.round(lastHeight) || onBottom) {
           if (!result[result.length - 1]) result.push([]);
           result[result.length - 1].push(this.getPlannerElementAtGridPos(x, row.length - 1, false));
         } else {
@@ -4290,7 +4310,7 @@ var BoxPlannerGrid = /*#__PURE__*/function () {
         x: element.area.toX - 1 + relativeCopyIndex.x,
         y: element.area.fromY + relativeCopyIndex.y
       };
-      if (relativeCopyIndex.x < 0) absoluteCopyIndex.x = elementToCopyPos.cells[0].plannedElement.area.fromX;
+      if (relativeCopyIndex.x < 0) absoluteCopyIndex.x = elementToCopyPos.cells[0].plannedElement.area.fromX - 1;
 
       // check if the side we copy to is already blocked
       // if blocked and we copy to the left the grid get's shifted so the copy
@@ -4376,6 +4396,25 @@ var BoxPlannerGrid = /*#__PURE__*/function () {
       this.plannerElements.set(newElement.getElementId(), newElement);
       if (fromBackmodul) this.hasActiveBackside = true;
     }
+    /**
+     *  move element
+     * @param elementIDToMove
+     * @param copyInfo
+     */
+  }, {
+    key: "moveElementAsCopy",
+    value: function moveElementAsCopy(elementId, absoluteIndex) {
+      var elementData = this.plannerElements.get(elementId);
+      if (!elementData) return;
+      this.deleteElement(elementId, "STD");
+      var cells = this.createNewCells(elementData, absoluteIndex.x, absoluteIndex.y, false);
+      var curGrid = this.generalPlanningState.grids[0].matrix;
+      for (var i = 0; i < cells.length; i++) {
+        if (!curGrid[cells[i].index.x]) curGrid[cells[i].index.x] = [];
+        curGrid[cells[i].index.x][cells[i].index.y] = cells[i];
+      }
+      this.plannerElements.set(elementId, elementData);
+    }
 
     /**
      * Assume that the grid is already prepared and there is enough empty space for the new element.
@@ -4395,9 +4434,10 @@ var BoxPlannerGrid = /*#__PURE__*/function () {
       if (copyIndex.x > 0) cellIndex.x = area.toX - 1 + copyIndex.x;else if (copyIndex.x < 0) cellIndex.x = area.fromX - (area.toX - area.fromX);else if (copyIndex.y > 0) cellIndex.y = area.toY - 1 + copyIndex.y;
       var backsideForCopy = copyIndex.z == -1 || curPos.backside == true;
       if (cellIndex.x < 0) cellIndex.x = 0; // can't plan to negative space see prepareGridForColCopy
-
-      var cells = this.createNewCells(newElement, cellIndex.x, cellIndex.y, backsideForCopy);
       var curGrid = backsideForCopy ? this.generalPlanningState.grids[1].matrix : this.generalPlanningState.grids[0].matrix;
+      // can't float need to dock
+      if (curGrid[cellIndex.x].length < cellIndex.y) cellIndex.y = curGrid[cellIndex.x].length;
+      var cells = this.createNewCells(newElement, cellIndex.x, cellIndex.y, backsideForCopy);
       for (var i = 0; i < cells.length; i++) {
         if (!curGrid[cells[i].index.x]) curGrid[cells[i].index.x] = [];
         curGrid[cells[i].index.x][cells[i].index.y] = cells[i];
@@ -4449,8 +4489,8 @@ var BoxPlannerGrid = /*#__PURE__*/function () {
         var area = cell.plannedElement.area;
         if (newGrid.find(function (x) {
           return x.find(function (y) {
-            var _y$plannedElement3, _cell$plannedElement8;
-            return ((_y$plannedElement3 = y.plannedElement) === null || _y$plannedElement3 === void 0 ? void 0 : _y$plannedElement3.elementId) == ((_cell$plannedElement8 = cell.plannedElement) === null || _cell$plannedElement8 === void 0 ? void 0 : _cell$plannedElement8.elementId);
+            var _y$plannedElement3, _cell$plannedElement9;
+            return ((_y$plannedElement3 = y.plannedElement) === null || _y$plannedElement3 === void 0 ? void 0 : _y$plannedElement3.elementId) == ((_cell$plannedElement9 = cell.plannedElement) === null || _cell$plannedElement9 === void 0 ? void 0 : _cell$plannedElement9.elementId);
           });
         })) return;
         for (var x = area.fromX; x < area.toX; x++) {
@@ -4527,15 +4567,17 @@ var BoxPlannerGrid = /*#__PURE__*/function () {
       var backGrid = (_this$generalPlanning6 = (_this$generalPlanning7 = this.generalPlanningState.grids[1]) === null || _this$generalPlanning7 === void 0 ? void 0 : _this$generalPlanning7.matrix) !== null && _this$generalPlanning6 !== void 0 ? _this$generalPlanning6 : [];
       for (var x = 0; x < frontGrid.length; x++) {
         for (var y = 0; y < frontGrid[x].length; y++) {
-          var _cell$plannedElement9;
+          var _cell$plannedElement10;
           var cell = frontGrid[x][y];
-          var elementId = cell === null || cell === void 0 || (_cell$plannedElement9 = cell.plannedElement) === null || _cell$plannedElement9 === void 0 ? void 0 : _cell$plannedElement9.elementId;
+          var elementId = cell === null || cell === void 0 || (_cell$plannedElement10 = cell.plannedElement) === null || _cell$plannedElement10 === void 0 ? void 0 : _cell$plannedElement10.elementId;
           if (elementId && allCheckedElementIds.indexOf(elementId) == -1) {
             var element = this.plannerElements.get(elementId);
             allCheckedElementIds.push(elementId);
             var topNeighbors = this.getNeighborElements(elementId, 'TOP');
             var rightNeighbors = this.getNeighborElements(elementId, 'RIGHT');
+            var leftNeighbors = this.getNeighborElements(elementId, 'LEFT');
             if (topNeighbors.length > 0) dockingPointHandlerInst.tryDockElement(element, 'AVO', [topNeighbors[0]]);
+            if (leftNeighbors.length > 0) dockingPointHandlerInst.tryDockElement(element, 'AVL', [leftNeighbors[0]]);
             if (rightNeighbors.length > 0) dockingPointHandlerInst.tryDockElement(element, 'AVR', [rightNeighbors[0]]);
             element.PosNr = posNr;
             posNr++;
@@ -4955,16 +4997,16 @@ var BoxPlannerGrid = /*#__PURE__*/function () {
       } else {
         var distToOriginX = 0;
         for (var i = 0; i < cellsStartColIndex; i++) {
-          var _plannedElement$size$2, _plannedElement2;
-          distToOriginX += (_plannedElement$size$2 = (_plannedElement2 = curGrid[i][0].plannedElement) === null || _plannedElement2 === void 0 ? void 0 : _plannedElement2.size.width) !== null && _plannedElement$size$2 !== void 0 ? _plannedElement$size$2 : 0;
+          var _plannedElement$size$3, _plannedElement3;
+          distToOriginX += (_plannedElement$size$3 = (_plannedElement3 = curGrid[i][0].plannedElement) === null || _plannedElement3 === void 0 ? void 0 : _plannedElement3.size.width) !== null && _plannedElement$size$3 !== void 0 ? _plannedElement$size$3 : 0;
         }
         if (cellsStartColIndex < 0) {
           distToOriginX = -element.getWidth();
         }
         var distToOriginY = 0;
         for (var i = 0; i < cellsStartRowIndex; i++) {
-          var _plannedElement$size$3, _plannedElement3;
-          distToOriginY += (_plannedElement$size$3 = (_plannedElement3 = curGrid[cellsStartColIndex][i].plannedElement) === null || _plannedElement3 === void 0 ? void 0 : _plannedElement3.size.width) !== null && _plannedElement$size$3 !== void 0 ? _plannedElement$size$3 : 0;
+          var _plannedElement$size$4, _plannedElement4;
+          distToOriginY += (_plannedElement$size$4 = (_plannedElement4 = curGrid[cellsStartColIndex][i].plannedElement) === null || _plannedElement4 === void 0 ? void 0 : _plannedElement4.size.width) !== null && _plannedElement$size$4 !== void 0 ? _plannedElement$size$4 : 0;
         }
         elementLocation.startIndexWorldPos = new Vector2(distToOriginX, distToOriginY);
       }
@@ -5449,6 +5491,28 @@ var DivaBoxPlanner = /*#__PURE__*/function () {
       }
       return extendPlanner;
     }()
+  }, {
+    key: "movePlannerElement",
+    value: function () {
+      var _movePlannerElement = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4(elementId, absoluteIndex) {
+        return _regeneratorRuntime.wrap(function _callee4$(_context4) {
+          while (1) switch (_context4.prev = _context4.next) {
+            case 0:
+              this.boxPlannerGrid.moveElementAsCopy(elementId, absoluteIndex);
+              this.boxPlannerGrid.updateWorldPosOfElements();
+              _context4.next = 4;
+              return this.constructionRulesHandler.updateOptionLogicBoxPlanner(this.boxPlannerGrid, "", [elementId]);
+            case 4:
+            case "end":
+              return _context4.stop();
+          }
+        }, _callee4, this);
+      }));
+      function movePlannerElement(_x6, _x7) {
+        return _movePlannerElement.apply(this, arguments);
+      }
+      return movePlannerElement;
+    }()
     /**
      * Handles copyying the planner Element. it can happen that also other planner elements are influenced
      * @param articleCopyRelation Holds the relation - which element with elementID is copyed and has a new Article. ElementToCopyID -> BasketID of new Article
@@ -5457,18 +5521,18 @@ var DivaBoxPlanner = /*#__PURE__*/function () {
   }, {
     key: "copyPlannerElement",
     value: (function () {
-      var _copyPlannerElement = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee4(articleCopyRelation, copyInfo) {
+      var _copyPlannerElement = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee5(articleCopyRelation, copyInfo) {
         var _this = this;
         var gridIsPrepared, plannerElementsToLoadSVG, that, i, cellPos, allDPs, j;
-        return _regeneratorRuntime.wrap(function _callee4$(_context4) {
-          while (1) switch (_context4.prev = _context4.next) {
+        return _regeneratorRuntime.wrap(function _callee5$(_context5) {
+          while (1) switch (_context5.prev = _context5.next) {
             case 0:
               gridIsPrepared = false;
               if (copyInfo) {
-                _context4.next = 3;
+                _context5.next = 3;
                 break;
               }
-              return _context4.abrupt("return");
+              return _context5.abrupt("return");
             case 3:
               if (copyInfo.copyType == 'STD') copyInfo.targetElements = [];
               plannerElementsToLoadSVG = [];
@@ -5498,10 +5562,10 @@ var DivaBoxPlanner = /*#__PURE__*/function () {
               i = 0;
             case 8:
               if (!(i < plannerElementsToLoadSVG.length)) {
-                _context4.next = 15;
+                _context5.next = 15;
                 break;
               }
-              _context4.next = 11;
+              _context5.next = 11;
               return handler2D.loadSVG(plannerElementsToLoadSVG[i], this.set);
             case 11:
               //Check if we have to prevent to build even higher in this col
@@ -5517,19 +5581,19 @@ var DivaBoxPlanner = /*#__PURE__*/function () {
               }
             case 12:
               i++;
-              _context4.next = 8;
+              _context5.next = 8;
               break;
             case 15:
               this.boxPlannerGrid.updateWorldPosOfElements();
-              _context4.next = 18;
+              _context5.next = 18;
               return this.constructionRulesHandler.updateOptionLogicBoxPlanner(this.boxPlannerGrid, copyInfo.changedOPT, copyInfo.targetElements);
             case 18:
             case "end":
-              return _context4.stop();
+              return _context5.stop();
           }
-        }, _callee4, this);
+        }, _callee5, this);
       }));
-      function copyPlannerElement(_x6, _x7) {
+      function copyPlannerElement(_x8, _x9) {
         return _copyPlannerElement.apply(this, arguments);
       }
       return copyPlannerElement;
@@ -5635,10 +5699,10 @@ var DivaBoxPlanner = /*#__PURE__*/function () {
   }, {
     key: "deletePlannerElement",
     value: (function () {
-      var _deletePlannerElement = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee5(elementId, autoCorrectAVL_AVR, deletionType) {
+      var _deletePlannerElement = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee6(elementId, autoCorrectAVL_AVR, deletionType) {
         var cellPos, newSelectedPos, doUpdateWholeLogic, _this$boxPlannerGrid$;
-        return _regeneratorRuntime.wrap(function _callee5$(_context5) {
-          while (1) switch (_context5.prev = _context5.next) {
+        return _regeneratorRuntime.wrap(function _callee6$(_context6) {
+          while (1) switch (_context6.prev = _context6.next) {
             case 0:
               //TODO ÜBERLEGEN WIE MAN DAS JETZT RICHTET: BESSER WÄRE ES MAN GIBT DAS NÄCHSTE ZU SELECTIERENDE ELEMENT ID ZURÜCK
               //var pos = this.boxPlannerGrid.getIndexInGridByElementId(elementId);
@@ -5672,29 +5736,29 @@ var DivaBoxPlanner = /*#__PURE__*/function () {
                 } else if (deletionType == 'STD_DONTUPDATE') doUpdateWholeLogic = false;
               }
               if (!doUpdateWholeLogic) {
-                _context5.next = 11;
+                _context6.next = 11;
                 break;
               }
               this.boxPlannerGrid.updateWorldPosOfElements();
-              _context5.next = 11;
+              _context6.next = 11;
               return this.constructionRulesHandler.updateOptionLogicBoxPlanner(this.boxPlannerGrid);
             case 11:
               if (!this.boxPlannerGrid.getPlannerElementAtGridPos(newSelectedPos.col, newSelectedPos.row, newSelectedPos.backside)) {
-                _context5.next = 13;
+                _context6.next = 13;
                 break;
               }
-              return _context5.abrupt("return", {
+              return _context6.abrupt("return", {
                 newElementToSelect: (_this$boxPlannerGrid$ = this.boxPlannerGrid.getPlannerElementAtGridPos(newSelectedPos.col, newSelectedPos.row, newSelectedPos.backside)) === null || _this$boxPlannerGrid$ === void 0 ? void 0 : _this$boxPlannerGrid$.getElementId()
               });
             case 13:
-              return _context5.abrupt("return", {});
+              return _context6.abrupt("return", {});
             case 14:
             case "end":
-              return _context5.stop();
+              return _context6.stop();
           }
-        }, _callee5, this);
+        }, _callee6, this);
       }));
-      function deletePlannerElement(_x8, _x9, _x10) {
+      function deletePlannerElement(_x10, _x11, _x12) {
         return _deletePlannerElement.apply(this, arguments);
       }
       return deletePlannerElement;
@@ -5774,11 +5838,11 @@ var DivaBoxPlanner = /*#__PURE__*/function () {
   }, {
     key: "updatePlanner",
     value: (function () {
-      var _updatePlanner = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee6(changedOPT, targetElements) {
+      var _updatePlanner = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee7(changedOPT, targetElements) {
         var _this2 = this;
         var message, cellPos, elemToCheck, copyIndex, allElementsToCopy, _allElementsToCopy, allElementsInBackGrid, _allElementsInBackGrid, _message;
-        return _regeneratorRuntime.wrap(function _callee6$(_context6) {
-          while (1) switch (_context6.prev = _context6.next) {
+        return _regeneratorRuntime.wrap(function _callee7$(_context7) {
+          while (1) switch (_context7.prev = _context7.next) {
             case 0:
               LOG.debug('BoxPlanner - configurationHasChanged ' + changedOPT);
               targetElements === null || targetElements === void 0 || targetElements.forEach(function (e) {
@@ -5786,28 +5850,28 @@ var DivaBoxPlanner = /*#__PURE__*/function () {
                 return _this2.boxPlannerGrid.updateGridElementDimensions(e, (_this2$set$getArticle = _this2.set.getArticleByElementId(e)) === null || _this2$set$getArticle === void 0 ? void 0 : _this2$set$getArticle.plannerData);
               });
               if (!(changedOPT && targetElements && targetElements.length > 0 && changedOPT['OPTELEMENT'] && (changedOPT['OPTELEMENT'] == 'OPVECK_I' || changedOPT['OPTELEMENT'] == 'OPVECK_A'))) {
-                _context6.next = 19;
+                _context7.next = 19;
                 break;
               }
               if (!(targetElements.length > 1)) {
-                _context6.next = 10;
+                _context7.next = 10;
                 break;
               }
-              _context6.next = 6;
+              _context7.next = 6;
               return this.constructionRulesHandler.updateOptionLogicBoxPlanner(this.boxPlannerGrid, changedOPT, targetElements, true);
             case 6:
-              message = _context6.sent;
+              message = _context7.sent;
               if (!message) {
-                _context6.next = 9;
+                _context7.next = 9;
                 break;
               }
-              return _context6.abrupt("return", {
+              return _context7.abrupt("return", {
                 doDeleteBackGrid: false,
                 elemIdsToDelete: [],
                 viewMessageCodex: message
               });
             case 9:
-              return _context6.abrupt("return", {
+              return _context7.abrupt("return", {
                 doDeleteBackGrid: false,
                 elemIdsToDelete: []
               });
@@ -5819,7 +5883,7 @@ var DivaBoxPlanner = /*#__PURE__*/function () {
                 elemToCheck = this.boxPlannerGrid.getPlannerElementAtGridPos(cellPos.startColIndex, 0, false).getElementId();
               }
               if (!(!this.boxPlannerGrid.getElementHasLeftElement(elemToCheck) || !this.boxPlannerGrid.getElementHasRightElement(elemToCheck))) {
-                _context6.next = 19;
+                _context7.next = 19;
                 break;
               }
               //Someone has changed Eck innen or aussen. If the current eselected Element has no neighbor left or right copy neighbor
@@ -5840,7 +5904,7 @@ var DivaBoxPlanner = /*#__PURE__*/function () {
                 copyIndex: copyIndex,
                 copyType: 'BoxPlanner_COL'
               });
-              return _context6.abrupt("return", {
+              return _context7.abrupt("return", {
                 doDeleteBackGrid: false,
                 elemIdsToDelete: [],
                 elementIdToCopy: allElementsToCopy,
@@ -5851,15 +5915,15 @@ var DivaBoxPlanner = /*#__PURE__*/function () {
               });
             case 19:
               if (!(changedOPT && changedOPT['OPTDMOD'])) {
-                _context6.next = 34;
+                _context7.next = 34;
                 break;
               }
-              _context6.t0 = changedOPT['OPTDMOD'];
-              _context6.next = _context6.t0 === 'OPVD_EIN' ? 23 : _context6.t0 === 'OPVD_AUS' ? 27 : 32;
+              _context7.t0 = changedOPT['OPTDMOD'];
+              _context7.next = _context7.t0 === 'OPVD_EIN' ? 23 : _context7.t0 === 'OPVD_AUS' ? 27 : 32;
               break;
             case 23:
               if (this.boxPlannerGrid.getPlannerHasActiveBackside()) {
-                _context6.next = 26;
+                _context7.next = 26;
                 break;
               }
               _allElementsToCopy = this.getPlannerElementsInfluencedByCopy(-1, {
@@ -5870,7 +5934,7 @@ var DivaBoxPlanner = /*#__PURE__*/function () {
                 },
                 copyType: 'BoxPlanner_backside'
               });
-              return _context6.abrupt("return", {
+              return _context7.abrupt("return", {
                 doDeleteBackGrid: false,
                 elemIdsToDelete: [],
                 elementIdToCopy: _allElementsToCopy,
@@ -5878,18 +5942,18 @@ var DivaBoxPlanner = /*#__PURE__*/function () {
                 changedOPT: changedOPT
               });
             case 26:
-              return _context6.abrupt("break", 32);
+              return _context7.abrupt("break", 32);
             case 27:
               if (!this.boxPlannerGrid.getPlannerHasActiveBackside()) {
-                _context6.next = 31;
+                _context7.next = 31;
                 break;
               }
               allElementsInBackGrid = this.boxPlannerGrid.getAllElementsInBackGrid();
               if (!(allElementsInBackGrid.length > 0)) {
-                _context6.next = 31;
+                _context7.next = 31;
                 break;
               }
-              return _context6.abrupt("return", {
+              return _context7.abrupt("return", {
                 doDeleteBackGrid: true,
                 elemIdsToDelete: allElementsInBackGrid.map(function (element) {
                   return element.ElementId;
@@ -5898,22 +5962,22 @@ var DivaBoxPlanner = /*#__PURE__*/function () {
                 changedOPT: changedOPT
               });
             case 31:
-              return _context6.abrupt("break", 32);
+              return _context7.abrupt("break", 32);
             case 32:
-              _context6.next = 48;
+              _context7.next = 48;
               break;
             case 34:
               if (!(changedOPT && changedOPT['OPTFARBE_RAHMEN'] && changedOPT['OPTFARBE_RAHMEN'] == 'OPVSCHWARZ_MATT' && this.boxPlannerGrid.getPlannerHasActiveBackside())) {
-                _context6.next = 40;
+                _context7.next = 40;
                 break;
               }
               //If the double modul is active but the color is changed to black - disable double modul
               _allElementsInBackGrid = this.boxPlannerGrid.getAllElementsInBackGrid();
               if (!(_allElementsInBackGrid.length > 0)) {
-                _context6.next = 38;
+                _context7.next = 38;
                 break;
               }
-              return _context6.abrupt("return", {
+              return _context7.abrupt("return", {
                 doDeleteBackGrid: true,
                 elemIdsToDelete: _allElementsInBackGrid.map(function (element) {
                   return element.ElementId;
@@ -5924,39 +5988,39 @@ var DivaBoxPlanner = /*#__PURE__*/function () {
                 viewMessageCodex: 'BOXPLAN_BLACKFRAME_INCOMPATIBLE_ELEMENT_WARNING'
               });
             case 38:
-              _context6.next = 48;
+              _context7.next = 48;
               break;
             case 40:
-              _context6.next = 42;
+              _context7.next = 42;
               return this.constructionRulesHandler.updateOptionLogicBoxPlanner(this.boxPlannerGrid, changedOPT, targetElements);
             case 42:
-              _message = _context6.sent;
+              _message = _context7.sent;
               if (!_message) {
-                _context6.next = 47;
+                _context7.next = 47;
                 break;
               }
-              return _context6.abrupt("return", {
+              return _context7.abrupt("return", {
                 doDeleteBackGrid: false,
                 elemIdsToDelete: [],
                 viewMessageCodex: _message
               });
             case 47:
-              return _context6.abrupt("return", {
+              return _context7.abrupt("return", {
                 doDeleteBackGrid: false,
                 elemIdsToDelete: []
               });
             case 48:
-              return _context6.abrupt("return", {
+              return _context7.abrupt("return", {
                 doDeleteBackGrid: false,
                 elemIdsToDelete: []
               });
             case 49:
             case "end":
-              return _context6.stop();
+              return _context7.stop();
           }
-        }, _callee6, this);
+        }, _callee7, this);
       }));
-      function updatePlanner(_x11, _x12) {
+      function updatePlanner(_x13, _x14) {
         return _updatePlanner.apply(this, arguments);
       }
       return updatePlanner;