@react-three/drei 7.22.5 → 7.22.6

package/core/GizmoViewcube.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("./GizmoHelper.cjs.js"),o=require("three");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function n(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,o.get?o:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}require("@react-three/fiber"),require("./OrthographicCamera.cjs.js"),require("react-merge-refs"),require("./useCamera.cjs.js");var i=a(e),c=n(t);const l="#f0f0f0",s="#999",m="black",u="black",p=["Right","Left","Top","Bottom","Front","Back"],f=e=>new o.Vector3(...e).multiplyScalar(.38),h=[[1,1,1],[1,1,-1],[1,-1,1],[1,-1,-1],[-1,1,1],[-1,1,-1],[-1,-1,1],[-1,-1,-1]].map(f),y=[.25,.25,.25],d=[[1,1,0],[1,0,1],[1,0,-1],[1,-1,0],[0,1,1],[0,1,-1],[0,-1,1],[0,-1,-1],[-1,1,0],[-1,0,1],[-1,0,-1],[-1,-1,0]].map(f),g=d.map((e=>e.toArray().map((e=>0==e?.5:.25)))),b=({hover:e,index:t,font:r="20px Inter var, Arial, sans-serif",faces:a=p,color:n=l,hoverColor:i=s,textColor:f=m,strokeColor:h=u,opacity:y=1})=>{const d=c.useMemo((()=>{const e=document.createElement("canvas");e.width=128,e.height=128;const i=e.getContext("2d");return i.fillStyle=n,i.fillRect(0,0,e.width,e.height),i.strokeStyle=h,i.strokeRect(0,0,e.width,e.height),i.font=r,i.textAlign="center",i.fillStyle=f,i.fillText(a[t].toUpperCase(),64,76),new o.CanvasTexture(e)}),[t,r,n,f,h]);return c.createElement("meshLambertMaterial",{map:d,attachArray:"material",color:e?i:"white",transparent:!0,opacity:y})},C=e=>{const{tweenCamera:t,raycast:o}=r.useGizmoContext(),[a,n]=c.useState(null);return c.createElement("mesh",{raycast:o,onPointerOut:e=>{e.stopPropagation(),n(null)},onPointerMove:e=>{e.stopPropagation(),n(Math.floor(e.faceIndex/2))},onClick:e.onClick||(e=>{e.stopPropagation(),t(e.face.normal)})},[...Array(6)].map(((t,r)=>c.createElement(b,i.default({key:r,index:r,hover:a===r},e)))),c.createElement("boxGeometry",null))},x=({onClick:e,dimensions:t,position:o,hoverColor:a=s})=>{const{tweenCamera:n,raycast:i}=r.useGizmoContext(),[l,m]=c.useState(!1);return c.createElement("mesh",{scale:1.01,position:o,raycast:i,onPointerOver:e=>{e.stopPropagation(),m(!0)},onPointerOut:e=>{e.stopPropagation(),m(!1)},onClick:e||(e=>{e.stopPropagation(),n(o)})},c.createElement("meshBasicMaterial",{color:l?a:"white",transparent:!0,opacity:.6,visible:l}),c.createElement("boxGeometry",{args:t}))};exports.GizmoViewcube=e=>c.createElement("group",{scale:[60,60,60]},c.createElement(C,e),d.map(((t,r)=>c.createElement(x,i.default({key:r,position:t,dimensions:g[r]},e)))),h.map(((t,r)=>c.createElement(x,i.default({key:r,position:t,dimensions:y},e)))),c.createElement("ambientLight",{intensity:.5}),c.createElement("pointLight",{position:[10,10,10],intensity:.5}));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("@react-three/fiber"),o=require("./GizmoHelper.cjs.js"),a=require("three");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function i(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var o=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,o.get?o:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}require("./OrthographicCamera.cjs.js"),require("react-merge-refs"),require("./useCamera.cjs.js");var s=n(e),c=i(t);const l="#f0f0f0",m="#999",p="black",u="black",f=["Right","Left","Top","Bottom","Front","Back"],h=e=>new a.Vector3(...e).multiplyScalar(.38),y=[[1,1,1],[1,1,-1],[1,-1,1],[1,-1,-1],[-1,1,1],[-1,1,-1],[-1,-1,1],[-1,-1,-1]].map(h),d=[.25,.25,.25],g=[[1,1,0],[1,0,1],[1,0,-1],[1,-1,0],[0,1,1],[0,1,-1],[0,-1,1],[0,-1,-1],[-1,1,0],[-1,0,1],[-1,0,-1],[-1,-1,0]].map(h),b=g.map((e=>e.toArray().map((e=>0==e?.5:.25)))),x=({hover:e,index:t,font:o="20px Inter var, Arial, sans-serif",faces:n=f,color:i=l,hoverColor:s=m,textColor:h=p,strokeColor:y=u,opacity:d=1})=>{const g=r.useThree((e=>e.gl)),b=c.useMemo((()=>{const e=document.createElement("canvas");e.width=128,e.height=128;const r=e.getContext("2d");return r.fillStyle=i,r.fillRect(0,0,e.width,e.height),r.strokeStyle=y,r.strokeRect(0,0,e.width,e.height),r.font=o,r.textAlign="center",r.fillStyle=h,r.fillText(n[t].toUpperCase(),64,76),new a.CanvasTexture(e)}),[t,o,i,h,y]);return c.createElement("meshLambertMaterial",{map:b,"map-anisotropy":g.capabilities.getMaxAnisotropy()||1,attachArray:"material",color:e?s:"white",transparent:!0,opacity:d})},C=e=>{const{tweenCamera:t,raycast:r}=o.useGizmoContext(),[a,n]=c.useState(null);return c.createElement("mesh",{raycast:r,onPointerOut:e=>{e.stopPropagation(),n(null)},onPointerMove:e=>{e.stopPropagation(),n(Math.floor(e.faceIndex/2))},onClick:e.onClick||(e=>{e.stopPropagation(),t(e.face.normal)})},[...Array(6)].map(((t,r)=>c.createElement(x,s.default({key:r,index:r,hover:a===r},e)))),c.createElement("boxGeometry",null))},v=({onClick:e,dimensions:t,position:r,hoverColor:a=m})=>{const{tweenCamera:n,raycast:i}=o.useGizmoContext(),[s,l]=c.useState(!1);return c.createElement("mesh",{scale:1.01,position:r,raycast:i,onPointerOver:e=>{e.stopPropagation(),l(!0)},onPointerOut:e=>{e.stopPropagation(),l(!1)},onClick:e||(e=>{e.stopPropagation(),n(r)})},c.createElement("meshBasicMaterial",{color:s?a:"white",transparent:!0,opacity:.6,visible:s}),c.createElement("boxGeometry",{args:t}))};exports.GizmoViewcube=e=>c.createElement("group",{scale:[60,60,60]},c.createElement(C,e),g.map(((t,r)=>c.createElement(v,s.default({key:r,position:t,dimensions:b[r]},e)))),y.map(((t,r)=>c.createElement(v,s.default({key:r,position:t,dimensions:d},e)))),c.createElement("ambientLight",{intensity:.5}),c.createElement("pointLight",{position:[10,10,10],intensity:.5}));

