door_models 5.4.4 → 5.4.5

package/dist/index.cjs.js

@@ -111,6 +111,7 @@ const ConfiguratorProvider = _ref => {
   const [cpid, setCpid] = React.useState("");
   const [totalHeight, setTotalHeight] = React.useState(2700);
   const [totalWidth, setTotalWidth] = React.useState(974);
+  const [totalDepth, setTotalDepth] = React.useState(103);
   const [glassVisible, setGlassVisible] = React.useState(false);
   const [glassDepth, setGlassDepth] = React.useState(8);
   const [isDoubleDoor, setIsDoubleDoor] = React.useState(false);
@@ -191,6 +192,7 @@ const ConfiguratorProvider = _ref => {
     material: "infill_material",
     depth: 20
   });
+  const [baseConfig, setBaseConfig] = React.useState(null);
   const [frameType, setFrameType] = React.useState("AF20_40");
   const [bodyType, setBodyType] = React.useState("40");
   const [exteriorFanlightType, setExteriorFanlightType] = React.useState("WPFL");
@@ -599,6 +601,9 @@ const ConfiguratorProvider = _ref => {
         };
         break;
     }
+
+    // Store pristine settings for scaling
+    setBaseConfig(newSettings);
     const isMxCaf = frameType.startsWith("MXCAF");
     setFrontCoverPanel(prev => _objectSpread2(_objectSpread2({}, prev), {}, {
       visible: isMxCaf
@@ -616,8 +621,65 @@ const ConfiguratorProvider = _ref => {
         theDoorDepth: doorDepth
       }));
     }
+
+    // Sync totalDepth with the frame's default depth when frame type changes.
+    if (newSettings.frameDepth) {
+      setTotalDepth(newSettings.frameDepth);
+    }
   }, [frameType]);
 
+  // --- useEffect for scaling based on totalDepth ---
+  React.useEffect(() => {
+    if (!baseConfig || !baseConfig.frameDepth || baseConfig.frameDepth === 0) return;
+    const baseFrameDepth = baseConfig.frameDepth;
+    const ratio = totalDepth / baseFrameDepth;
+    const scaleProportionally = value => {
+      if (typeof value === "number") {
+        return value * ratio;
+      }
+      if (typeof value === "string" && value.endsWith("mm")) {
+        const num = parseFloat(value);
+        if (!isNaN(num)) {
+          return num * ratio + "mm";
+        }
+      }
+      return value; // Return original if not scalable
+    };
+    setDoorFrame(prev => _objectSpread2(_objectSpread2({}, prev), {}, {
+      frameDepth: totalDepth,
+      doorStopDepth: scaleProportionally(baseConfig.doorStopDepth),
+      notchDepth: scaleProportionally(baseConfig.notchDepth),
+      gasketDepth: scaleProportionally(baseConfig.gasketDepth),
+      secondDoorStopDepth: scaleProportionally(baseConfig.secondDoorStopDepth)
+    }));
+    if (baseConfig.doorDepth !== undefined) {
+      const baseDoorDepth = baseConfig.doorDepth;
+      const frameDelta = totalDepth - baseFrameDepth;
+      let newDoorDepth;
+      if (frameDelta > 0) {
+        // --- THIS IS THE VALUE TO TWEAK ---
+        // Increase this multiplier to make the door body grow faster when totalDepth increases.
+        // A value of 1.0 means it grows at the same rate as the frame.
+        // A value of 2.0 means it grows twice as fast as the frame.
+        const increaseMultiplier = 0.8;
+        newDoorDepth = baseDoorDepth + frameDelta * increaseMultiplier;
+      } else {
+        // When decreasing totalDepth, the door body scales down proportionally.
+        newDoorDepth = baseDoorDepth * ratio;
+      }
+      setDoor(prev => _objectSpread2(_objectSpread2({}, prev), {}, {
+        theDoorDepth: newDoorDepth
+      }));
+    }
+    const baseCoverPanelDepth = 12;
+    setFrontCoverPanel(prev => _objectSpread2(_objectSpread2({}, prev), {}, {
+      depth: baseCoverPanelDepth * ratio
+    }));
+    setBackCoverPanel(prev => _objectSpread2(_objectSpread2({}, prev), {}, {
+      depth: baseCoverPanelDepth * ratio
+    }));
+  }, [totalDepth, baseConfig]);
+
   // ---  Exterior Fanlight Logic ---
   React.useEffect(() => {
     if (!exteriorFanlight.visible) return;
@@ -698,6 +760,8 @@ const ConfiguratorProvider = _ref => {
       setBodyType,
       totalHeight,
       setTotalHeight,
+      totalDepth,
+      setTotalDepth,
       totalWidth,
       setTotalWidth,
       exteriorFanlightType,
@@ -1428,7 +1492,7 @@ function DoorModels(_ref7) {
     doorOpening: doorOpeningProp,
     totalWidth: totalWidthProp,
     totalHeight: totalHeightProp,
-    frameDepth: frameDepthProp
+    totalDepth: totalDepthProp
   } = _ref7;
   const {
     is2D,
@@ -1449,7 +1513,8 @@ function DoorModels(_ref7) {
     isDoubleDoor,
     setMaterials,
     setTotalWidth,
-    setTotalHeight
+    setTotalHeight,
+    setTotalDepth
   } = useConfigurator();
   React.useEffect(() => {
     if (doorName) {
@@ -1481,12 +1546,10 @@ function DoorModels(_ref7) {
     }
   }, [totalHeightProp, setTotalHeight]);
   React.useEffect(() => {
-    if (frameDepthProp !== undefined) {
-      setDoorFrame(prev => _objectSpread2(_objectSpread2({}, prev), {}, {
-        frameDepth: frameDepthProp
-      }));
+    if (totalDepthProp !== undefined) {
+      setTotalDepth(totalDepthProp);
     }
-  }, [frameDepthProp, setDoorFrame]);
+  }, [totalDepthProp, setTotalDepth]);
 
   // --- Material Logic (Centralized in parent component) ---
   const allMaterials = useDoorMaterials(materialsProp);
@@ -2290,7 +2353,7 @@ const DoorConfigurator = _ref => {
     is2D = false,
     totalWidth,
     totalHeight,
-    frameDepth
+    totalDepth
   } = _ref;
   return /*#__PURE__*/jsxRuntime.jsx(ConfiguratorProvider, {
     initialIs2D: is2D,
@@ -2301,7 +2364,7 @@ const DoorConfigurator = _ref => {
       doorOpening: doorOpening,
       totalWidth: totalWidth,
       totalHeight: totalHeight,
-      frameDepth: frameDepth
+      totalDepth: totalDepth
     })
   });
 };