kitchen-simulator 5.0.4-react.18 → 5.10.1-react.18

package/es/WorkSpace.js

@@ -231,6 +231,7 @@ function WorkSpace(props) {
           roomShapeType: 'rectangle',
           width: 250,
           height: 100,
+          measurementUnit: 'in',
           doorStyle: {
             id: 36,
             type: 'door',

package/es/actions/project-actions.js

@@ -286,11 +286,12 @@ export function selectAll() {
     value: value
   };
 }
-export function createRoomWithShape(roomShapeType, width, height, doorStyle) {
+export function createRoomWithShape(roomShapeType, width, height, measurementUnit, doorStyle) {
   return {
     type: CREATE_ROOM_WITH_SHAPE,
     width: width,
     height: height,
+    measurementUnit: measurementUnit,
     roomShapeType: roomShapeType,
     doorStyle: doorStyle
   };

package/es/catalog/utils/item-loader.js

@@ -123,7 +123,6 @@ export function render2DItem(element, layer, scene, sizeinfo, layoutpos, is_corn
   var rowCount = 0; //parseInt((element.type.length / lineCount - 0.51).toFixed(), 10);
 
   // Get type
-  var type = element.type;
   var objSKU = this.obj.sku_number;
   if (objSKU.length !== 0) {
     var dcId,
@@ -137,15 +136,15 @@ export function render2DItem(element, layer, scene, sizeinfo, layoutpos, is_corn
       return el.door_color_id === dcId;
     });
     if (skuItem !== undefined) {
-      type = skuItem.sku;
+      objSKU = skuItem.sku;
     }
   }
   if (rowCount > 0) {
     for (var _x = 0; _x < rowCount; _x++) {
-      splitStr.push(type.slice(lineCount * _x, lineCount * (_x + 1)));
+      splitStr.push(objSKU.slice(lineCount * _x, lineCount * (_x + 1)));
     }
   }
-  splitStr.push(type.slice(lineCount * rowCount));
+  splitStr.push(objSKU.slice(lineCount * rowCount));
   splitStr.forEach(function (el, key) {
     txtContent.push(/*#__PURE__*/React.createElement("text", {
       key: 'text' + key,
@@ -1001,18 +1000,13 @@ export function render3DItem(element, layer, scene, sizeinfo, structure_json, is
     if (!isEmpty(doorStyles)) {
       var _layer$toJS;
       var normalMap = doorStyles.get('base') || INITIAL_NORMAL_MAP;
-      if (isEmpty(counterTop.uri)) {
-        try {
-          counterTop = counterTop.toJS();
-        } catch (error) {
-          //@todo THIS IS A TEMPORARY FIX FOR COUNTERTOP TEXTURE UNDEFINED ISSUE
-          counterTop.uri = 'https://media.test.diydesignspace.com/uploads/CountTop/202105074107_5/texture/Unique_Calcatta_texture.jpg';
-          console.log(error);
-        }
-      }
       if (isEmpty(counterTop.uri) && !isEmpty(layer === null || layer === void 0 || (_layer$toJS = layer.toJS()) === null || _layer$toJS === void 0 ? void 0 : _layer$toJS.counterTop.uri)) {
         counterTop.uri = layer.toJS().counterTop.uri;
       }
+      if (isEmpty(counterTop.uri)) {
+        //@todo THIS IS A TEMPORARY FIX FOR COUNTERTOP TEXTURE UNDEFINED ISSUE
+        counterTop.uri = 'https://media.test.diydesignspace.com/uploads/CountTop/202105074107_5/texture/Unique_Calcatta_texture.jpg';
+      }
       var countTopMap = counterTop.uri;
       var interiorMap = doorStyles.get('interior');
       var countT = loadTexture(countTopMap);

package/es/class/item.js

@@ -492,6 +492,9 @@ var Item = /*#__PURE__*/function () {
   }, {
     key: "storeDistArray",
     value: function storeDistArray(state, layerID, itemID, distArray) {
+      if (isEmpty(distArray)) return {
+        updatedState: state
+      };
       var curDistArray = state.getIn(['scene', 'layers', layerID, 'items', itemID, 'distArray']);
       distArray.forEach(function (dist) {
         dist[0] < 0 ? dist[0] = 0 : dist[0];
@@ -1160,7 +1163,10 @@ var Item = /*#__PURE__*/function () {
     key: "setDoorStyle",
     value: function setDoorStyle(state, doorStyle, itemCDS, isAll) {
       var _this2 = this;
-      var keys = Object.keys(doorStyle.doorStyles);
+      if (isEmpty(doorStyle)) return {
+        updatedState: state
+      };
+      var keys = doorStyle.doorStyles ? Object.keys(doorStyle.doorStyles) : [];
       keys = keys.filter(function (elem) {
         return !elem.endsWith('_gltf');
       });

package/es/class/project.js

@@ -832,11 +832,10 @@ var Project = /*#__PURE__*/function () {
     }
   }, {
     key: "createRoomWithShape",
-    value: function createRoomWithShape(state, roomShapeType, width, height, doorStyle) {
+    value: function createRoomWithShape(state, roomShapeType, width, height, measurementUnit, doorStyle) {
       var catalog = state.catalog;
-      // keep measurement unit, sceneHistory
+      // keep sceneHistory
       var curLayerID = state.scene.selectedLayer;
-      var layerUnit = state.getIn(['scene', 'layers', curLayerID, 'unit']);
       var ceilHeight = state.getIn(['scene', 'layers', curLayerID, 'ceilHeight']);
       var sceneHistory = state.getIn(['sceneHistory']);
       state = this.newProject(state).updatedState;
@@ -851,8 +850,8 @@ var Project = /*#__PURE__*/function () {
         if (isEmpty(viewer)) return {
           updatedState: state
         };
-        width = convert(width).from(state.getIn(['scene', 'layers', 'layer-1', 'unit'])).to('cm');
-        height = convert(height).from(state.getIn(['scene', 'layers', 'layer-1', 'unit'])).to('cm');
+        width = convert(width).from(measurementUnit).to('cm');
+        height = convert(height).from(measurementUnit).to('cm');
         var halfWidth = width / 2;
         var halfHeight = height / 2;
         var viewerWidth = viewer.SVGWidth;
@@ -925,8 +924,7 @@ var Project = /*#__PURE__*/function () {
         }
       }
 
-      // copy keeped measurement unit, sceneHistory
-      state = state.setIn(['scene', 'layers', layerID, 'unit'], layerUnit);
+      // copy keeped sceneHistory
       state = state.setIn(['scene', 'layers', layerID, 'ceilHeight'], ceilHeight);
       state = state.setIn(['sceneHistory'], sceneHistory);
       state = centering2D(state);

package/es/components/viewer2d/item.js

@@ -83,7 +83,6 @@ export default function Item(_ref3) {
       var itemDistanceFromLine = el[0];
       var dir = el[1];
       if (itemDistanceFromLine > ep || itemDistanceFromLine < -ep) {
-        var _cat$info;
         renderedRuler.push(/*#__PURE__*/React.createElement("g", {
           "data-element-root": true,
           "data-prototype": "rulerDist",
@@ -100,7 +99,7 @@ export default function Item(_ref3) {
           length: itemDistanceFromLine,
           angle: rotation,
           rotation: dir,
-          transform: "translate(".concat(dir === 180 ? -nw : dir === 0 ? nw : 0, ", ").concat(dir === 90 ? nh : dir === -90 ? (cat === null || cat === void 0 || (_cat$info = cat.info) === null || _cat$info === void 0 ? void 0 : _cat$info.is_corner) !== 1 ? -(nh + 4) : -nh : 0, ") rotate(").concat(dir, ", 0, 0)")
+          transform: "translate(".concat(dir === 180 ? -nw : dir === 0 ? nw : 0, ", ").concat(dir === 90 ? nh : dir === -90 ? cat.info.is_corner !== 1 ? -(nh + 4) : -nh : 0, ") rotate(").concat(dir, ", 0, 0)")
         })));
       }
     });

package/es/components/viewer2d/line.js

@@ -5,7 +5,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { GeometryUtils } from "../../utils/export";
 import Ruler from "./ruler";
-import { BASE_CABINET_LAYOUTPOS, LINE_THICKNESS, MODE_DRAGGING_LINE, MODE_DRAWING_LINE, WALL_CABINET_LAYOUTPOS, MAX_ANGLE_SCALE, ROOM_SHAPE_MEASUREMENT_LINE_COLOR, ROOM_ELEMENT_MEASUREMENT_LINE_COLOR, BASE_ITEM_MEASUREMENT_LINE_COLOR, WALL_ITEM_MEASUREMENT_LINE_COLOR, DISTANCE_MEASUREMENT_LINE_COLOR, DASH_LINE_COLOR, TALL_CABINET_LAYOUTPOS } from "../../constants";
+import { BASE_CABINET_LAYOUTPOS, LINE_THICKNESS, MODE_DRAGGING_LINE, MODE_DRAWING_LINE, WALL_CABINET_LAYOUTPOS, MAX_ANGLE_SCALE, ROOM_SHAPE_MEASUREMENT_LINE_COLOR, ROOM_ELEMENT_MEASUREMENT_LINE_COLOR, BASE_ITEM_MEASUREMENT_LINE_COLOR, WALL_ITEM_MEASUREMENT_LINE_COLOR, DISTANCE_MEASUREMENT_LINE_COLOR, DASH_LINE_COLOR, TALL_CABINET_LAYOUTPOS, VANITY_CABINET_LAYOUTPOS } from "../../constants";
 import * as Three from 'three';
 import { isEmpty } from "./utils";
 var STYLE = {
@@ -408,7 +408,7 @@ export default function Line(_ref) {
 
   //base cabinet
   var baseSpace = wallSpace + STEP;
-  var base_item = GeometryUtils.getAllItemSpecified(scene, catalog, BASE_CABINET_LAYOUTPOS);
+  var base_item = GeometryUtils.getAllItemSpecified(scene, catalog, [BASE_CABINET_LAYOUTPOS, VANITY_CABINET_LAYOUTPOS]);
 
   // base cabinet
   var baseRuler = [];

package/es/components/viewer3d/scene-creator.js

@@ -854,7 +854,7 @@ function replaceObject(modifiedPath, layer, planData, actions, sceneData, oldSce
       item = layer.getIn(['items', modifiedPath[4]]);
       addCountertop(planData.sceneGraph.layers[layer.id].countertops, item, planData, layer);
       // Toggle selection should not update molding
-      if (item.category === 'cabinet' && modifiedPath[modifiedPath.length - 1] !== 'selected') {
+      if (item.category === 'cabinet' && modifiedPath[modifiedPath.length - 1] !== 'selected' && !modifiedPath[modifiedPath.length - 1].includes('handle')) {
         planData.sceneGraph.layers[layer.id].moldingGroups = addMolding(tmpMoldings, item, planData, layer, actions.itemsActions, mode) || _toConsumableArray(tmpMoldings);
       }
       break;
@@ -3035,19 +3035,23 @@ export function createBacksplash(item, layer, planData, scene) {
   var altItems = [],
     flag = false;
   wallItems.map(function (wallItem) {
-    var altitude = wallItem.itemInfo.properties.get('altitude').get('_length');
-    var altitudeUnit = wallItem.itemInfo.properties.get('altitude').get('_unit') || 'cm';
-    altitude = convert(altitude).from(altitudeUnit).to('cm');
-    altItems.push({
-      x: wallItem.pos.x,
-      width: wallItem.size.width,
-      altitude: altitude
-    });
+    var _wallItem$itemInfo, _wallItem$itemInfo2;
+    var altitude = (_wallItem$itemInfo = wallItem.itemInfo) === null || _wallItem$itemInfo === void 0 || (_wallItem$itemInfo = _wallItem$itemInfo.properties) === null || _wallItem$itemInfo === void 0 ? void 0 : _wallItem$itemInfo.get('altitude').get('_length');
+    var altitudeUnit = ((_wallItem$itemInfo2 = wallItem.itemInfo) === null || _wallItem$itemInfo2 === void 0 || (_wallItem$itemInfo2 = _wallItem$itemInfo2.properties) === null || _wallItem$itemInfo2 === void 0 ? void 0 : _wallItem$itemInfo2.get('altitude').get('_unit')) || 'cm';
+    if (!isEmpty(altitude) && !isEmpty(altitudeUnit)) {
+      altitude = convert(altitude).from(altitudeUnit).to('cm');
+      altItems.push({
+        x: wallItem.pos.x,
+        width: wallItem.size.width,
+        altitude: altitude
+      });
+    }
   });
   layer.holes.map(function (hole) {
-    var width = hole.properties.getIn(['width', 'length']);
-    var altitude = hole.properties.getIn(['altitude', 'length']);
-    altItems.push({
+    var _hole$properties, _hole$properties2;
+    var width = (_hole$properties = hole.properties) === null || _hole$properties === void 0 ? void 0 : _hole$properties.getIn(['width', 'length']);
+    var altitude = (_hole$properties2 = hole.properties) === null || _hole$properties2 === void 0 ? void 0 : _hole$properties2.getIn(['altitude', 'length']);
+    if (!isEmpty(width) && !isEmpty(altitude)) altItems.push({
       x: hole.x,
       width: width,
       altitude: altitude

package/es/constants.js

@@ -595,6 +595,7 @@ export var SUBMIT_ADD_CART = 'addCart';
 export var BASE_CABINET_LAYOUTPOS = 'Base';
 export var WALL_CABINET_LAYOUTPOS = 'Wall';
 export var TALL_CABINET_LAYOUTPOS = 'Tall';
+export var VANITY_CABINET_LAYOUTPOS = 'Vanity';
 export var TOP_MOLDING_LOCATION = 'Top';
 export var MIDDLE_MOLDING_LOCATION = 'Middle';
 export var BOTTOM_MOLDING_LOCATION = 'Bottom';

package/es/reducers/project-reducer.js

@@ -129,7 +129,7 @@ export default function (state, action) {
       state = state.merge({
         sceneHistory: history.historyPush(state.sceneHistory, state.scene)
       });
-      return Project.createRoomWithShape(state, action.roomShapeType, action.width, action.height, action.doorStyle).updatedState;
+      return Project.createRoomWithShape(state, action.roomShapeType, action.width, action.height, action.measurementUnit, action.doorStyle).updatedState;
     default:
       return state;
   }

package/es/utils/geometry.js

@@ -2486,7 +2486,7 @@ function getAllItems2(curItem, layer) {
       var itemTall = convert(item.properties.getIn(['height', '_length'])).from(item.get('properties').get('height').get('_unit')).to('cm');
       var zMinItem = convert(item.properties.getIn(['altitude', '_length'])).from(item.get('properties').get('altitude').get('_unit')).to('cm');
       var zMaxItem = zMinItem + itemTall;
-      if (zMinItem >= zMinCurItem && zMinItem < zMaxCurItem || zMinCurItem >= zMinItem && zMinCurItem < zMaxItem) detectObjectsAtSameAltitudeFlag = true;
+      if (zMinItem - zMinCurItem >= 0 && zMaxCurItem - zMinItem > EPSILON || zMinCurItem - zMinItem >= 0 && zMaxItem - zMinCurItem > EPSILON) detectObjectsAtSameAltitudeFlag = true;
       if (detectObjectsAtSameAltitudeFlag) {
         var x = val.pos.x;
         var y = val.pos.y;

package/es/utils/isolate-event-handler.js

@@ -1234,7 +1234,7 @@ export function handleExternalEvent(_x10) {
 function _handleExternalEvent() {
   _handleExternalEvent = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function _callee0(props) {
     var _evt$payload3, _evt$payload4;
-    var evt, state, layerId, layer, _evt$payload, _state$catalog, cdsItems, itemKeys, _loop6, i, newScene, tempState, _props$onInternalEven, sLineCnt, element, _state$viewer2D, _evt$payload$initialP, mouseX, mouseY, v2d, vPosX, vPosY, layerID, defaulTitle, _Object$keys, _evt$payload5, doorStyle, itemCDS, isAll, _layerId, _cdsItems, allItems, selectedItemId, _itemKeys, _loop7, _i2, _props$onInternalEven2, _evt$payload6, roomShapeType, width, height, _doorStyle, value, _value, _evt$payload7, moldingInfo, isGlobal, distElement, _distElement, _evt$payload8, option, _value2, _layerId2, _layer, _layer$getIn, selectedLines, selectedHoles, selectedItems, _i4, _i5, _i6, _evt$payload9, _evt$payload0, _evt$payload1, _evt$payload10, _layerID, _layer2, orginalItemInfo, originalItem, originalItemPos, replaceItem, _props$onInternalEven3, sceneData, currentTexture, _t5, _t6;
+    var evt, state, layerId, layer, _evt$payload, _state$catalog, cdsItems, itemKeys, _loop6, i, newScene, tempState, _props$onInternalEven, sLineCnt, element, _state$viewer2D, _evt$payload$initialP, mouseX, mouseY, v2d, vPosX, vPosY, layerID, defaulTitle, _Object$keys, _evt$payload5, doorStyle, itemCDS, isAll, _layerId, _cdsItems, allItems, selectedItemId, _itemKeys, _loop7, _i2, _props$onInternalEven2, _evt$payload6, roomShapeType, width, height, measurementUnit, _doorStyle, value, _value, _evt$payload7, moldingInfo, isGlobal, distElement, _distElement, _evt$payload8, option, _value2, _layerId2, _layer, _layer$getIn, selectedLines, selectedHoles, selectedItems, _i4, _i5, _i6, _evt$payload9, _evt$payload0, _evt$payload1, _evt$payload10, _layerID, _layer2, orginalItemInfo, originalItem, originalItemPos, replaceItem, _props$onInternalEven3, sceneData, currentTexture, _t5, _t6;
     return _regeneratorRuntime.wrap(function (_context11) {
       while (1) switch (_context11.prev = _context11.next) {
         case 0:
@@ -1259,7 +1259,7 @@ function _handleExternalEvent() {
           }
           // prepare item data request
           cdsItems = [];
-          itemKeys = Object.keys(evt === null || evt === void 0 || (_evt$payload = evt.payload) === null || _evt$payload === void 0 || (_evt$payload = _evt$payload.layers['layer-1']) === null || _evt$payload === void 0 ? void 0 : _evt$payload.items) || [];
+          itemKeys = evt !== null && evt !== void 0 && (_evt$payload = evt.payload) !== null && _evt$payload !== void 0 && (_evt$payload = _evt$payload.layers['layer-1']) !== null && _evt$payload !== void 0 && _evt$payload.items ? Object.keys(evt.payload.layers['layer-1'].items) : [];
           _loop6 = /*#__PURE__*/_regeneratorRuntime.mark(function _loop6() {
             var _evt$payload2, _it$properties, _it$properties2, _it$properties3, _it$doorStyle2;
             var it;
@@ -1492,8 +1492,8 @@ function _handleExternalEvent() {
           } else props.itemsActions.setDoorStyle(doorStyle, itemCDS, isAll);
           return _context11.abrupt("continue", 45);
         case 21:
-          _evt$payload6 = evt.payload, roomShapeType = _evt$payload6.roomShapeType, width = _evt$payload6.width, height = _evt$payload6.height, _doorStyle = _evt$payload6.doorStyle;
-          props.projectActions.createRoomWithShape(roomShapeType, width, height, _doorStyle);
+          _evt$payload6 = evt.payload, roomShapeType = _evt$payload6.roomShapeType, width = _evt$payload6.width, height = _evt$payload6.height, measurementUnit = _evt$payload6.measurementUnit, _doorStyle = _evt$payload6.doorStyle;
+          props.projectActions.createRoomWithShape(roomShapeType, width, height, measurementUnit, _doorStyle);
           return _context11.abrupt("continue", 45);
         case 22:
           value = state.getIn(['viewer2D']).toJS();

package/es/utils/molding.js

@@ -939,22 +939,26 @@ export function createMonldingGroup(oldMG, layer, molding, catalog) {
   return newMG;
 }
 export function getMoldingDataOfScene2(layer, catalog, doorStyle) {
+  var _layer$items;
   var moldingData = [];
-  var items = layer.items.toArray();
+  var items = layer === null || layer === void 0 || (_layer$items = layer.items) === null || _layer$items === void 0 ? void 0 : _layer$items.toArray();
   var allLineRects = GeometryUtils.buildRectFromLines(layer, GeometryUtils.getAllLines(layer));
 
   // get all molding line segments
   var moldingLines = [];
-  items.forEach(function (item) {
+  items === null || items === void 0 || items.forEach(function (item) {
     if (item.category === ITEM_TYPE.CABINET) {
-      var _item$molding;
+      var _item$properties$get$, _item$properties$get$2, _item$properties$get$3, _item$molding;
       var MGlines = getLinesOfItem2(item, allLineRects, catalog); // exclude overlayed to wall
+      // id & width
+      var parentId = item.id;
+      var inchWidth = convert(item.properties.get('width').get('_length')).from((_item$properties$get$ = item.properties.get('width').get('_unit')) !== null && _item$properties$get$ !== void 0 ? _item$properties$get$ : 'in').to('in');
       // z position of molding line
       var z = item.properties.get('altitude').get('_length');
-      var zUnit = item.properties.get('altitude').get('_unit') || 'cm';
+      var zUnit = (_item$properties$get$2 = item.properties.get('altitude').get('_unit')) !== null && _item$properties$get$2 !== void 0 ? _item$properties$get$2 : 'in';
       z = convert(z).from(zUnit).to('cm');
       var h = item.properties.get('height').get('_length');
-      var hUnit = item.properties.get('height').get('_unit') || 'cm';
+      var hUnit = (_item$properties$get$3 = item.properties.get('height').get('_unit')) !== null && _item$properties$get$3 !== void 0 ? _item$properties$get$3 : 'in';
       h = convert(h).from(hUnit).to('cm');
       if (!isEmpty(item.molding) && isEnableItemForMolding(layer, item)) {
         // calc normal molding line
@@ -973,7 +977,9 @@ export function getMoldingDataOfScene2(layer, catalog, doorStyle) {
               molding: _objectSpread({}, molding),
               doorStyle: item.doorStyle.hasOwnProperty('id') ? item.doorStyle : !isEmpty(item.doorStyle) && item.doorStyle.toJS(),
               line: line,
-              z: lineZ
+              z: lineZ,
+              parentId: parentId,
+              inchWidth: inchWidth
             });
           });
         });
@@ -993,7 +999,9 @@ export function getMoldingDataOfScene2(layer, catalog, doorStyle) {
             },
             doorStyle: item.doorStyle.hasOwnProperty('id') ? item.doorStyle : !isEmpty(item.doorStyle) && item.doorStyle.toJS(),
             line: line,
-            z: z
+            z: z,
+            parentId: parentId,
+            inchWidth: inchWidth
           });
         });
       }
@@ -1010,14 +1018,14 @@ export function getMoldingDataOfScene2(layer, catalog, doorStyle) {
       x2: moldingLines[i].line[1].x,
       y2: moldingLines[i].line[1].y
     };
-    var _loop1 = function _loop1(j) {
-        if (i === j) return 0; // continue
-        if (Math.abs(moldingLines[i].z - moldingLines[j].z) > EPSILON) return 0; // continue
+    var _loop1 = function _loop1(_j) {
+        if (i === _j) return 0; // continue
+        if (Math.abs(moldingLines[i].z - moldingLines[_j].z) > EPSILON) return 0; // continue
         var destLine = {
-          x1: moldingLines[j].line[0].x,
-          y1: moldingLines[j].line[0].y,
-          x2: moldingLines[j].line[1].x,
-          y2: moldingLines[j].line[1].y
+          x1: moldingLines[_j].line[0].x,
+          y1: moldingLines[_j].line[0].y,
+          x2: moldingLines[_j].line[1].x,
+          y2: moldingLines[_j].line[1].y
         };
         var rst = GeometryUtils.relationshipOfTwoOverlappedLines(srcLine, destLine);
         if (rst.result === OVERLAP_SAME || rst.result === OVERLAP_INCLUDED) {
@@ -1026,7 +1034,7 @@ export function getMoldingDataOfScene2(layer, catalog, doorStyle) {
         } else if (rst.result === OVERLAP_SOME) {
           removeLineIds.push(i);
           var lineSegs = getTrimmedContourLineSegs(rst.trimmedSegs, moldingLines.filter(function (v, idx) {
-            return idx !== i && idx !== j && Math.abs(v.z - moldingLines[i].z) < EPSILON;
+            return idx !== i && idx !== _j && Math.abs(v.z - moldingLines[i].z) < EPSILON;
           }), 0);
           if (lineSegs.length > 0) {
             lineSegs.forEach(function (ls) {
@@ -1034,7 +1042,9 @@ export function getMoldingDataOfScene2(layer, catalog, doorStyle) {
                 molding: _objectSpread({}, moldingLines[i].molding),
                 doorStyle: moldingLines[i].doorStyle,
                 line: _toConsumableArray(ls),
-                z: moldingLines[i].z
+                z: moldingLines[i].z,
+                parentId: moldingLines[i].parentId,
+                inchWidth: moldingLines[i].inchWidth
               });
             });
           }
@@ -1042,8 +1052,8 @@ export function getMoldingDataOfScene2(layer, catalog, doorStyle) {
         }
       },
       _ret4;
-    for (var j = 0; j < moldingLines.length; j++) {
-      _ret4 = _loop1(j);
+    for (var _j = 0; _j < moldingLines.length; _j++) {
+      _ret4 = _loop1(_j);
       if (_ret4 === 0) continue;
       if (_ret4 === 1) break;
     }
@@ -1057,12 +1067,32 @@ export function getMoldingDataOfScene2(layer, catalog, doorStyle) {
     });
   });
   if (newLines.length > 0) moldingLines = [].concat(_toConsumableArray(moldingLines), newLines);
+
+  // filter again for toe kick molding lines
+  // only remain one line per toe kick molding item
+  var duplicatedLineIdxs = [];
+  for (var _i4 = 0; _i4 < moldingLines.length; _i4++) {
+    var _iml$molding;
+    if (duplicatedLineIdxs.includes(_i4)) continue;
+    var iml = moldingLines[_i4];
+    if (((_iml$molding = iml.molding) === null || _iml$molding === void 0 ? void 0 : _iml$molding.name) !== TOE_KICK_MOLDING) continue;
+    for (var j = 0; j < moldingLines.length; j++) {
+      if (_i4 === j) continue;
+      var jml = moldingLines[j];
+      if (jml.parentId === iml.parentId) duplicatedLineIdxs.push(j);
+    }
+  }
+  moldingLines = moldingLines.filter(function (line, idx) {
+    return !duplicatedLineIdxs.some(function (id) {
+      return idx === id;
+    });
+  });
   // console.log('moldingLines: ', moldingLines);
 
   // make molding data with sorting molding & doorStyle
   var _loop0 = function _loop0() {
     var ml = moldingLines[k];
-    var mlLength = convert(GeometryUtils.verticesDistance(ml.line[0], ml.line[1])).from('cm').to('in');
+    var mlLength = ml.molding.name === TOE_KICK_MOLDING ? ml.inchWidth : convert(GeometryUtils.verticesDistance(ml.line[0], ml.line[1])).from('cm').to('in');
     var idx = moldingData.findIndex(function (v) {
       var _ml$molding, _v$doorStyle, _ml$doorStyle;
       return (v === null || v === void 0 ? void 0 : v.name) === ((_ml$molding = ml.molding) === null || _ml$molding === void 0 ? void 0 : _ml$molding.name) && ((_v$doorStyle = v.doorStyle) === null || _v$doorStyle === void 0 ? void 0 : _v$doorStyle.id) === ((_ml$doorStyle = ml.doorStyle) === null || _ml$doorStyle === void 0 ? void 0 : _ml$doorStyle.id);

package/es/utils/ruler.js

@@ -5,7 +5,7 @@ import { UNIT_CENTIMETER, UNIT_INCH, UNIT_MILLIMETER } from "../constants";
 var MIN_LENGTH_TO_SHOW_RULER_LINE_INCH = 13;
 
 // Below this length, the measurement VALUE (text) is hidden
-var MIN_LENGTH_TO_SHOW_RULER_VALUE_INCH = 5;
+var MIN_LENGTH_TO_SHOW_RULER_VALUE_INCH = 3;
 function formatDistance(value, fixed) {
   // format with fixed decimals first
   var text = value.toFixed(fixed);
@@ -15,7 +15,7 @@ function formatDistance(value, fixed) {
   // 2.00 -> 2
   // 2.50 -> 2.5
   // 200.00 -> 200
-  text = text.replace(/\.?0+$/, '');
+  text = text.replace(/(\.\d*?)0+$/, '$1').replace(/\.$/, '');
   return text;
 }
 function getUnitString(unit) {
@@ -32,7 +32,7 @@ export function getRulerDisplayData(_ref) {
     charWidth = _ref$charWidth === void 0 ? 8 : _ref$charWidth;
   // 7.62 cm -> ruLength 2.99 in
   var ruLength = convert(length).from(unit).to(rulerUnit);
-  var fixedLength = layerUnit === UNIT_MILLIMETER ? 0 : layerUnit === UNIT_CENTIMETER ? 1 : 2;
+  var fixedLength = layerUnit === UNIT_INCH ? 0 : layerUnit === UNIT_MILLIMETER ? 0 : layerUnit === UNIT_CENTIMETER ? 1 : 2;
 
   // 2.99 in -> valueInLayerUnit 2.99 in
   var valueInLayerUnit = convert(ruLength).from(rulerUnit).to(layerUnit);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kitchen-simulator",
-  "version": "5.0.4-react.18",
+  "version": "5.10.1-react.18",
   "description": "It is a kitchen simulator (self-contained micro-frontend).",
   "license": "MIT",
   "module": "es/index.js",