package/core/GizmoViewcube.js

@@ -1,5 +1,6 @@
 import _extends from '@babel/runtime/helpers/esm/extends';
 import * as React from 'react';
+import { useThree } from '@react-three/fiber';
 import { useGizmoContext } from './GizmoHelper.js';
 import { Vector3, CanvasTexture } from 'three';
 
@@ -29,6 +30,7 @@ const FaceMaterial = ({
   strokeColor = colors.stroke,
   opacity = 1
 }) => {
+  const gl = useThree(state => state.gl);
   const texture = React.useMemo(() => {
     const canvas = document.createElement('canvas');
     canvas.width = 128;
@@ -46,6 +48,7 @@ const FaceMaterial = ({
   }, [index, font, color, textColor, strokeColor]);
   return /*#__PURE__*/React.createElement("meshLambertMaterial", {
     map: texture,
+    "map-anisotropy": gl.capabilities.getMaxAnisotropy() || 1,
     attachArray: "material",
     color: hover ? hoverColor : 'white',
     transparent: true,

package/core/GizmoViewport.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),a=require("three"),r=require("./GizmoHelper.cjs.js");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function l(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(a){if("default"!==a){var r=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,r.get?r:{enumerable:!0,get:function(){return e[a]}})}})),t.default=e,Object.freeze(t)}require("@react-three/fiber"),require("./OrthographicCamera.cjs.js"),require("react-merge-refs"),require("./useCamera.cjs.js");var n=o(e),i=l(t);function c({scale:e=[.8,.05,.05],color:t,rotation:a}){return i.createElement("group",{rotation:a},i.createElement("mesh",{position:[.4,0,0]},i.createElement("boxGeometry",{args:e}),i.createElement("meshBasicMaterial",{color:t,toneMapped:!1})))}function s({onClick:e,font:t,disabled:r,arcStyle:o,label:l,labelColor:c,axisHeadScale:s=1,...u}){const p=i.useMemo((()=>{const e=document.createElement("canvas");e.width=64,e.height=64;const r=e.getContext("2d");return r.beginPath(),r.arc(32,32,16,0,2*Math.PI),r.closePath(),r.fillStyle=o,r.fill(),l&&(r.font=t,r.textAlign="center",r.fillStyle=c,r.fillText(l,32,41)),new a.CanvasTexture(e)}),[o,l,c,t]),[f,m]=i.useState(!1),d=(l?1:.75)*(f?1.2:1)*s;return i.createElement("sprite",n.default({scale:d,onPointerOver:r?void 0:e=>{e.stopPropagation(),m(!0)},onPointerOut:r?void 0:e||(e=>{e.stopPropagation(),m(!1)})},u),i.createElement("spriteMaterial",{map:p,"map-anisotropy":16,alphaTest:.3,opacity:l?1:.75,toneMapped:!1}))}exports.GizmoViewport=({hideNegativeAxes:e,hideAxisHeads:t,disabled:a,font:o="18px Inter var, Arial, sans-serif",axisColors:l=["#ff3653","#0adb50","#2c8fdf"],axisHeadScale:u=1,axisScale:p,labels:f=["X","Y","Z"],labelColor:m="#000",onClick:d,...b})=>{const[E,h,y]=l,{tweenCamera:g,raycast:x}=r.useGizmoContext(),j={font:o,disabled:a,labelColor:m,raycast:x,onClick:d,axisHeadScale:u,onPointerDown:a?void 0:e=>{g(e.object.position),e.stopPropagation()}};return i.createElement("group",n.default({scale:40},b),i.createElement(c,{color:E,rotation:[0,0,0],scale:p}),i.createElement(c,{color:h,rotation:[0,0,Math.PI/2],scale:p}),i.createElement(c,{color:y,rotation:[0,-Math.PI/2,0],scale:p}),!t&&i.createElement(i.Fragment,null,i.createElement(s,n.default({arcStyle:E,position:[1,0,0],label:f[0]},j)),i.createElement(s,n.default({arcStyle:h,position:[0,1,0],label:f[1]},j)),i.createElement(s,n.default({arcStyle:y,position:[0,0,1],label:f[2]},j)),!e&&i.createElement(i.Fragment,null,i.createElement(s,n.default({arcStyle:E,position:[-1,0,0]},j)),i.createElement(s,n.default({arcStyle:h,position:[0,-1,0]},j)),i.createElement(s,n.default({arcStyle:y,position:[0,0,-1]},j)))),i.createElement("ambientLight",{intensity:.5}),i.createElement("pointLight",{position:[10,10,10],intensity:.5}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),a=require("@react-three/fiber"),r=require("three"),o=require("./GizmoHelper.cjs.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function n(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(a){if("default"!==a){var r=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,r.get?r:{enumerable:!0,get:function(){return e[a]}})}})),t.default=e,Object.freeze(t)}require("./OrthographicCamera.cjs.js"),require("react-merge-refs"),require("./useCamera.cjs.js");var i=l(e),c=n(t);function s({scale:e=[.8,.05,.05],color:t,rotation:a}){return c.createElement("group",{rotation:a},c.createElement("mesh",{position:[.4,0,0]},c.createElement("boxGeometry",{args:e}),c.createElement("meshBasicMaterial",{color:t,toneMapped:!1})))}function u({onClick:e,font:t,disabled:o,arcStyle:l,label:n,labelColor:s,axisHeadScale:u=1,...p}){const f=a.useThree((e=>e.gl)),m=c.useMemo((()=>{const e=document.createElement("canvas");e.width=64,e.height=64;const a=e.getContext("2d");return a.beginPath(),a.arc(32,32,16,0,2*Math.PI),a.closePath(),a.fillStyle=l,a.fill(),n&&(a.font=t,a.textAlign="center",a.fillStyle=s,a.fillText(n,32,41)),new r.CanvasTexture(e)}),[l,n,s,t]),[d,b]=c.useState(!1),g=(n?1:.75)*(d?1.2:1)*u;return c.createElement("sprite",i.default({scale:g,onPointerOver:o?void 0:e=>{e.stopPropagation(),b(!0)},onPointerOut:o?void 0:e||(e=>{e.stopPropagation(),b(!1)})},p),c.createElement("spriteMaterial",{map:m,"map-anisotropy":f.capabilities.getMaxAnisotropy()||1,alphaTest:.3,opacity:n?1:.75,toneMapped:!1}))}exports.GizmoViewport=({hideNegativeAxes:e,hideAxisHeads:t,disabled:a,font:r="18px Inter var, Arial, sans-serif",axisColors:l=["#ff3653","#0adb50","#2c8fdf"],axisHeadScale:n=1,axisScale:p,labels:f=["X","Y","Z"],labelColor:m="#000",onClick:d,...b})=>{const[g,h,y]=l,{tweenCamera:E,raycast:x}=o.useGizmoContext(),j={font:r,disabled:a,labelColor:m,raycast:x,onClick:d,axisHeadScale:n,onPointerDown:a?void 0:e=>{E(e.object.position),e.stopPropagation()}};return c.createElement("group",i.default({scale:40},b),c.createElement(s,{color:g,rotation:[0,0,0],scale:p}),c.createElement(s,{color:h,rotation:[0,0,Math.PI/2],scale:p}),c.createElement(s,{color:y,rotation:[0,-Math.PI/2,0],scale:p}),!t&&c.createElement(c.Fragment,null,c.createElement(u,i.default({arcStyle:g,position:[1,0,0],label:f[0]},j)),c.createElement(u,i.default({arcStyle:h,position:[0,1,0],label:f[1]},j)),c.createElement(u,i.default({arcStyle:y,position:[0,0,1],label:f[2]},j)),!e&&c.createElement(c.Fragment,null,c.createElement(u,i.default({arcStyle:g,position:[-1,0,0]},j)),c.createElement(u,i.default({arcStyle:h,position:[0,-1,0]},j)),c.createElement(u,i.default({arcStyle:y,position:[0,0,-1]},j)))),c.createElement("ambientLight",{intensity:.5}),c.createElement("pointLight",{position:[10,10,10],intensity:.5}))};

package/core/GizmoViewport.js

@@ -1,5 +1,6 @@
 import _extends from '@babel/runtime/helpers/esm/extends';
 import * as React from 'react';
+import { useThree } from '@react-three/fiber';
 import { CanvasTexture } from 'three';
 import { useGizmoContext } from './GizmoHelper.js';
 
@@ -30,6 +31,7 @@ function AxisHead({
   axisHeadScale = 1,
   ...props
 }) {
+  const gl = useThree(state => state.gl);
   const texture = React.useMemo(() => {
     const canvas = document.createElement('canvas');
     canvas.width = 64;
@@ -69,7 +71,7 @@ function AxisHead({
     onPointerOut: !disabled ? onClick || handlePointerOut : undefined
   }, props), /*#__PURE__*/React.createElement("spriteMaterial", {
     map: texture,
-    "map-anisotropy": 16,
+    "map-anisotropy": gl.capabilities.getMaxAnisotropy() || 1,
     alphaTest: 0.3,
     opacity: label ? 1 : 0.75,
     toneMapped: false