@react-three/fiber 9.0.4 → 9.1.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @react-three/fiber
 
+## 9.1.0
+
+### Minor Changes
+
+- cbc79507600b81f6a39de9f3f0ecb3aaf811233f: feat: add meshes to loader graph, misc internal fixes
+
 ## 9.0.4
 
 ### Patch Changes

package/dist/declarations/src/core/utils.d.ts

@@ -138,6 +138,9 @@ export interface ObjectMap {
     materials: {
         [name: string]: THREE.Material;
     };
+    meshes: {
+        [name: string]: THREE.Mesh;
+    };
 }
 export declare function calculateDpr(dpr: Dpr): number;
 /**

package/dist/{events-ff8de4d2.cjs.prod.js → events-9e217aef.cjs.prod.js}

@@ -184,12 +184,14 @@ const is = {
 function buildGraph(object) {
   const data = {
     nodes: {},
-    materials: {}
+    materials: {},
+    meshes: {}
   };
   if (object) {
     object.traverse(obj => {
       if (obj.name) data.nodes[obj.name] = obj;
       if (obj.material && !data.materials[obj.material.name]) data.materials[obj.material.name] = obj.material;
+      if (obj.isMesh && !data.meshes[obj.name]) data.meshes[obj.name] = obj;
     });
   }
   return data;
@@ -236,7 +238,6 @@ function prepare(target, root, type, props) {
   return instance;
 }
 function resolve(root, key) {
-  var _target;
   let target = root[key];
   if (!key.includes('-')) return {
     root,
@@ -245,12 +246,16 @@ function resolve(root, key) {
   };
 
   // Resolve pierced target
-  const chain = key.split('-');
-  target = chain.reduce((acc, key) => acc[key], root);
-  key = chain.pop();
+  target = root;
+  for (const part of key.split('-')) {
+    var _target;
+    key = part;
+    root = target;
+    target = (_target = target) == null ? void 0 : _target[key];
+  }
+
+  // TODO: change key to 'foo-bar' if target is undefined?
 
-  // Switch root if atomic
-  if (!((_target = target) != null && _target.set)) root = chain.reduce((acc, key) => acc[key], root);
   return {
     root,
     key,
@@ -1357,15 +1362,24 @@ function handleContainerEffects(parent, child, beforeChild) {
   } else if (isObject3D(child.object) && isObject3D(parent.object)) {
     const childIndex = parent.object.children.indexOf(beforeChild == null ? void 0 : beforeChild.object);
     if (beforeChild && childIndex !== -1) {
-      child.object.parent = parent.object;
-      parent.object.children.splice(childIndex, 0, child.object);
-      child.object.dispatchEvent({
-        type: 'added'
-      });
-      parent.object.dispatchEvent({
-        type: 'childadded',
-        child: child.object
-      });
+      // If the child is already in the parent's children array, move it to the new position
+      // Otherwise, just insert it at the target position
+      const existingIndex = parent.object.children.indexOf(child.object);
+      if (existingIndex !== -1) {
+        parent.object.children.splice(existingIndex, 1);
+        const adjustedIndex = existingIndex < childIndex ? childIndex - 1 : childIndex;
+        parent.object.children.splice(adjustedIndex, 0, child.object);
+      } else {
+        child.object.parent = parent.object;
+        parent.object.children.splice(childIndex, 0, child.object);
+        child.object.dispatchEvent({
+          type: 'added'
+        });
+        parent.object.dispatchEvent({
+          type: 'childadded',
+          child: child.object
+        });
+      }
     } else {
       parent.object.add(child.object);
     }

package/dist/{events-cee74b95.cjs.dev.js → events-d47554c5.cjs.dev.js}

@@ -184,12 +184,14 @@ const is = {
 function buildGraph(object) {
   const data = {
     nodes: {},
-    materials: {}
+    materials: {},
+    meshes: {}
   };
   if (object) {
     object.traverse(obj => {
       if (obj.name) data.nodes[obj.name] = obj;
       if (obj.material && !data.materials[obj.material.name]) data.materials[obj.material.name] = obj.material;
+      if (obj.isMesh && !data.meshes[obj.name]) data.meshes[obj.name] = obj;
     });
   }
   return data;
@@ -236,7 +238,6 @@ function prepare(target, root, type, props) {
   return instance;
 }
 function resolve(root, key) {
-  var _target;
   let target = root[key];
   if (!key.includes('-')) return {
     root,
@@ -245,12 +246,16 @@ function resolve(root, key) {
   };
 
   // Resolve pierced target
-  const chain = key.split('-');
-  target = chain.reduce((acc, key) => acc[key], root);
-  key = chain.pop();
+  target = root;
+  for (const part of key.split('-')) {
+    var _target;
+    key = part;
+    root = target;
+    target = (_target = target) == null ? void 0 : _target[key];
+  }
+
+  // TODO: change key to 'foo-bar' if target is undefined?
 
-  // Switch root if atomic
-  if (!((_target = target) != null && _target.set)) root = chain.reduce((acc, key) => acc[key], root);
   return {
     root,
     key,
@@ -1357,15 +1362,24 @@ function handleContainerEffects(parent, child, beforeChild) {
   } else if (isObject3D(child.object) && isObject3D(parent.object)) {
     const childIndex = parent.object.children.indexOf(beforeChild == null ? void 0 : beforeChild.object);
     if (beforeChild && childIndex !== -1) {
-      child.object.parent = parent.object;
-      parent.object.children.splice(childIndex, 0, child.object);
-      child.object.dispatchEvent({
-        type: 'added'
-      });
-      parent.object.dispatchEvent({
-        type: 'childadded',
-        child: child.object
-      });
+      // If the child is already in the parent's children array, move it to the new position
+      // Otherwise, just insert it at the target position
+      const existingIndex = parent.object.children.indexOf(child.object);
+      if (existingIndex !== -1) {
+        parent.object.children.splice(existingIndex, 1);
+        const adjustedIndex = existingIndex < childIndex ? childIndex - 1 : childIndex;
+        parent.object.children.splice(adjustedIndex, 0, child.object);
+      } else {
+        child.object.parent = parent.object;
+        parent.object.children.splice(childIndex, 0, child.object);
+        child.object.dispatchEvent({
+          type: 'added'
+        });
+        parent.object.dispatchEvent({
+          type: 'childadded',
+          child: child.object
+        });
+      }
     } else {
       parent.object.add(child.object);
     }

package/dist/{events-2895749c.esm.js → events-f80b1519.esm.js}

@@ -158,12 +158,14 @@ const is = {
 function buildGraph(object) {
   const data = {
     nodes: {},
-    materials: {}
+    materials: {},
+    meshes: {}
   };
   if (object) {
     object.traverse(obj => {
       if (obj.name) data.nodes[obj.name] = obj;
       if (obj.material && !data.materials[obj.material.name]) data.materials[obj.material.name] = obj.material;
+      if (obj.isMesh && !data.meshes[obj.name]) data.meshes[obj.name] = obj;
     });
   }
   return data;
@@ -210,7 +212,6 @@ function prepare(target, root, type, props) {
   return instance;
 }
 function resolve(root, key) {
-  var _target;
   let target = root[key];
   if (!key.includes('-')) return {
     root,
@@ -219,12 +220,16 @@ function resolve(root, key) {
   };
 
   // Resolve pierced target
-  const chain = key.split('-');
-  target = chain.reduce((acc, key) => acc[key], root);
-  key = chain.pop();
+  target = root;
+  for (const part of key.split('-')) {
+    var _target;
+    key = part;
+    root = target;
+    target = (_target = target) == null ? void 0 : _target[key];
+  }
+
+  // TODO: change key to 'foo-bar' if target is undefined?
 
-  // Switch root if atomic
-  if (!((_target = target) != null && _target.set)) root = chain.reduce((acc, key) => acc[key], root);
   return {
     root,
     key,
@@ -1331,15 +1336,24 @@ function handleContainerEffects(parent, child, beforeChild) {
   } else if (isObject3D(child.object) && isObject3D(parent.object)) {
     const childIndex = parent.object.children.indexOf(beforeChild == null ? void 0 : beforeChild.object);
     if (beforeChild && childIndex !== -1) {
-      child.object.parent = parent.object;
-      parent.object.children.splice(childIndex, 0, child.object);
-      child.object.dispatchEvent({
-        type: 'added'
-      });
-      parent.object.dispatchEvent({
-        type: 'childadded',
-        child: child.object
-      });
+      // If the child is already in the parent's children array, move it to the new position
+      // Otherwise, just insert it at the target position
+      const existingIndex = parent.object.children.indexOf(child.object);
+      if (existingIndex !== -1) {
+        parent.object.children.splice(existingIndex, 1);
+        const adjustedIndex = existingIndex < childIndex ? childIndex - 1 : childIndex;
+        parent.object.children.splice(adjustedIndex, 0, child.object);
+      } else {
+        child.object.parent = parent.object;
+        parent.object.children.splice(childIndex, 0, child.object);
+        child.object.dispatchEvent({
+          type: 'added'
+        });
+        parent.object.dispatchEvent({
+          type: 'childadded',
+          child: child.object
+        });
+      }
     } else {
       parent.object.add(child.object);
     }

package/dist/react-three-fiber.cjs.dev.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var events = require('./events-cee74b95.cjs.dev.js');
+var events = require('./events-d47554c5.cjs.dev.js');
 var React = require('react');
 var THREE = require('three');
 var useMeasure = require('react-use-measure');

package/dist/react-three-fiber.cjs.prod.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var events = require('./events-ff8de4d2.cjs.prod.js');
+var events = require('./events-9e217aef.cjs.prod.js');
 var React = require('react');
 var THREE = require('three');
 var useMeasure = require('react-use-measure');

package/dist/react-three-fiber.esm.js

@@ -1,5 +1,5 @@
-import { e as extend, u as useBridge, a as useMutableCallback, b as useIsomorphicLayoutEffect, c as createRoot, i as isRef, E as ErrorBoundary, B as Block, d as unmountComponentAtNode, f as createPointerEvents } from './events-2895749c.esm.js';
-export { t as ReactThreeFiber, _ as _roots, w as act, k as addAfterEffect, j as addEffect, l as addTail, n as advance, q as applyProps, x as buildGraph, p as context, g as createEvents, o as createPortal, c as createRoot, v as dispose, f as events, e as extend, h as flushGlobalEffects, s as getRootState, m as invalidate, r as reconciler, d as unmountComponentAtNode, C as useFrame, D as useGraph, y as useInstanceHandle, F as useLoader, z as useStore, A as useThree } from './events-2895749c.esm.js';
+import { e as extend, u as useBridge, a as useMutableCallback, b as useIsomorphicLayoutEffect, c as createRoot, i as isRef, E as ErrorBoundary, B as Block, d as unmountComponentAtNode, f as createPointerEvents } from './events-f80b1519.esm.js';
+export { t as ReactThreeFiber, _ as _roots, w as act, k as addAfterEffect, j as addEffect, l as addTail, n as advance, q as applyProps, x as buildGraph, p as context, g as createEvents, o as createPortal, c as createRoot, v as dispose, f as events, e as extend, h as flushGlobalEffects, s as getRootState, m as invalidate, r as reconciler, d as unmountComponentAtNode, C as useFrame, D as useGraph, y as useInstanceHandle, F as useLoader, z as useStore, A as useThree } from './events-f80b1519.esm.js';
 import * as React from 'react';
 import * as THREE from 'three';
 import useMeasure from 'react-use-measure';

package/native/dist/react-three-fiber-native.cjs.dev.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var events = require('../../dist/events-cee74b95.cjs.dev.js');
+var events = require('../../dist/events-d47554c5.cjs.dev.js');
 var React = require('react');
 var THREE = require('three');
 var reactNative = require('react-native');

package/native/dist/react-three-fiber-native.cjs.prod.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var events = require('../../dist/events-ff8de4d2.cjs.prod.js');
+var events = require('../../dist/events-9e217aef.cjs.prod.js');
 var React = require('react');
 var THREE = require('three');
 var reactNative = require('react-native');

package/native/dist/react-three-fiber-native.esm.js

@@ -1,5 +1,5 @@
-import { e as extend, u as useBridge, a as useMutableCallback, c as createRoot, b as useIsomorphicLayoutEffect, E as ErrorBoundary, B as Block, d as unmountComponentAtNode, f as createPointerEvents, g as createEvents } from '../../dist/events-2895749c.esm.js';
-export { t as ReactThreeFiber, _ as _roots, w as act, k as addAfterEffect, j as addEffect, l as addTail, n as advance, q as applyProps, x as buildGraph, p as context, g as createEvents, o as createPortal, c as createRoot, v as dispose, e as extend, h as flushGlobalEffects, s as getRootState, m as invalidate, r as reconciler, d as unmountComponentAtNode, C as useFrame, D as useGraph, y as useInstanceHandle, F as useLoader, z as useStore, A as useThree } from '../../dist/events-2895749c.esm.js';
+import { e as extend, u as useBridge, a as useMutableCallback, c as createRoot, b as useIsomorphicLayoutEffect, E as ErrorBoundary, B as Block, d as unmountComponentAtNode, f as createPointerEvents, g as createEvents } from '../../dist/events-f80b1519.esm.js';
+export { t as ReactThreeFiber, _ as _roots, w as act, k as addAfterEffect, j as addEffect, l as addTail, n as advance, q as applyProps, x as buildGraph, p as context, g as createEvents, o as createPortal, c as createRoot, v as dispose, e as extend, h as flushGlobalEffects, s as getRootState, m as invalidate, r as reconciler, d as unmountComponentAtNode, C as useFrame, D as useGraph, y as useInstanceHandle, F as useLoader, z as useStore, A as useThree } from '../../dist/events-f80b1519.esm.js';
 import * as React from 'react';
 import * as THREE from 'three';
 import { PanResponder, PixelRatio, StyleSheet, View, Platform, Image, NativeModules } from 'react-native';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-three/fiber",
-  "version": "9.0.4",
+  "version": "9.1.0",
   "description": "A React renderer for Threejs",
   "keywords": [
     "react",