kitchen-simulator 1.0.0-DIY-1119

package/lib/utils/skinPanelEngine.js

@@ -0,0 +1,639 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.computeSkinPanels = computeSkinPanels;
+exports.getSideFaces = getSideFaces;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _constants = require("../constants");
+var _geometry = require("./geometry");
+var _export = require("./export");
+var _convertUnitsLite = require("./convert-units-lite");
+var _helper = require("./helper");
+var _skinPanel = require("../constants/catalog/skinPanel");
+var _cabinetCorner = require("../shared/domain/cabinet-corner");
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function toCm(item, prop) {
+  var unit = item.properties.get(prop).get('_unit') || 'cm';
+  var value = item.properties.get(prop).get('_length');
+  return (0, _convertUnitsLite.convert)(value).from(unit).to('cm');
+}
+function toIn(cmValue) {
+  return _export.MathUtils.toFixedFloat((0, _convertUnitsLite.convert)(cmValue).from('cm').to('in'), 1);
+}
+function rotateCorner(pos, item, width, depth) {
+  return (0, _geometry.rotatePointAroundPoint)(pos[0] * width / 2 + item.x, pos[1] * depth / 2 + item.y, item.x, item.y, item.rotation);
+}
+function getSideFaces(item, layer) {
+  var sideFaces = [];
+  if ((0, _helper.isEmpty)(item)) return sideFaces;
+  var vertexLines = (0, _geometry.getAllLines)(layer);
+  var rectLines = (0, _geometry.buildRectFromLines)(layer, vertexLines);
+  var widthCm = toCm(item, 'width');
+  var depthCm = toCm(item, 'depth');
+  var heightCm = toCm(item, 'height');
+  var altitudeCm = toCm(item, 'altitude');
+  var overlapList = [_constants.OVERLAP_INCLUDED, _constants.OVERLAP_SAME, _constants.OVERLAP_SOME];
+  var pos = [[-1, -1], [1, -1], [1, 1], [-1, 1]];
+  for (var i = 0; i < 4; i++) {
+    if (!(0, _cabinetCorner.isCornerCabinet)(item)) {
+      if (i === 0) continue; // only left & right & base cabinet's back
+      if (i === 2 && item.layoutpos !== _constants.BASE_CABINET_LAYOUTPOS) continue;
+    }
+    var isSnappedToWall = false;
+    var v0 = rotateCorner(pos[i], item, widthCm, depthCm);
+    var v1 = rotateCorner(pos[(i + 1) % 4], item, widthCm, depthCm);
+    var srcLine = {
+      x1: v0.x,
+      y1: v0.y,
+      x2: v1.x,
+      y2: v1.y
+    };
+    for (var j = 0; j < (rectLines === null || rectLines === void 0 ? void 0 : rectLines.length); j++) {
+      var destLine1 = {
+        x1: rectLines[j].rect[2].x,
+        y1: rectLines[j].rect[2].y,
+        x2: rectLines[j].rect[3].x,
+        y2: rectLines[j].rect[3].y
+      };
+      var destLine2 = {
+        x1: rectLines[j].rect[0].x,
+        y1: rectLines[j].rect[0].y,
+        x2: rectLines[j].rect[1].x,
+        y2: rectLines[j].rect[1].y
+      };
+      if (overlapList.includes((0, _geometry.relationshipOfTwoOverlappedLines)(srcLine, destLine1).result) || overlapList.includes((0, _geometry.relationshipOfTwoOverlappedLines)(srcLine, destLine2).result)) {
+        isSnappedToWall = true;
+        break;
+      }
+    }
+    if (!isSnappedToWall) {
+      var depthInch = toIn((0, _geometry.pointsDistance)(srcLine.x1, srcLine.y1, srcLine.x2, srcLine.y2));
+      var heightInch = toIn(heightCm);
+      var skinPanelSKU = 'unknown';
+      switch (item.layoutpos) {
+        case _constants.BASE_CABINET_LAYOUTPOS:
+        case _constants.VANITY_CABINET_LAYOUTPOS:
+          skinPanelSKU = i === 2 ? 'unknown' : _skinPanel.SKIN_SKU_BSV_24;
+          break;
+        case _constants.WALL_CABINET_LAYOUTPOS:
+          {
+            // Wall corner cabinets (e.g. "Wall Easy Reach") still use 12"-deep wall skins.
+            // Their bounding box/edge length can be ~24" even though the finished end panel
+            // part SKU is WSV1242.
+            if ((0, _cabinetCorner.isCornerCabinet)(item)) {
+              skinPanelSKU = _skinPanel.SKIN_SKU_WSV_1242;
+            } else if (Math.abs(depthInch - 12) <= 1) {
+              skinPanelSKU = _skinPanel.SKIN_SKU_WSV_1242;
+            } else if (Math.abs(depthInch - 24) <= 1) {
+              skinPanelSKU = _skinPanel.SKIN_SKU_WSV_2442;
+            }
+            break;
+          }
+        case _constants.TALL_CABINET_LAYOUTPOS:
+          skinPanelSKU = _skinPanel.SKIN_SKU_USV245325;
+          break;
+      }
+      sideFaces.push({
+        sectionLine: srcLine,
+        // cm unit
+        zBottom: altitudeCm,
+        // cm unit
+        zTop: altitudeCm + heightCm,
+        // cm unit
+        depth: depthInch,
+        // inch unit
+        height: heightInch,
+        // inch unit
+        isBackFace: i === 2 ? true : false,
+        skinPanelSKU: skinPanelSKU,
+        itemInfo: item.toJS()
+      });
+    }
+  }
+  return sideFaces;
+}
+function collectLayerItems(layer) {
+  var _layer$items;
+  var skinLayouts = new Set([_constants.BASE_CABINET_LAYOUTPOS, _constants.WALL_CABINET_LAYOUTPOS, _constants.TALL_CABINET_LAYOUTPOS]);
+  var skinPanelItems = [];
+  var otherItems = [];
+  layer === null || layer === void 0 || (_layer$items = layer.items) === null || _layer$items === void 0 || _layer$items.forEach(function (it) {
+    if (it.category === 'cabinet' && skinLayouts.has(it.layoutpos)) skinPanelItems.push(it);else otherItems.push(it);
+  });
+  return {
+    skinPanelItems: skinPanelItems,
+    otherItems: otherItems
+  };
+}
+function collectFaces(items, layer) {
+  var faces = [];
+  for (var i = 0; i < items.length; i++) {
+    var item = items[i];
+    var sideFaces = getSideFaces(item, layer);
+    faces = faces.concat(sideFaces);
+  }
+  return faces;
+}
+function isSnappedWithCornerCabient(srcItem, desItem) {
+  if ((0, _cabinetCorner.isCornerCabinet)(srcItem) || (0, _cabinetCorner.isCornerCabinet)(desItem)) {
+    return true;
+  } else return false;
+}
+
+/**
+ * @param {*} faceSegs
+ * @param {*} otherFaces
+ * @returns
+ */
+function getTrimmedFaceSegs(faceSegs, otherFaces, cnt) {
+  try {
+    cnt++;
+    if (cnt > 5000) {
+      console.log('getTrimmedFaceSegs has limited!');
+      return [];
+    }
+    var returnSegs = [];
+    var _loop = function _loop() {
+      var iFace = faceSegs[i];
+      var srcLine = iFace.sectionLine;
+      var bContourSeg = true;
+      var _loop2 = function _loop2(j) {
+          var destLine = otherFaces[j].sectionLine;
+          var rst = (0, _geometry.relationshipOfTwoOverlappedLines)(srcLine, destLine);
+          if (rst.result == _constants.OVERLAP_SAME || rst.result == _constants.OVERLAP_INCLUDED) {
+            bContourSeg = false;
+            return 0; // break
+          } else if (rst.result == _constants.OVERLAP_SOME) {
+            var isCornerFlag = isSnappedWithCornerCabient(iFace.itemInfo, otherFaces[j].itemInfo);
+            var trimmedFaceSegs = [];
+            rst.trimmedSegs.forEach(function (lineSeg) {
+              !isCornerFlag && trimmedFaceSegs.push({
+                sectionLine: lineSeg,
+                // cm unit
+                zBottom: iFace.zBottom,
+                // cm unit
+                zTop: iFace.zTop,
+                // cm unit
+                depth: iFace.depthInch,
+                // inch unit
+                height: iFace.heightInch,
+                // inch unit
+                isBackFace: iFace.isBackFace,
+                skinPanelSKU: iFace.skinPanelSKU,
+                itemInfo: iFace.itemInfo
+              });
+            });
+            var tFaceSegs = getTrimmedFaceSegs(trimmedFaceSegs, otherFaces.filter(function (v, idx) {
+              return idx !== j;
+            }), cnt);
+            if (tFaceSegs.length > 0) returnSegs = [].concat((0, _toConsumableArray2["default"])(returnSegs), (0, _toConsumableArray2["default"])(tFaceSegs));
+            bContourSeg = false;
+            return 0; // break
+          }
+        },
+        _ret;
+      for (var j = 0; j < otherFaces.length; j++) {
+        _ret = _loop2(j);
+        if (_ret === 0) break;
+      }
+      if (bContourSeg) returnSegs.push(faceSegs[i]);
+    };
+    for (var i = 0; i < faceSegs.length; i++) {
+      _loop();
+    }
+    return returnSegs;
+  } catch (e) {
+    console.log('getTrimmedFaceSegs catched :', e);
+    return [];
+  }
+}
+function filterFacesBlockedByFaces(sourceFaces, blockingFaces) {
+  var overlapList = [_constants.OVERLAP_INCLUDED, _constants.OVERLAP_SAME];
+  var removeIdxs = [];
+  var newFaces = []; // new countour edge segment that except the overlapped part
+  var _loop3 = function _loop3(i) {
+    var iFace = sourceFaces[i];
+    for (var j = 0; j < blockingFaces.length; j++) {
+      var _relationship$trimmed;
+      if (sourceFaces === blockingFaces && i === j) continue;
+      var jFace = blockingFaces[j];
+      var verticallyIncluded = (iFace.zBottom > jFace.zBottom || Math.abs(iFace.zBottom - jFace.zBottom) < _constants.EPSILON) && (iFace.zTop < jFace.zTop || Math.abs(iFace.zTop - jFace.zTop) < _constants.EPSILON);
+      var verticallyOverlappedTopPart = jFace.zBottom < iFace.zTop && jFace.zBottom > iFace.zBottom && Math.abs(jFace.zBottom - iFace.zTop) > _constants.EPSILON && Math.abs(jFace.zBottom - iFace.zBottom) > _constants.EPSILON;
+      var verticallyOverlappedBottomPart = jFace.zTop < iFace.zTop && jFace.zTop > iFace.zBottom && Math.abs(jFace.zTop - iFace.zTop) > _constants.EPSILON && Math.abs(jFace.zTop - iFace.zBottom) > _constants.EPSILON;
+      var relationship = (0, _geometry.relationshipOfTwoOverlappedLines)(iFace.sectionLine, jFace.sectionLine);
+      if (overlapList.includes(relationship.result)) {
+        if (verticallyIncluded) {
+          removeIdxs.push(i);
+          break;
+        } else if (verticallyOverlappedTopPart) {
+          removeIdxs.push(i);
+          var isCornerFlag = isSnappedWithCornerCabient(iFace.itemInfo, jFace.itemInfo);
+          var newFace = !isCornerFlag ? {
+            sectionLine: iFace.sectionLine,
+            // cm unit
+            zBottom: iFace.zBottom,
+            // cm unit
+            zTop: jFace.zBottom,
+            // cm unit
+            depth: iFace.depthInch,
+            // inch unit
+            height: toIn(jFace.zBottom - iFace.zBottom),
+            // inch unit
+            isBackFace: iFace.isBackFace,
+            skinPanelSKU: iFace.skinPanelSKU,
+            itemInfo: iFace.itemInfo
+          } : {};
+          var contourFaces = filterFacesBlockedByFaces([newFace], sourceFaces === blockingFaces ? blockingFaces.filter(function (v, idx) {
+            return idx !== i;
+          }) : blockingFaces, 0);
+          if (contourFaces.length > 0) newFaces = [].concat((0, _toConsumableArray2["default"])(newFaces), (0, _toConsumableArray2["default"])(contourFaces));
+          break;
+        } else if (verticallyOverlappedBottomPart) {
+          removeIdxs.push(i);
+          var _isCornerFlag = isSnappedWithCornerCabient(iFace.itemInfo, jFace.itemInfo);
+          var _newFace = !_isCornerFlag ? {
+            sectionLine: iFace.sectionLine,
+            // cm unit
+            zBottom: jFace.zTop,
+            // cm unit
+            zTop: iFace.zTop,
+            // cm unit
+            depth: iFace.depthInch,
+            // inch unit
+            height: toIn(iFace.zTop - jFace.zTop),
+            // inch unit
+            isBackFace: iFace.isBackFace,
+            skinPanelSKU: iFace.skinPanelSKU,
+            itemInfo: iFace.itemInfo
+          } : {};
+          var _contourFaces = filterFacesBlockedByFaces([_newFace], sourceFaces === blockingFaces ? blockingFaces.filter(function (v, idx) {
+            return idx !== i;
+          }) : blockingFaces, 0);
+          if (_contourFaces.length > 0) newFaces = [].concat((0, _toConsumableArray2["default"])(newFaces), (0, _toConsumableArray2["default"])(_contourFaces));
+          break;
+        }
+      } else if (relationship.result === _constants.OVERLAP_SOME && ((_relationship$trimmed = relationship.trimmedSegs) === null || _relationship$trimmed === void 0 ? void 0 : _relationship$trimmed.length) > 0 && verticallyIncluded) {
+        removeIdxs.push(i);
+        var tFaceSegs = getTrimmedFaceSegs([iFace], sourceFaces === blockingFaces ? blockingFaces.filter(function (v, idx) {
+          return idx !== i;
+        }) : blockingFaces, 0);
+        if (tFaceSegs.length > 0) newFaces = [].concat((0, _toConsumableArray2["default"])(newFaces), (0, _toConsumableArray2["default"])(tFaceSegs));
+        break;
+      }
+    }
+  };
+  for (var i = 0; i < sourceFaces.length; i++) {
+    _loop3(i);
+  }
+  sourceFaces = sourceFaces.filter(function (face, idx) {
+    return !removeIdxs.includes(idx);
+  });
+  if (newFaces.length > 0) sourceFaces = [].concat((0, _toConsumableArray2["default"])(sourceFaces), (0, _toConsumableArray2["default"])(newFaces));
+  return sourceFaces;
+}
+function applyGroupingRules(faces) {
+  var _applyHorizontalGroup = applyHorizontalGrouping(faces),
+    remainingAfterHorizontal = _applyHorizontalGroup.remainingAfterHorizontal,
+    horizontalGrouped = _applyHorizontalGroup.horizontalGrouped;
+  var _applyVerticalGroupin = applyVerticalGrouping(remainingAfterHorizontal),
+    remainingAfterVertical = _applyVerticalGroupin.remainingAfterVertical,
+    verticalGrouped = _applyVerticalGroupin.verticalGrouped;
+  return {
+    remainingFaces: remainingAfterVertical,
+    groupedFaces: [].concat((0, _toConsumableArray2["default"])(horizontalGrouped), (0, _toConsumableArray2["default"])(verticalGrouped))
+  };
+}
+
+/**
+ * Horizontal Grouping (for base cabinets back-to-back : BSV48 48" x 34.5")
+ */
+function applyHorizontalGrouping(faces) {
+  var removeIdxs = [];
+  var grouped = [];
+  for (var i = 0; i < faces.length; i++) {
+    var iFace = faces[i];
+    if (removeIdxs.includes(i) || iFace.itemInfo.layoutpos !== _constants.BASE_CABINET_LAYOUTPOS) continue;
+    for (var j = 0; j < faces.length; j++) {
+      if (i === j) continue;
+      var jFace = faces[j];
+      if (removeIdxs.includes(j) || jFace.itemInfo.layoutpos !== _constants.BASE_CABINET_LAYOUTPOS || Math.abs(iFace.zBottom - jFace.zBottom) > _constants.EPSILON || Math.abs(iFace.zTop - jFace.zTop) > _constants.EPSILON) continue;
+      var relationship = (0, _geometry.relationshipOfTwoOverlappedLines)(iFace.sectionLine, jFace.sectionLine);
+      if (relationship.result === _constants.OVERLAP_LINK) {
+        grouped.push({
+          sectionLine: relationship.linkedLine,
+          // cm unit
+          zBottom: jFace.zBottom,
+          // cm unit
+          zTop: jFace.zTop,
+          // cm unit
+          depth: jFace.depth,
+          // inch unit
+          height: jFace.height,
+          // inch unit
+          isBackFace: jFace.isBackFace,
+          skinPanelSKU: jFace.isBackFace ? 'unknown' : _skinPanel.SKIN_SKU_BSV_48,
+          itemInfo: jFace.itemInfo // [TODO] how to select the doorstyle of grouped skin
+        });
+        removeIdxs.push(i);
+        removeIdxs.push(j);
+      }
+    }
+  }
+  return {
+    remainingAfterHorizontal: faces.filter(function (f, idx) {
+      return !removeIdxs.includes(idx);
+    }),
+    horizontalGrouped: grouped
+  };
+}
+
+/**
+ * Vertical Grouping (For CT3DR or CT2DR SKUs + stacked wall cabinets)
+ */
+function applyVerticalGrouping(faces) {
+  var removeIdxs = [];
+  var grouped = [];
+  for (var i = 0; i < faces.length; i++) {
+    var iFace = faces[i];
+    if (removeIdxs.includes(i) || iFace.itemInfo.layoutpos !== _constants.WALL_CABINET_LAYOUTPOS) continue;
+    for (var j = 0; j < faces.length; j++) {
+      if (i === j) continue;
+      var jFace = faces[j];
+      if (removeIdxs.includes(j) || jFace.itemInfo.layoutpos !== _constants.WALL_CABINET_LAYOUTPOS) continue;
+      var verticallyTouching = Math.abs(iFace.zBottom - jFace.zTop) < _constants.EPSILON || Math.abs(iFace.zTop - jFace.zBottom) < _constants.EPSILON;
+      var horizontallySame = (0, _geometry.relationshipOfTwoOverlappedLines)(iFace.sectionLine, jFace.sectionLine).result === _constants.OVERLAP_SAME;
+      if (verticallyTouching && horizontallySame) {
+        grouped.push({
+          sectionLine: jFace.sectionLine,
+          // cm unit
+          zBottom: Math.min(jFace.zBottom, iFace.zBottom),
+          // cm unit
+          zTop: Math.max(jFace.zTop, iFace.zTop),
+          // cm unit
+          depth: jFace.depth,
+          // inch unit
+          height: jFace.height,
+          // inch unit
+          isBackFace: jFace.isBackFace,
+          skinPanelSKU: _skinPanel.SKIN_SKU_WSV_2460,
+          itemInfo: jFace.itemInfo // [TODO] how to select the doorstyle of grouped skin
+        });
+        removeIdxs.push(i);
+        removeIdxs.push(j);
+      }
+    }
+  }
+  return {
+    remainingAfterVertical: faces.filter(function (f, idx) {
+      return !removeIdxs.includes(idx);
+    }),
+    verticalGrouped: grouped
+  };
+}
+function isMP3TallCabinet(sku) {
+  return sku === null || sku === void 0 ? void 0 : sku.startsWith('MP3');
+}
+function buildMP3SkinPanelArray(bottomHeight, topHeight, mp3SkinPanelArray) {
+  var skinPanelHeightArray = [],
+    bIndex = -1,
+    tIndex = -1,
+    hArray = [],
+    skinPanelTypeArray = [],
+    temp = 0;
+  // make skinPanelHeightArray : [0,  sum(h1 + h2 +...+ hn)]
+  skinPanelHeightArray[0] = temp;
+  for (var i = 0; i < mp3SkinPanelArray.length; i++) {
+    temp += mp3SkinPanelArray[i][0];
+    skinPanelHeightArray.push(temp);
+  }
+  // calc the zBottom's index
+  for (var _i = 0; _i <= skinPanelHeightArray.length; _i++) {
+    if (bottomHeight < skinPanelHeightArray[_i]) {
+      bIndex = _i - 1;
+      break;
+    }
+  }
+  if (bIndex < 0) {
+    console.log('Error for bottomHeight in buildMP3SkinPanelArray');
+    return [];
+  }
+  // calc the zTop's index
+  for (var _i2 = 0; _i2 <= skinPanelHeightArray.length; _i2++) {
+    if (topHeight <= skinPanelHeightArray[_i2]) {
+      tIndex = _i2;
+      break;
+    }
+  }
+  if (tIndex < 0) {
+    console.log('Error for topHeight in buildMP3SkinPanelArray');
+    return [];
+  }
+  if (tIndex === 0 || bIndex === skinPanelHeightArray.length) return [];
+
+  // make the skinPanelTypeArray using zTop's index and zBottom's index
+  hArray = mp3SkinPanelArray.slice(bIndex, tIndex + 1);
+  for (var _i3 = 0; _i3 < hArray.length; _i3++) {
+    skinPanelTypeArray.push(hArray[_i3][1]);
+  }
+  // return skinPanelTypeArray : e.g. [SKIN_SKU_BSV_24, SKIN_SKU_WSV_2442]
+  return skinPanelTypeArray;
+}
+
+/**
+ * Decide which skin panel pieces are needed for a tall cabinet.
+ */
+function resolveTallCabinetBundle(face) {
+  var item = face.itemInfo;
+  if (isMP3TallCabinet(item.sku_number)) {
+    var zBottom = face.zBottom;
+    var zTop = face.zTop;
+    var bottomHeight = (0, _convertUnitsLite.convert)(zBottom).from('cm').to('in');
+    var topHeight = (0, _convertUnitsLite.convert)(zTop).from('cm').to('in');
+    var mp3SkinPanelArray = [[34.5, _skinPanel.SKIN_SKU_BSV_24],
+    // [height of skin panel, type of skin panel]
+    [item.properties.height._length - 76.5, _skinPanel.SKIN_SKU_BSV_24], [42, _skinPanel.SKIN_SKU_WSV_2442]];
+    return buildMP3SkinPanelArray(bottomHeight, topHeight, mp3SkinPanelArray);
+  }
+  if (face.height > _skinPanel.SKIN_HEIGHT_53_25) {
+    return [_skinPanel.SKIN_SKU_USV245325, _skinPanel.SKIN_SKU_WSV_2442];
+  }
+  return face !== null && face !== void 0 && face.skinPanelSKU ? [face.skinPanelSKU] : [];
+}
+
+/**
+ * Converts a face → list of SKUs
+ */
+function resolveSkinPanelSKU(face) {
+  var layout = face.itemInfo.layoutpos;
+  if (layout === _constants.TALL_CABINET_LAYOUTPOS) {
+    return resolveTallCabinetBundle(face);
+  }
+  return [face.skinPanelSKU];
+}
+
+/**
+ * Make skin panel data with grouping skinPanelSKU & doorStyle
+ */
+function buildSkinPanelData(faces) {
+  var tempResult = [];
+  var _loop4 = function _loop4() {
+    var sf = faces[i];
+    var skus = resolveSkinPanelSKU(sf);
+    var _iterator = _createForOfIteratorHelper(skus),
+      _step;
+    try {
+      var _loop6 = function _loop6() {
+        var sku = _step.value;
+        var idx = tempResult.findIndex(function (v) {
+          var _sf$itemInfo;
+          return v.itemSKU === sku && v.doorStyleId === ((_sf$itemInfo = sf.itemInfo) === null || _sf$itemInfo === void 0 || (_sf$itemInfo = _sf$itemInfo.doorStyle) === null || _sf$itemInfo === void 0 ? void 0 : _sf$itemInfo.id) && v.isBackFace === sf.isBackFace;
+        });
+        if (idx < 0) {
+          var _sf$itemInfo$doorStyl, _sf$itemInfo2, _sf$itemInfo$doorStyl2, _sf$itemInfo3;
+          tempResult.push({
+            itemSKU: sku,
+            doorStyle: (_sf$itemInfo$doorStyl = (_sf$itemInfo2 = sf.itemInfo) === null || _sf$itemInfo2 === void 0 || (_sf$itemInfo2 = _sf$itemInfo2.doorStyle) === null || _sf$itemInfo2 === void 0 ? void 0 : _sf$itemInfo2.name) !== null && _sf$itemInfo$doorStyl !== void 0 ? _sf$itemInfo$doorStyl : '',
+            doorStyleId: (_sf$itemInfo$doorStyl2 = (_sf$itemInfo3 = sf.itemInfo) === null || _sf$itemInfo3 === void 0 || (_sf$itemInfo3 = _sf$itemInfo3.doorStyle) === null || _sf$itemInfo3 === void 0 ? void 0 : _sf$itemInfo3.id) !== null && _sf$itemInfo$doorStyl2 !== void 0 ? _sf$itemInfo$doorStyl2 : '',
+            installationType: 'standard',
+            quantity: 1,
+            totalLength: toIn((0, _geometry.pointsDistance)(sf.sectionLine.x1, sf.sectionLine.y1, sf.sectionLine.x2, sf.sectionLine.y2)),
+            isBackFace: sf.isBackFace
+          });
+        } else {
+          var faceLength = (0, _geometry.pointsDistance)(sf.sectionLine.x1, sf.sectionLine.y1, sf.sectionLine.x2, sf.sectionLine.y2);
+          tempResult[idx].totalLength += toIn(faceLength);
+          tempResult[idx].quantity += 1;
+        }
+      };
+      for (_iterator.s(); !(_step = _iterator.n()).done;) {
+        _loop6();
+      }
+    } catch (err) {
+      _iterator.e(err);
+    } finally {
+      _iterator.f();
+    }
+  };
+  for (var i = 0; i < faces.length; i++) {
+    _loop4();
+  }
+
+  // calculate back face panel quantity of island base cabinets
+  var removeIdxs = [];
+  var newDatas = [];
+  var _loop5 = function _loop5() {
+    var iData = tempResult[_i4];
+    if (iData.isBackFace) {
+      removeIdxs.push(_i4);
+      var count48 = Math.floor(iData.totalLength / 48);
+      var count24 = iData.totalLength % 48 > 0 ? 1 : 0;
+      var idx48 = tempResult.findIndex(function (v) {
+        return v.itemSKU === _skinPanel.SKIN_SKU_BSV_48 && v.doorStyleId === iData.doorStyleId;
+      });
+      var idx24 = tempResult.findIndex(function (v) {
+        return v.itemSKU === _skinPanel.SKIN_SKU_BSV_24 && v.doorStyleId === iData.doorStyleId;
+      });
+      if (idx48 < 0) {
+        if (count48 > 0) newDatas.push({
+          itemSKU: _skinPanel.SKIN_SKU_BSV_48,
+          doorStyle: iData.doorStyle,
+          doorStyleId: iData.doorStyleId,
+          installationType: iData.installationType,
+          quantity: count48,
+          totalLength: count48 * 48,
+          isBackFace: iData.isBackFace
+        });
+      } else {
+        tempResult[idx48].quantity += count48;
+        tempResult[idx48].totalLength += count48 * 48;
+      }
+      if (idx24 < 0) {
+        if (count24 > 0) newDatas.push({
+          itemSKU: _skinPanel.SKIN_SKU_BSV_24,
+          doorStyle: iData.doorStyle,
+          doorStyleId: iData.doorStyleId,
+          installationType: iData.installationType,
+          quantity: count24,
+          totalLength: count24 * 24,
+          isBackFace: iData.isBackFace
+        });
+      } else {
+        tempResult[idx24].quantity += count24;
+        tempResult[idx24].totalLength += count24 * 24;
+      }
+    }
+  };
+  for (var _i4 = 0; _i4 < tempResult.length; _i4++) {
+    _loop5();
+  }
+  tempResult = tempResult.filter(function (data, idx) {
+    return !removeIdxs.includes(idx);
+  });
+  if (newDatas.length > 0) tempResult = [].concat((0, _toConsumableArray2["default"])(tempResult), newDatas);
+  var result = [];
+  tempResult.forEach(function (v) {
+    return result.push({
+      itemSKU: v.itemSKU,
+      doorStyle: v.doorStyle,
+      doorStyleId: v.doorStyleId,
+      installationType: v.installationType,
+      quantity: v.quantity
+    });
+  });
+  return result;
+}
+function shouldExcludeSkinPanel(itemJS, exclusionSet) {
+  var _itemJS$ccdf;
+  var catalogCabinetSku = (0, _helper.getCatalogCabinetSku)(itemJS);
+  if (exclusionSet.has(catalogCabinetSku)) return true;
+  var cabinetSku = itemJS === null || itemJS === void 0 || (_itemJS$ccdf = itemJS.ccdf) === null || _itemJS$ccdf === void 0 ? void 0 : _itemJS$ccdf.cabinet_sku;
+  if (!cabinetSku) return false;
+  if (exclusionSet.has(cabinetSku)) return true;
+
+  // Catalog aliases use both BASE-FINISH and FINISH-BASE conventions.
+  var basePrefix = "".concat(cabinetSku, "-");
+  var baseSuffix = "-".concat(cabinetSku);
+  var _iterator2 = _createForOfIteratorHelper(exclusionSet),
+    _step2;
+  try {
+    for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+      var excludedSku = _step2.value;
+      if (typeof excludedSku === 'string' && (excludedSku.startsWith(basePrefix) || excludedSku.endsWith(baseSuffix))) {
+        return true;
+      }
+    }
+  } catch (err) {
+    _iterator2.e(err);
+  } finally {
+    _iterator2.f();
+  }
+  return false;
+}
+function computeSkinPanels(layer) {
+  var skinPanelExclusionSKUs = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+  var exclusionSet = new Set(skinPanelExclusionSKUs);
+
+  // Get candidate skin panel items and other items
+  var _collectLayerItems = collectLayerItems(layer),
+    skinPanelItems = _collectLayerItems.skinPanelItems,
+    otherItems = _collectLayerItems.otherItems;
+
+  // Get all skin face list of [skinPanelItems] & [otherItems]
+  var skinFaces = collectFaces(skinPanelItems, layer);
+  var otherFaces = collectFaces(otherItems, layer);
+  skinFaces = filterFacesBlockedByFaces(skinFaces, skinFaces);
+  skinFaces = filterFacesBlockedByFaces(skinFaces, otherFaces);
+  skinFaces = skinFaces.filter(function (skinFace) {
+    return !shouldExcludeSkinPanel(skinFace.itemInfo, exclusionSet);
+  });
+  var _applyGroupingRules = applyGroupingRules(skinFaces),
+    remainingFaces = _applyGroupingRules.remainingFaces,
+    groupedFaces = _applyGroupingRules.groupedFaces;
+  var finalFaces = [].concat((0, _toConsumableArray2["default"])(remainingFaces), (0, _toConsumableArray2["default"])(groupedFaces));
+  return buildSkinPanelData(finalFaces);
+}