door_models 5.4.2 → 5.4.4

package/dist/index.cjs.js

@@ -8,7 +8,6 @@ var csg = require('@react-three/csg');
 var three = require('@react-spring/three');
 var THREE = require('three');
 var drei = require('@react-three/drei');
-var fiber = require('@react-three/fiber');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -727,74 +726,61 @@ const useConfigurator = () => {
 
 const availableMaterials = {
   black: new THREE__namespace.MeshStandardMaterial({
-    color: "#000000",
-    side: THREE__namespace.DoubleSide
+    color: "#000000"
   }),
   metal: new THREE__namespace.MeshStandardMaterial({
     color: "#aaaaaa",
     metalness: 1.0,
-    roughness: 0.4,
-    side: THREE__namespace.DoubleSide
+    roughness: 0.4
   }),
   darkgrey: new THREE__namespace.MeshStandardMaterial({
-    color: "#5e5e5e",
-    side: THREE__namespace.DoubleSide
+    color: "#5e5e5e"
   }),
   grey: new THREE__namespace.MeshStandardMaterial({
-    color: "#cccccc",
-    side: THREE__namespace.DoubleSide
+    color: "#cccccc"
   }),
   yellow: new THREE__namespace.MeshStandardMaterial({
-    color: "#ffff00",
-    side: THREE__namespace.DoubleSide
+    color: "#ffff00"
   }),
   darkBrown: new THREE__namespace.MeshStandardMaterial({
-    color: "#a0522d",
-    side: THREE__namespace.DoubleSide
+    color: "#a0522d"
   }),
   brown: new THREE__namespace.MeshStandardMaterial({
-    color: "#d2b48c",
-    side: THREE__namespace.DoubleSide
+    color: "#d2b48c"
   }),
   glass: new THREE__namespace.MeshStandardMaterial({
     color: "#ffffff",
     roughness: 0.1,
     transparent: true,
-    opacity: 0.7,
-    side: THREE__namespace.DoubleSide
+    opacity: 0.7
   }),
   aluminum: new THREE__namespace.MeshStandardMaterial({
     color: "#abb0aa",
     metalness: 0.8,
     roughness: 0.5,
-    envMapIntensity: 1.2,
-    side: THREE__namespace.DoubleSide
+    envMapIntensity: 1.2
   }),
   aluminumBrighter: new THREE__namespace.MeshStandardMaterial({
     color: "#cdcdcd",
     metalness: 0.8,
     roughness: 0.5,
-    envMapIntensity: 1.2,
-    side: THREE__namespace.DoubleSide
+    envMapIntensity: 1.2
   }),
   aluminumExtraBrighter: new THREE__namespace.MeshStandardMaterial({
     color: "#ececec",
     metalness: 0.8,
     roughness: 0.5,
-    envMapIntensity: 1.2,
-    side: THREE__namespace.DoubleSide
+    envMapIntensity: 1.2
   }),
   silver: new THREE__namespace.MeshStandardMaterial({
     color: "#c0c0c0",
     metalness: 1.0,
-    roughness: 0.2,
-    side: THREE__namespace.DoubleSide
+    roughness: 0.2
   }),
   gold: new THREE__namespace.MeshStandardMaterial({
     color: "#ffd700",
     metalness: 1.0,
-    roughness: 0.3,
-    side: THREE__namespace.DoubleSide
+    roughness: 0.3
   }),
   diamond: new THREE__namespace.MeshStandardMaterial({
     color: "#e0f7fa",
@@ -802,24 +788,20 @@ const availableMaterials = {
     roughness: 0.05,
     transparent: true,
     opacity: 0.9,
-    envMapIntensity: 1.5,
-    side: THREE__namespace.DoubleSide
+    envMapIntensity: 1.5
   }),
   test_material: new THREE__namespace.MeshStandardMaterial({
     color: "red",
-    roughness: 0.1,
-    side: THREE__namespace.DoubleSide
+    roughness: 0.1
   })
 };
 new THREE__namespace.MeshStandardMaterial({
   color: "#cccccc",
-  roughness: 0.8,
-  side: THREE__namespace.DoubleSide
+  roughness: 0.8
 });
 new THREE__namespace.MeshStandardMaterial({
   color: "#000",
-  roughness: 0.8,
-  side: THREE__namespace.DoubleSide
+  roughness: 0.8
 });
 
 // Helper function to check for hex color codes
@@ -827,13 +809,12 @@ const isHexColor = str => /^#([0-9A-F]{3}){1,2}$/i.test(str);
 
 /**
  * A simple "builder" that creates a THREE.MeshStandardMaterial from a prop and an
- * optional map of pre-loaded textures. It does NOT load textures itself.
+ * optional map of pre-loaded textures. It now loads textures if they are not pre-loaded.
  * @param prop - The material definition (string or object).
  * @param textures - A map of URL -> THREE.Texture, provided by useTexture.
  * @returns A THREE.MeshStandardMaterial instance.
  */
-const BuildMaterial = (prop, textures) => {
-  const texture = fiber.useLoader(THREE.TextureLoader, "https://threejs.org/examples/textures/hardwood2_diffuse.jpg");
+const buildMaterial = (prop, textures) => {
   if (!prop) {
     return new THREE__namespace.MeshStandardMaterial({
       color: "#cccccc",
@@ -842,19 +823,39 @@ const BuildMaterial = (prop, textures) => {
   }
   const sourceValue = typeof prop === "string" ? prop : prop.value;
   const opacity = typeof prop === "object" ? prop.opacity : 1;
+
+  // Start with base parameters.
   const params = {
-    roughness: 0.8
+    roughness: 0.8,
+    side: THREE__namespace.DoubleSide
   };
   if (isHexColor(sourceValue)) {
+    // It's a color. Explicitly set the color and ensure no texture is applied.
     params.color = sourceValue;
-  } else if (textures && textures[sourceValue]) {
-    params.map = texture;
+    params.map = null;
   } else {
-    params.color = "#cccccc";
+    // It's a texture. Explicitly set the color to white to avoid tinting the texture.
+    params.color = "#ffffff";
+    let texture = null;
+    if (textures && textures[sourceValue]) {
+      // Use the pre-loaded texture.
+      texture = textures[sourceValue];
+    } else if (sourceValue) {
+      // Not pre-loaded, so load it now.
+      // TextureLoader caches results internally, so this is efficient.
+      texture = new THREE__namespace.TextureLoader().load(sourceValue);
+    }
+    params.map = texture;
   }
+
+  // Handle transparency explicitly to prevent lingering state.
   if (opacity !== undefined && opacity < 1) {
     params.transparent = true;
     params.opacity = opacity;
+  } else {
+    // Explicitly turn transparency off if opacity is 1 or undefined.
+    params.transparent = false;
+    params.opacity = 1;
   }
   return new THREE__namespace.MeshStandardMaterial(params);
 };
@@ -904,7 +905,7 @@ const useDoorMaterials = function () {
   // 4. Now that textures are guaranteed to be loaded, build all materials.
   // This memo ensures the materials are only created when props or textures change.
   return React.useMemo(() => {
-    const build = prop => BuildMaterial(prop, textureMap);
+    const build = prop => buildMaterial(prop, textureMap);
     return {
       doorMaterial: build(materialsProp.Body),
       frameMaterial: build(getFirstValidValue([materialsProp.D_PRF_COLOR, materialsProp.D_FR_SRF_DECOR, materialsProp.D_FR_SRF_DECOR_S2])),