@react-three/fiber - npm Package Compare versions

Comparing version 7.0.11 to 7.0.12

CHANGELOG.md

 # @react-three/fiber
 
+## 7.0.12
+
+### Patch Changes
+
+- 0df6073: fix: missed events
+
 ## 7.0.11
@@ -4,0 +10,0 @@

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

@@ -193,3 +193,3 @@ 'use strict';
 
-  function handleIntersects(intersections, event, callback) {
+  function handleIntersects(intersections, event, delta, callback) {
     const {
@@ -204,3 +204,2 @@ raycaster,
       const unprojectedPoint = temp.set(mouse.x, mouse.y, 0).unproject(camera);
-      const delta = event.type === 'click' ? calculateDistance(event) : 0;
 
@@ -351,16 +350,24 @@ const releasePointerCapture = id => event.target.releasePointerCapture(id);
       const isPointerMove = name === 'onPointerMove';
+      const isClickEvent = name === 'onClick' || name === 'onContextMenu' || name === 'onDoubleClick';
       const filter = isPointerMove ? filterPointerEvents : undefined;
-      const hits = patchIntersects(intersect(filter), event); // Take care of unhover
+      const hits = patchIntersects(intersect(filter), event);
+      const delta = isClickEvent ? calculateDistance(event) : 0; // Save initial coordinates on pointer-down
 
-      if (isPointerMove) cancelPointer(hits); // If a click yields no results, pass it back to the user as a miss
-      // This has to come first because event order affects side-effect cleanup
+      if (name === 'onPointerDown') {
+        internal.initialClick = [event.offsetX, event.offsetY];
+        internal.initialHits = hits.map(hit => hit.eventObject);
+      } // If a click yields no results, pass it back to the user as a miss
+      // Missed events have to come first in order to establish user-land side-effect clean up
 
-      if ((name === 'onClick' || name === 'onContextMenu' || name === 'onDoubleClick') && !hits.length) {
-        if (calculateDistance(event) <= 2) {
+
+      if (isClickEvent && !hits.length) {
+        if (delta <= 2) {
           pointerMissed(event, internal.interaction);
           if (onPointerMissed) onPointerMissed(event);
         }
-      }
+      } // Take care of unhover
 
-      handleIntersects(hits, event, data => {
+
+      if (isPointerMove) cancelPointer(hits);
+      handleIntersects(hits, event, delta, data => {
         const eventObject = data.eventObject;
@@ -399,4 +406,4 @@ const handlers = eventObject.__r3f.handlers; // Check presence of handlers
             if (name !== 'onClick' && name !== 'onContextMenu' && name !== 'onDoubleClick' || internal.initialHits.includes(eventObject)) {
-              // Missed pointers have to come first ...
-              pointerMissed(event, internal.interaction.filter(object => !internal.initialHits.includes(object))); // ... and then the hit object
+              // Missed events have to come first
+              pointerMissed(event, internal.interaction.filter(object => !internal.initialHits.includes(object))); // Now call the handler
 
@@ -406,8 +413,2 @@ handler(data);
           }
-        } // Save initial coordinates on pointer-down
-
-
-        if (name === 'onPointerDown') {
-          internal.initialClick = [event.offsetX, event.offsetY];
-          internal.initialHits = hits.map(hit => hit.eventObject);
         }
@@ -414,0 +415,0 @@ });

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

@@ -193,3 +193,3 @@ 'use strict';
 
-  function handleIntersects(intersections, event, callback) {
+  function handleIntersects(intersections, event, delta, callback) {
     const {
@@ -204,3 +204,2 @@ raycaster,
       const unprojectedPoint = temp.set(mouse.x, mouse.y, 0).unproject(camera);
-      const delta = event.type === 'click' ? calculateDistance(event) : 0;
 
@@ -351,16 +350,24 @@ const releasePointerCapture = id => event.target.releasePointerCapture(id);
       const isPointerMove = name === 'onPointerMove';
+      const isClickEvent = name === 'onClick' || name === 'onContextMenu' || name === 'onDoubleClick';
       const filter = isPointerMove ? filterPointerEvents : undefined;
-      const hits = patchIntersects(intersect(filter), event); // Take care of unhover
+      const hits = patchIntersects(intersect(filter), event);
+      const delta = isClickEvent ? calculateDistance(event) : 0; // Save initial coordinates on pointer-down
 
-      if (isPointerMove) cancelPointer(hits); // If a click yields no results, pass it back to the user as a miss
-      // This has to come first because event order affects side-effect cleanup
+      if (name === 'onPointerDown') {
+        internal.initialClick = [event.offsetX, event.offsetY];
+        internal.initialHits = hits.map(hit => hit.eventObject);
+      } // If a click yields no results, pass it back to the user as a miss
+      // Missed events have to come first in order to establish user-land side-effect clean up
 
-      if ((name === 'onClick' || name === 'onContextMenu' || name === 'onDoubleClick') && !hits.length) {
-        if (calculateDistance(event) <= 2) {
+
+      if (isClickEvent && !hits.length) {
+        if (delta <= 2) {
           pointerMissed(event, internal.interaction);
           if (onPointerMissed) onPointerMissed(event);
         }
-      }
+      } // Take care of unhover
 
-      handleIntersects(hits, event, data => {
+
+      if (isPointerMove) cancelPointer(hits);
+      handleIntersects(hits, event, delta, data => {
         const eventObject = data.eventObject;
@@ -399,4 +406,4 @@ const handlers = eventObject.__r3f.handlers; // Check presence of handlers
             if (name !== 'onClick' && name !== 'onContextMenu' && name !== 'onDoubleClick' || internal.initialHits.includes(eventObject)) {
-              // Missed pointers have to come first ...
-              pointerMissed(event, internal.interaction.filter(object => !internal.initialHits.includes(object))); // ... and then the hit object
+              // Missed events have to come first
+              pointerMissed(event, internal.interaction.filter(object => !internal.initialHits.includes(object))); // Now call the handler
 
@@ -406,8 +413,2 @@ handler(data);
           }
-        } // Save initial coordinates on pointer-down
-
-
-        if (name === 'onPointerDown') {
-          internal.initialClick = [event.offsetX, event.offsetY];
-          internal.initialHits = hits.map(hit => hit.eventObject);
         }
@@ -414,0 +415,0 @@ });

dist/react-three-fiber.esm.js

@@ -159,3 +159,3 @@ import * as THREE from 'three';
 
-  function handleIntersects(intersections, event, callback) {
+  function handleIntersects(intersections, event, delta, callback) {
     const {
@@ -170,3 +170,2 @@ raycaster,
       const unprojectedPoint = temp.set(mouse.x, mouse.y, 0).unproject(camera);
-      const delta = event.type === 'click' ? calculateDistance(event) : 0;
 
@@ -317,16 +316,24 @@ const releasePointerCapture = id => event.target.releasePointerCapture(id);
       const isPointerMove = name === 'onPointerMove';
+      const isClickEvent = name === 'onClick' || name === 'onContextMenu' || name === 'onDoubleClick';
       const filter = isPointerMove ? filterPointerEvents : undefined;
-      const hits = patchIntersects(intersect(filter), event); // Take care of unhover
+      const hits = patchIntersects(intersect(filter), event);
+      const delta = isClickEvent ? calculateDistance(event) : 0; // Save initial coordinates on pointer-down
 
-      if (isPointerMove) cancelPointer(hits); // If a click yields no results, pass it back to the user as a miss
-      // This has to come first because event order affects side-effect cleanup
+      if (name === 'onPointerDown') {
+        internal.initialClick = [event.offsetX, event.offsetY];
+        internal.initialHits = hits.map(hit => hit.eventObject);
+      } // If a click yields no results, pass it back to the user as a miss
+      // Missed events have to come first in order to establish user-land side-effect clean up
 
-      if ((name === 'onClick' || name === 'onContextMenu' || name === 'onDoubleClick') && !hits.length) {
-        if (calculateDistance(event) <= 2) {
+
+      if (isClickEvent && !hits.length) {
+        if (delta <= 2) {
           pointerMissed(event, internal.interaction);
           if (onPointerMissed) onPointerMissed(event);
         }
-      }
+      } // Take care of unhover
 
-      handleIntersects(hits, event, data => {
+
+      if (isPointerMove) cancelPointer(hits);
+      handleIntersects(hits, event, delta, data => {
         const eventObject = data.eventObject;
@@ -365,4 +372,4 @@ const handlers = eventObject.__r3f.handlers; // Check presence of handlers
             if (name !== 'onClick' && name !== 'onContextMenu' && name !== 'onDoubleClick' || internal.initialHits.includes(eventObject)) {
-              // Missed pointers have to come first ...
-              pointerMissed(event, internal.interaction.filter(object => !internal.initialHits.includes(object))); // ... and then the hit object
+              // Missed events have to come first
+              pointerMissed(event, internal.interaction.filter(object => !internal.initialHits.includes(object))); // Now call the handler
 
@@ -372,8 +379,2 @@ handler(data);
           }
-        } // Save initial coordinates on pointer-down
-
-
-        if (name === 'onPointerDown') {
-          internal.initialClick = [event.offsetX, event.offsetY];
-          internal.initialHits = hits.map(hit => hit.eventObject);
         }
@@ -380,0 +381,0 @@ });

package.json

 {
   "name": "@react-three/fiber",
-  "version": "7.0.11",
+  "version": "7.0.12",
   "description": "A React renderer for Threejs",
@@ -5,0 +5,0 @@ "keywords": [

No alert changes

Improved metrics

Total package byte prevSize

234601

increased by0.05%

Lines of code

5172

increased by0.06%

No dependency changes