drei - npm Package Compare versions

Comparing version 0.0.22 to 0.0.23

dist/HTML.d.ts

@@ -5,3 +5,3 @@ import { Group } from 'three';
 import { ReactThreeFiber } from 'react-three-fiber';
-export interface DomProps extends Omit<Assign<React.HTMLAttributes<HTMLDivElement>, ReactThreeFiber.Object3DNode<Group, typeof Group>>, 'ref'> {
+export interface HTMLProps extends Omit<Assign<React.HTMLAttributes<HTMLDivElement>, ReactThreeFiber.Object3DNode<Group, typeof Group>>, 'ref'> {
     children: React.ReactElement;
@@ -15,2 +15,2 @@ prepend?: boolean;
 }
-export declare const HTML: React.ForwardRefExoticComponent<DomProps & React.RefAttributes<HTMLDivElement>>;
+export declare const HTML: React.ForwardRefExoticComponent<HTMLProps & React.RefAttributes<HTMLDivElement>>;

dist/index.cjs.js

@@ -330,18 +330,19 @@ 'use strict';
 
-var vector = new three.Vector3();
+var v1 = new three.Vector3();
+var v2 = new three.Vector3();
+var v3 = new three.Vector3();
 
 function calculatePosition(el, camera, size) {
-  vector.setFromMatrixPosition(el.matrixWorld);
-  vector.project(camera);
+  var objectPos = v1.setFromMatrixPosition(el.matrixWorld);
+  objectPos.project(camera);
   var widthHalf = size.width / 2;
   var heightHalf = size.height / 2;
-  return [vector.x * widthHalf + widthHalf, -(vector.y * heightHalf) + heightHalf];
+  return [objectPos.x * widthHalf + widthHalf, -(objectPos.y * heightHalf) + heightHalf];
 }
 
 function isObjectBehindCamera(el, camera) {
-  var objectPos = new three.Vector3().setFromMatrixPosition(el.matrixWorld);
-  var cameraPos = new three.Vector3().setFromMatrixPosition(camera.matrixWorld);
+  var objectPos = v1.setFromMatrixPosition(el.matrixWorld);
+  var cameraPos = v2.setFromMatrixPosition(camera.matrixWorld);
   var deltaCamObj = objectPos.sub(cameraPos);
-  var camDir = new three.Vector3();
-  camera.getWorldDirection(camDir);
+  var camDir = camera.getWorldDirection(v3);
   return deltaCamObj.angleTo(camDir) > Math.PI / 2;
@@ -352,11 +353,10 @@ }
   if (camera instanceof three.PerspectiveCamera) {
+    var objectPos = v1.setFromMatrixPosition(el.matrixWorld);
+    var cameraPos = v2.setFromMatrixPosition(camera.matrixWorld);
     var vFOV = camera.fov * Math.PI / 180;
-    var dist = el.position.distanceTo(camera.position);
+    var dist = objectPos.distanceTo(cameraPos);
     return 1 / (2 * Math.tan(vFOV / 2) * dist);
   }
 
-  if (camera instanceof three.OrthographicCamera) {
-    return camera.zoom;
-  }
-
+  if (camera instanceof three.OrthographicCamera) return camera.zoom;
   return 1;
@@ -367,3 +367,5 @@ }
   if (camera instanceof three.PerspectiveCamera || camera instanceof three.OrthographicCamera) {
-    var dist = el.position.distanceTo(camera.position);
+    var objectPos = v1.setFromMatrixPosition(el.matrixWorld);
+    var cameraPos = v2.setFromMatrixPosition(camera.matrixWorld);
+    var dist = objectPos.distanceTo(cameraPos);
     var A = (zIndexRange[1] - zIndexRange[0]) / (camera.far - camera.near);
@@ -370,0 +372,0 @@ var B = zIndexRange[1] - A * camera.far;

dist/index.js

@@ -292,18 +292,19 @@ import _extends from '@babel/runtime/helpers/esm/extends';
 
-const vector = new Vector3();
+const v1 = new Vector3();
+const v2 = new Vector3();
+const v3 = new Vector3();
 
 function calculatePosition(el, camera, size) {
-  vector.setFromMatrixPosition(el.matrixWorld);
-  vector.project(camera);
+  const objectPos = v1.setFromMatrixPosition(el.matrixWorld);
+  objectPos.project(camera);
   const widthHalf = size.width / 2;
   const heightHalf = size.height / 2;
-  return [vector.x * widthHalf + widthHalf, -(vector.y * heightHalf) + heightHalf];
+  return [objectPos.x * widthHalf + widthHalf, -(objectPos.y * heightHalf) + heightHalf];
 }
 
 function isObjectBehindCamera(el, camera) {
-  const objectPos = new Vector3().setFromMatrixPosition(el.matrixWorld);
-  const cameraPos = new Vector3().setFromMatrixPosition(camera.matrixWorld);
+  const objectPos = v1.setFromMatrixPosition(el.matrixWorld);
+  const cameraPos = v2.setFromMatrixPosition(camera.matrixWorld);
   const deltaCamObj = objectPos.sub(cameraPos);
-  const camDir = new Vector3();
-  camera.getWorldDirection(camDir);
+  const camDir = camera.getWorldDirection(v3);
   return deltaCamObj.angleTo(camDir) > Math.PI / 2;
@@ -314,11 +315,10 @@ }
   if (camera instanceof PerspectiveCamera$1) {
+    const objectPos = v1.setFromMatrixPosition(el.matrixWorld);
+    const cameraPos = v2.setFromMatrixPosition(camera.matrixWorld);
     const vFOV = camera.fov * Math.PI / 180;
-    const dist = el.position.distanceTo(camera.position);
+    const dist = objectPos.distanceTo(cameraPos);
     return 1 / (2 * Math.tan(vFOV / 2) * dist);
   }
 
-  if (camera instanceof OrthographicCamera) {
-    return camera.zoom;
-  }
-
+  if (camera instanceof OrthographicCamera) return camera.zoom;
   return 1;
@@ -329,3 +329,5 @@ }
   if (camera instanceof PerspectiveCamera$1 || camera instanceof OrthographicCamera) {
-    const dist = el.position.distanceTo(camera.position);
+    const objectPos = v1.setFromMatrixPosition(el.matrixWorld);
+    const cameraPos = v2.setFromMatrixPosition(camera.matrixWorld);
+    const dist = objectPos.distanceTo(cameraPos);
     const A = (zIndexRange[1] - zIndexRange[0]) / (camera.far - camera.near);
@@ -332,0 +334,0 @@ const B = zIndexRange[1] - A * camera.far;

package.json

 {
   "name": "drei",
-  "version": "0.0.22",
+  "version": "0.0.23",
   "description": "useful add-ons for react-three-fiber",
@@ -20,3 +20,3 @@ "main": "dist/index.cjs.js",
     "hooks": {
-      "pre-commit": "pretty-quick --staged"
+      "pre-commit": "pretty-quick --staged --pattern '**/*.*(js|jsx|ts|tsx)'"
     }
@@ -23,0 +23,0 @@ },

README.md

@@ -51,4 +51,4 @@ [![Build Status](https://travis-ci.org/react-spring/drei.svg?branch=master)](https://travis-ci.org/react-spring/drei) [![npm version](https://badge.fury.io/js/drei.svg)](https://badge.fury.io/js/drei) ![npm](https://img.shields.io/npm/dt/drei.svg)
 <PerspectiveCamera
-  makeDefault // Registers it as the default camera system-wide (default=true)
-  {...props} // All THREE.PerspectiveCamera props are valid
+  makeDefault               // Registers it as the default camera system-wide (default=true)
+  {...props}                // All THREE.PerspectiveCamera props are valid
 >
@@ -79,4 +79,4 @@ <mesh />
 <Detailed
-  distances={[0, 10, 20]} // Camera distances, correspends to the # of the children
-  {...props} // All THREE.LOD props are valid
+  distances={[0, 10, 20]}   // Camera distances, correspends to the # of the children
+  {...props}                // All THREE.LOD props are valid
 >
@@ -96,6 +96,6 @@ <mesh geometry={highDetail} />
   <PositionalAudio
-    url="/sound.mp3" // Url of the sound file
-    distance={1} // Camera distance (default=1)
-    loop // Repat play (default=true)
-    {...props} // All THREE.PositionalAudio props are valid
+    url="/sound.mp3"        // Url of the sound file
+    distance={1}            // Camera distance (default=1)
+    loop                    // Repat play (default=true)
+    {...props}              // All THREE.PositionalAudio props are valid
   />
@@ -126,5 +126,5 @@ </mesh>
 <Sky
-  distance={450000} // Camera distance (default=450000)
-  sunPosition={[0, 1, 0]} // Sun position normal (default=[0, 1, 0])
-  {...props} // All three/examples/jsm/objects/Sky props are valid
+  distance={450000}         // Camera distance (default=450000)
+  sunPosition={[0, 1, 0]}   // Sun position normal (default=[0, 1, 0])
+  {...props}                // All three/examples/jsm/objects/Sky props are valid
 />
@@ -160,4 +160,4 @@ ```
 <Stats
-  showPanel={0} // Start-up panel (default=0)
-  {...props} // All stats.js props are valid
+  showPanel={0}             // Start-up panel (default=0)
+  {...props}                // All stats.js props are valid
 />
@@ -174,4 +174,4 @@ ```
   url,
-  draco(binUrl) // default='/draco-gtltf/'
+  draco(binUrl)             // default='/draco-gtltf/'
 )
 ```

No alert changes

Improved metrics

Total package byte prevSize

82043

increased by1.19%

Lines of code

1633

increased by0.55%

No dependency changes