@react-three/drei 10.7.7 → 11.0.0-alpha.1

package/core/MotionPathControls.cjs.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("three"),r=require("react"),n=require("@react-three/fiber"),o=require("maath");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function u(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var s=c(e),a=u(t),i=u(r);const f=i.createContext(null);function l(){const e=i.useContext(f);if(!e)throw new Error("useMotion hook must be used in a MotionPathControls component.");return e}function m({points:e=50,color:t="black"}){const{path:r}=l(),[n,o]=i.useState([]),c=i.useMemo((()=>new a.MeshBasicMaterial({color:t})),[t]),u=i.useMemo((()=>new a.SphereGeometry(.025,16,16)),[]),s=i.useRef([]);return i.useEffect((()=>{r.curves!==s.current&&(o(r.getPoints(e)),s.current=r.curves)})),n.map(((e,t)=>i.createElement("mesh",{key:t,material:c,geometry:u,position:[e.x,e.y,e.z]})))}const p=i.forwardRef((({children:e,curves:t=[],debug:r=!1,debugColor:c="black",object:u,focus:l,loop:p=!0,offset:d,smooth:g=!1,eps:b=1e-5,damping:h=.1,focusDamping:v=.1,maxSpeed:j=1/0,...y},M)=>{const{camera:w}=n.useThree(),P=i.useRef(null),O=i.useRef(null!=d?d:0),x=i.useMemo((()=>new a.CurvePath),[]),C=i.useMemo((()=>({focus:l,object:(null==u?void 0:u.current)instanceof a.Object3D?u:{current:w},path:x,current:O.current,offset:O.current,point:new a.Vector3,tangent:new a.Vector3,next:new a.Vector3})),[l,u]),E=n.useInstanceHandle(P);i.useLayoutEffect((()=>{const e=E.current;x.curves=[];const r=t.length>0?t:e.children.map((e=>e.object));for(let e=0;e<r.length;e++)x.add(r[e]);if(g){const e=x.getPoints("number"==typeof g?g:1),t=new a.CatmullRomCurve3(e);x.curves=[t]}x.updateArcLengths()})),i.useImperativeHandle(M,(()=>Object.assign(P.current,{motion:C})),[C]),i.useLayoutEffect((()=>{O.current=o.misc.repeat(O.current,1)}),[d]);const k=i.useMemo((()=>new a.Vector3),[]);return n.useFrame(((e,t)=>{const r=C.offset;if(o.easing.damp(O,"current",void 0!==d?d:C.current,h,t,j,void 0,b),C.offset=p?o.misc.repeat(O.current,1):o.misc.clamp(O.current,0,1),x.getCurveLengths().length>0){x.getPointAt(C.offset,C.point),x.getTangentAt(C.offset,C.tangent).normalize(),x.getPointAt(o.misc.repeat(O.current-(r-C.offset),1),C.next);const e=(null==u?void 0:u.current)instanceof a.Object3D?u.current:w;e.position.copy(C.point),l&&o.easing.dampLookAt(e,(e=>(null==e?void 0:e.current)instanceof a.Object3D)(l)?l.current.getWorldPosition(k):l,v,t,j,void 0,b)}})),i.createElement("group",s.default({ref:P},y),i.createElement(f.Provider,{value:C},e,r&&i.createElement(m,{color:c})))}));exports.MotionPathControls=p,exports.useMotion=l;

package/core/MotionPathControls.d.ts

@@ -1,33 +0,0 @@
-import * as THREE from 'three';
-import * as React from 'react';
-import { ThreeElements } from '@react-three/fiber';
-export type MotionPathProps = ThreeElements['group'] & {
-    curves?: THREE.Curve<THREE.Vector3>[];
-    debug?: boolean;
-    debugColor?: THREE.ColorRepresentation;
-    object?: React.RefObject<THREE.Object3D>;
-    focus?: [x: number, y: number, z: number] | React.RefObject<THREE.Object3D>;
-    loop?: boolean;
-    offset?: number;
-    smooth?: boolean | number;
-    eps?: number;
-    damping?: number;
-    focusDamping?: number;
-    maxSpeed?: number;
-};
-type MotionState = {
-    current: number;
-    path: THREE.CurvePath<THREE.Vector3>;
-    focus: React.RefObject<THREE.Object3D> | [x: number, y: number, z: number] | undefined;
-    object: React.RefObject<THREE.Object3D>;
-    offset: number;
-    point: THREE.Vector3;
-    tangent: THREE.Vector3;
-    next: THREE.Vector3;
-};
-export type MotionPathRef = THREE.Group & {
-    motion: MotionState;
-};
-export declare function useMotion(): MotionState;
-export declare const MotionPathControls: React.ForwardRefExoticComponent<Omit<MotionPathProps, "ref"> & React.RefAttributes<MotionPathRef>>;
-export {};

package/core/MotionPathControls.js

@@ -1,121 +0,0 @@
-import _extends from '@babel/runtime/helpers/esm/extends';
-import * as THREE from 'three';
-import * as React from 'react';
-import { useThree, useInstanceHandle, useFrame } from '@react-three/fiber';
-import { misc, easing } from 'maath';
-
-const isObject3DRef = ref => (ref == null ? void 0 : ref.current) instanceof THREE.Object3D;
-const MotionContext = /* @__PURE__ */React.createContext(null);
-function useMotion() {
-  const context = React.useContext(MotionContext);
-  if (!context) throw new Error('useMotion hook must be used in a MotionPathControls component.');
-  return context;
-}
-function Debug({
-  points = 50,
-  color = 'black'
-}) {
-  const {
-    path
-  } = useMotion();
-  const [dots, setDots] = React.useState([]);
-  const material = React.useMemo(() => new THREE.MeshBasicMaterial({
-    color: color
-  }), [color]);
-  const geometry = React.useMemo(() => new THREE.SphereGeometry(0.025, 16, 16), []);
-  const last = React.useRef([]);
-  React.useEffect(() => {
-    if (path.curves !== last.current) {
-      setDots(path.getPoints(points));
-      last.current = path.curves;
-    }
-  });
-  return dots.map((item, index) => /*#__PURE__*/React.createElement("mesh", {
-    key: index,
-    material: material,
-    geometry: geometry,
-    position: [item.x, item.y, item.z]
-  }));
-}
-const MotionPathControls = /* @__PURE__ */React.forwardRef(({
-  children,
-  curves = [],
-  debug = false,
-  debugColor = 'black',
-  object,
-  focus,
-  loop = true,
-  offset = undefined,
-  smooth = false,
-  eps = 0.00001,
-  damping = 0.1,
-  focusDamping = 0.1,
-  maxSpeed = Infinity,
-  ...props
-}, fref) => {
-  const {
-    camera
-  } = useThree();
-  const ref = React.useRef(null);
-  const pos = React.useRef(offset !== null && offset !== void 0 ? offset : 0);
-  const path = React.useMemo(() => new THREE.CurvePath(), []);
-  const state = React.useMemo(() => ({
-    focus,
-    object: (object == null ? void 0 : object.current) instanceof THREE.Object3D ? object : {
-      current: camera
-    },
-    path,
-    current: pos.current,
-    offset: pos.current,
-    point: new THREE.Vector3(),
-    tangent: new THREE.Vector3(),
-    next: new THREE.Vector3()
-  }), [focus, object]);
-  const instanceRef = useInstanceHandle(ref);
-  React.useLayoutEffect(() => {
-    const instance = instanceRef.current;
-    path.curves = [];
-    const _curves = curves.length > 0 ? curves : instance.children.map(instance => instance.object);
-    for (let i = 0; i < _curves.length; i++) path.add(_curves[i]);
-
-    // Smoothen curve
-    if (smooth) {
-      const points = path.getPoints(typeof smooth === 'number' ? smooth : 1);
-      const catmull = new THREE.CatmullRomCurve3(points);
-      path.curves = [catmull];
-    }
-    path.updateArcLengths();
-  });
-  React.useImperativeHandle(fref, () => Object.assign(ref.current, {
-    motion: state
-  }), [state]);
-  React.useLayoutEffect(() => {
-    // When offset changes, normalise pos to avoid overshoot spinning
-    pos.current = misc.repeat(pos.current, 1);
-  }, [offset]);
-  const vec = React.useMemo(() => new THREE.Vector3(), []);
-  useFrame((_state, delta) => {
-    const lastOffset = state.offset;
-    easing.damp(pos, 'current', offset !== undefined ? offset : state.current, damping, delta, maxSpeed, undefined, eps);
-    state.offset = loop ? misc.repeat(pos.current, 1) : misc.clamp(pos.current, 0, 1);
-    if (path.getCurveLengths().length > 0) {
-      path.getPointAt(state.offset, state.point);
-      path.getTangentAt(state.offset, state.tangent).normalize();
-      path.getPointAt(misc.repeat(pos.current - (lastOffset - state.offset), 1), state.next);
-      const target = (object == null ? void 0 : object.current) instanceof THREE.Object3D ? object.current : camera;
-      target.position.copy(state.point);
-      if (focus) {
-        easing.dampLookAt(target, isObject3DRef(focus) ? focus.current.getWorldPosition(vec) : focus, focusDamping, delta, maxSpeed, undefined, eps);
-      }
-    }
-  });
-  return /*#__PURE__*/React.createElement("group", _extends({
-    ref: ref
-  }, props), /*#__PURE__*/React.createElement(MotionContext.Provider, {
-    value: state
-  }, children, debug && /*#__PURE__*/React.createElement(Debug, {
-    color: debugColor
-  })));
-});
-
-export { MotionPathControls, useMotion };

package/core/MultiMaterial.cjs.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("react");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function u(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var u=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,u.get?u:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var n=t(e),a=u(r);exports.MultiMaterial=function(e){const r=a.useRef(null);return a.useLayoutEffect((()=>{const e=r.current.parent,t=null==e?void 0:e.geometry;if(t){const u=e.material;e.material=r.current.__r3f.children.map((e=>e.object));const n=[...t.groups];return t.clearGroups(),e.material.forEach(((r,u)=>{u<e.material.length-1&&(r.depthWrite=!1),t.addGroup(0,1/0,u)})),()=>{e.material=u,t.groups=n}}})),a.createElement("group",n.default({ref:r},e))};

package/core/MultiMaterial.d.ts

@@ -1,4 +0,0 @@
-import { ThreeElements } from '@react-three/fiber';
-import * as React from 'react';
-export type MultiMaterialProps = Omit<ThreeElements['group'], 'ref'>;
-export declare function MultiMaterial(props: MultiMaterialProps): React.JSX.Element;

package/core/MultiMaterial.js

@@ -1,29 +0,0 @@
-import _extends from '@babel/runtime/helpers/esm/extends';
-import * as React from 'react';
-
-function MultiMaterial(props) {
-  const group = React.useRef(null);
-  React.useLayoutEffect(() => {
-    const parent = group.current.parent;
-    const geometry = parent == null ? void 0 : parent.geometry;
-    if (geometry) {
-      const oldMaterial = parent.material;
-      parent.material = group.current.__r3f.children.map(instance => instance.object);
-      const oldGroups = [...geometry.groups];
-      geometry.clearGroups();
-      parent.material.forEach((material, index) => {
-        if (index < parent.material.length - 1) material.depthWrite = false;
-        geometry.addGroup(0, Infinity, index);
-      });
-      return () => {
-        parent.material = oldMaterial;
-        geometry.groups = oldGroups;
-      };
-    }
-  });
-  return /*#__PURE__*/React.createElement("group", _extends({
-    ref: group
-  }, props));
-}
-
-export { MultiMaterial };

package/core/NormalTexture.cjs.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("./Texture.cjs.js"),t=require("three"),n=require("suspend-react");function s(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}require("@react-three/fiber");var o=s(e);function a(e=0,s={},a){const{repeat:u=[1,1],anisotropy:c=1,offset:i=[0,0]}=s,f=n.suspend((()=>fetch("https://cdn.jsdelivr.net/gh/pmndrs/drei-assets@master/normals/normals.json").then((e=>e.json()))),["normalsList"]),l=o.useMemo((()=>Object.keys(f).length),[]),p=f[0],d=`https://rawcdn.githack.com/pmndrs/drei-assets/7a3104997e1576f83472829815b00880d88b32fb/normals/${f[e]||p}`,m=r.useTexture(d,a);return o.useLayoutEffect((()=>{m&&(m.wrapS=m.wrapT=t.RepeatWrapping,m.repeat=new t.Vector2(u[0],u[1]),m.offset=new t.Vector2(i[0],i[1]),m.anisotropy=c)}),[m,c,u,i]),[m,d,l]}exports.NormalTexture=({children:e,id:r,onLoad:t,...n})=>{const s=a(r,n,t);return o.createElement(o.Fragment,null,null==e?void 0:e(s))},exports.useNormalTexture=a;

package/core/NormalTexture.d.ts

@@ -1,14 +0,0 @@
-import * as React from 'react';
-import { Texture } from 'three';
-type Settings = {
-    repeat?: number[];
-    anisotropy?: number;
-    offset?: number[];
-};
-export declare function useNormalTexture(id?: number, settings?: Settings, onLoad?: (texture: Texture | Texture[]) => void): [Texture, string, number];
-export declare const NormalTexture: ({ children, id, onLoad, ...settings }: {
-    children?: (texture: ReturnType<typeof useNormalTexture>) => React.ReactNode;
-    id?: Parameters<typeof useNormalTexture>[0];
-    onLoad?: Parameters<typeof useNormalTexture>[2];
-} & Settings) => React.JSX.Element;
-export {};

package/core/NormalTexture.js

@@ -1,42 +0,0 @@
-import * as React from 'react';
-import { useTexture } from './Texture.js';
-import { RepeatWrapping, Vector2 } from 'three';
-import { suspend } from 'suspend-react';
-
-const NORMAL_ROOT = 'https://rawcdn.githack.com/pmndrs/drei-assets/7a3104997e1576f83472829815b00880d88b32fb';
-const LIST_URL = 'https://cdn.jsdelivr.net/gh/pmndrs/drei-assets@master/normals/normals.json';
-function useNormalTexture(id = 0, settings = {}, onLoad) {
-  const {
-    repeat = [1, 1],
-    anisotropy = 1,
-    offset = [0, 0]
-  } = settings;
-  const normalsList = suspend(() => fetch(LIST_URL).then(res => res.json()), ['normalsList']);
-  const numTot = React.useMemo(() => Object.keys(normalsList).length, []);
-  const DEFAULT_NORMAL = normalsList[0];
-  const imageName = normalsList[id] || DEFAULT_NORMAL;
-  const url = `${NORMAL_ROOT}/normals/${imageName}`;
-  const normalTexture = useTexture(url, onLoad);
-  React.useLayoutEffect(() => {
-    if (!normalTexture) return;
-    normalTexture.wrapS = normalTexture.wrapT = RepeatWrapping;
-    normalTexture.repeat = new Vector2(repeat[0], repeat[1]);
-    normalTexture.offset = new Vector2(offset[0], offset[1]);
-    normalTexture.anisotropy = anisotropy;
-  }, [normalTexture, anisotropy, repeat, offset]);
-  return [normalTexture, url, numTot];
-}
-
-//
-
-const NormalTexture = ({
-  children,
-  id,
-  onLoad,
-  ...settings
-}) => {
-  const ret = useNormalTexture(id, settings, onLoad);
-  return /*#__PURE__*/React.createElement(React.Fragment, null, children == null ? void 0 : children(ret));
-};
-
-export { NormalTexture, useNormalTexture };

package/core/OrbitControls.cjs.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("@react-three/fiber"),r=require("react"),n=require("three-stdlib");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function o(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var a=s(e),u=o(r);const c=u.forwardRef((({makeDefault:e,camera:r,regress:s,domElement:o,enableDamping:c=!0,keyEvents:i=!1,onChange:f,onStart:d,onEnd:l,...m},v)=>{const b=t.useThree((e=>e.invalidate)),E=t.useThree((e=>e.camera)),h=t.useThree((e=>e.gl)),p=t.useThree((e=>e.events)),g=t.useThree((e=>e.setEvents)),O=t.useThree((e=>e.set)),j=t.useThree((e=>e.get)),T=t.useThree((e=>e.performance)),y=r||E,L=o||p.connected||h.domElement,q=u.useMemo((()=>new n.OrbitControls(y)),[y]);return t.useFrame((()=>{q.enabled&&q.update()}),-1),u.useEffect((()=>(i&&q.connect(!0===i?L:i),q.connect(L),()=>{q.dispose()})),[i,L,s,q,b]),u.useEffect((()=>{const e=e=>{b(),s&&T.regress(),f&&f(e)},t=e=>{d&&d(e)},r=e=>{l&&l(e)};return q.addEventListener("change",e),q.addEventListener("start",t),q.addEventListener("end",r),()=>{q.removeEventListener("start",t),q.removeEventListener("end",r),q.removeEventListener("change",e)}}),[f,d,l,q,b,g]),u.useEffect((()=>{if(e){const e=j().controls;return O({controls:q}),()=>O({controls:e})}}),[e,q]),u.createElement("primitive",a.default({ref:v,object:q,enableDamping:c},m))}));exports.OrbitControls=c;

package/core/OrbitControls.d.ts

@@ -1,22 +0,0 @@
-import { ReactThreeFiber, ThreeElement } from '@react-three/fiber';
-import { Camera, Event } from 'three';
-import { OrbitControls as OrbitControlsImpl } from 'three-stdlib';
-import { ForwardRefComponent, Overwrite } from '../helpers/ts-utils';
-type ExtractCallback<T, E extends string> = T extends {
-    addEventListener(event: E, callback: infer C): void;
-} ? C : never;
-export type OrbitControlsChangeEvent = Parameters<ExtractCallback<OrbitControlsImpl, 'change'>>[0];
-export type OrbitControlsProps = Omit<Overwrite<ThreeElement<typeof OrbitControlsImpl>, {
-    camera?: Camera;
-    domElement?: HTMLElement;
-    enableDamping?: boolean;
-    makeDefault?: boolean;
-    onChange?: (e?: OrbitControlsChangeEvent) => void;
-    onEnd?: (e?: Event) => void;
-    onStart?: (e?: Event) => void;
-    regress?: boolean;
-    target?: ReactThreeFiber.Vector3;
-    keyEvents?: boolean | HTMLElement;
-}>, 'ref' | 'args'>;
-export declare const OrbitControls: ForwardRefComponent<OrbitControlsProps, OrbitControlsImpl>;
-export {};

package/core/OrbitControls.js

@@ -1,79 +0,0 @@
-import _extends from '@babel/runtime/helpers/esm/extends';
-import { useThree, useFrame } from '@react-three/fiber';
-import * as React from 'react';
-import { OrbitControls as OrbitControls$1 } from 'three-stdlib';
-
-const OrbitControls = /* @__PURE__ */React.forwardRef(({
-  makeDefault,
-  camera,
-  regress,
-  domElement,
-  enableDamping = true,
-  keyEvents = false,
-  onChange,
-  onStart,
-  onEnd,
-  ...restProps
-}, ref) => {
-  const invalidate = useThree(state => state.invalidate);
-  const defaultCamera = useThree(state => state.camera);
-  const gl = useThree(state => state.gl);
-  const events = useThree(state => state.events);
-  const setEvents = useThree(state => state.setEvents);
-  const set = useThree(state => state.set);
-  const get = useThree(state => state.get);
-  const performance = useThree(state => state.performance);
-  const explCamera = camera || defaultCamera;
-  const explDomElement = domElement || events.connected || gl.domElement;
-  const controls = React.useMemo(() => new OrbitControls$1(explCamera), [explCamera]);
-  useFrame(() => {
-    if (controls.enabled) controls.update();
-  }, -1);
-  React.useEffect(() => {
-    if (keyEvents) {
-      controls.connect(keyEvents === true ? explDomElement : keyEvents);
-    }
-    controls.connect(explDomElement);
-    return () => void controls.dispose();
-  }, [keyEvents, explDomElement, regress, controls, invalidate]);
-  React.useEffect(() => {
-    const callback = e => {
-      invalidate();
-      if (regress) performance.regress();
-      if (onChange) onChange(e);
-    };
-    const onStartCb = e => {
-      if (onStart) onStart(e);
-    };
-    const onEndCb = e => {
-      if (onEnd) onEnd(e);
-    };
-    controls.addEventListener('change', callback);
-    controls.addEventListener('start', onStartCb);
-    controls.addEventListener('end', onEndCb);
-    return () => {
-      controls.removeEventListener('start', onStartCb);
-      controls.removeEventListener('end', onEndCb);
-      controls.removeEventListener('change', callback);
-    };
-  }, [onChange, onStart, onEnd, controls, invalidate, setEvents]);
-  React.useEffect(() => {
-    if (makeDefault) {
-      const old = get().controls;
-      // @ts-ignore https://github.com/three-types/three-ts-types/pull/1398
-      set({
-        controls
-      });
-      return () => set({
-        controls: old
-      });
-    }
-  }, [makeDefault, controls]);
-  return /*#__PURE__*/React.createElement("primitive", _extends({
-    ref: ref,
-    object: controls,
-    enableDamping: enableDamping
-  }, restProps));
-});
-
-export { OrbitControls };

package/core/OrthographicCamera.cjs.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("react"),t=require("@react-three/fiber"),u=require("./Fbo.cjs.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function a(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var u=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,u.get?u:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}require("three");var c=n(e),o=a(r);const s=o.forwardRef((({envMap:e,resolution:r=256,frames:n=1/0,children:a,makeDefault:s,...i},l)=>{const f=t.useThree((({set:e})=>e)),d=t.useThree((({camera:e})=>e)),h=t.useThree((({size:e})=>e)),b=o.useRef(null);o.useImperativeHandle(l,(()=>b.current),[]);const g=o.useRef(null),m=u.useFBO(r);o.useLayoutEffect((()=>{i.manual||b.current.updateProjectionMatrix()}),[h,i]),o.useLayoutEffect((()=>{b.current.updateProjectionMatrix()})),o.useLayoutEffect((()=>{if(s){const e=d;return f((()=>({camera:b.current}))),()=>f((()=>({camera:e})))}}),[b,s,f]);let p=0,j=null;const v="function"==typeof a;return t.useFrame((r=>{v&&(n===1/0||p<n)&&(g.current.visible=!1,r.gl.setRenderTarget(m),j=r.scene.background,e&&(r.scene.background=e),r.gl.render(r.scene,b.current),r.scene.background=j,r.gl.setRenderTarget(null),g.current.visible=!0,p++)})),o.createElement(o.Fragment,null,o.createElement("orthographicCamera",c.default({left:h.width/-2,right:h.width/2,top:h.height/2,bottom:h.height/-2,ref:b},i),!v&&a),o.createElement("group",{ref:g},v&&a(m.texture)))}));exports.OrthographicCamera=s;

package/core/OrthographicCamera.d.ts

@@ -1,14 +0,0 @@
-import * as THREE from 'three';
-import * as React from 'react';
-import { OrthographicCamera as OrthographicCameraImpl } from 'three';
-import { ThreeElements } from '@react-three/fiber';
-import { ForwardRefComponent } from '../helpers/ts-utils';
-export type OrthographicCameraProps = Omit<ThreeElements['orthographicCamera'], 'ref' | 'children'> & {
-    makeDefault?: boolean;
-    manual?: boolean;
-    children?: React.ReactNode | ((texture: THREE.Texture) => React.ReactNode);
-    frames?: number;
-    resolution?: number;
-    envMap?: THREE.Texture;
-};
-export declare const OrthographicCamera: ForwardRefComponent<OrthographicCameraProps, OrthographicCameraImpl>;

package/core/OrthographicCamera.js

@@ -1,76 +0,0 @@
-import _extends from '@babel/runtime/helpers/esm/extends';
-import * as React from 'react';
-import { useThree, useFrame } from '@react-three/fiber';
-import { useFBO } from './Fbo.js';
-
-const isFunction = node => typeof node === 'function';
-const OrthographicCamera = /* @__PURE__ */React.forwardRef(({
-  envMap,
-  resolution = 256,
-  frames = Infinity,
-  children,
-  makeDefault,
-  ...props
-}, ref) => {
-  const set = useThree(({
-    set
-  }) => set);
-  const camera = useThree(({
-    camera
-  }) => camera);
-  const size = useThree(({
-    size
-  }) => size);
-  const cameraRef = React.useRef(null);
-  React.useImperativeHandle(ref, () => cameraRef.current, []);
-  const groupRef = React.useRef(null);
-  const fbo = useFBO(resolution);
-  React.useLayoutEffect(() => {
-    if (!props.manual) {
-      cameraRef.current.updateProjectionMatrix();
-    }
-  }, [size, props]);
-  React.useLayoutEffect(() => {
-    cameraRef.current.updateProjectionMatrix();
-  });
-  React.useLayoutEffect(() => {
-    if (makeDefault) {
-      const oldCam = camera;
-      set(() => ({
-        camera: cameraRef.current
-      }));
-      return () => set(() => ({
-        camera: oldCam
-      }));
-    }
-    // The camera should not be part of the dependency list because this components camera is a stable reference
-    // that must exchange the default, and clean up after itself on unmount.
-  }, [cameraRef, makeDefault, set]);
-  let count = 0;
-  let oldEnvMap = null;
-  const functional = isFunction(children);
-  useFrame(state => {
-    if (functional && (frames === Infinity || count < frames)) {
-      groupRef.current.visible = false;
-      state.gl.setRenderTarget(fbo);
-      oldEnvMap = state.scene.background;
-      if (envMap) state.scene.background = envMap;
-      state.gl.render(state.scene, cameraRef.current);
-      state.scene.background = oldEnvMap;
-      state.gl.setRenderTarget(null);
-      groupRef.current.visible = true;
-      count++;
-    }
-  });
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("orthographicCamera", _extends({
-    left: size.width / -2,
-    right: size.width / 2,
-    top: size.height / 2,
-    bottom: size.height / -2,
-    ref: cameraRef
-  }, props), !functional && children), /*#__PURE__*/React.createElement("group", {
-    ref: groupRef
-  }, functional && children(fbo.texture)));
-});
-
-export { OrthographicCamera };

package/core/Outlines.cjs.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),n=require("three"),r=require("react"),t=require("./shaderMaterial.cjs.js"),i=require("@react-three/fiber"),o=require("three-stdlib"),c=require("../helpers/constants.cjs.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function s(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var t=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(n,r,t.get?t:{enumerable:!0,get:function(){return e[r]}})}})),n.default=e,Object.freeze(n)}var l=a(e),p=s(n),u=s(r);const f=t.shaderMaterial({screenspace:!1,color:new p.Color("black"),opacity:1,thickness:.05,size:new p.Vector2},"#include <common>\n   #include <morphtarget_pars_vertex>\n   #include <skinning_pars_vertex>\n   #include <clipping_planes_pars_vertex>\n   uniform float thickness;\n   uniform bool screenspace;\n   uniform vec2 size;\n   void main() {\n     #if defined (USE_SKINNING)\n\t     #include <beginnormal_vertex>\n       #include <morphnormal_vertex>\n       #include <skinbase_vertex>\n       #include <skinnormal_vertex>\n       #include <defaultnormal_vertex>\n     #endif\n     #include <begin_vertex>\n\t   #include <morphtarget_vertex>\n\t   #include <skinning_vertex>\n     #include <project_vertex>\n     #include <clipping_planes_vertex>\n     vec4 tNormal = vec4(normal, 0.0);\n     vec4 tPosition = vec4(transformed, 1.0);\n     #ifdef USE_INSTANCING\n       tNormal = instanceMatrix * tNormal;\n       tPosition = instanceMatrix * tPosition;\n     #endif\n     if (screenspace) {\n       vec3 newPosition = tPosition.xyz + tNormal.xyz * thickness;\n       gl_Position = projectionMatrix * modelViewMatrix * vec4(newPosition, 1.0); \n     } else {\n       vec4 clipPosition = projectionMatrix * modelViewMatrix * tPosition;\n       vec4 clipNormal = projectionMatrix * modelViewMatrix * tNormal;\n       vec2 offset = normalize(clipNormal.xy) * thickness / size * clipPosition.w * 2.0;\n       clipPosition.xy += offset;\n       gl_Position = clipPosition;\n     }\n   }",`uniform vec3 color;\n   uniform float opacity;\n   #include <clipping_planes_pars_fragment>\n   void main(){\n     #include <clipping_planes_fragment>\n     gl_FragColor = vec4(color, opacity);\n     #include <tonemapping_fragment>\n     #include <${c.version>=154?"colorspace_fragment":"encodings_fragment"}>\n   }`);exports.Outlines=function({color:e="black",opacity:n=1,transparent:r=!1,screenspace:t=!1,toneMapped:c=!0,polygonOffset:a=!1,polygonOffsetFactor:s=0,renderOrder:d=0,thickness:m=.05,angle:g=Math.PI,clippingPlanes:v,...h}){const y=u.useRef(null),[_]=u.useState((()=>new f({side:p.BackSide}))),{gl:x}=i.useThree(),M=x.getDrawingBufferSize(new p.Vector2);u.useMemo((()=>i.extend({OutlinesMaterial:f})),[]);const P=u.useRef(0),b=u.useRef(null);return u.useLayoutEffect((()=>{const e=y.current;if(!e)return;const n=e.parent;if(n&&n.geometry&&(P.current!==g||b.current!==n.geometry)){var r;P.current=g,b.current=n.geometry;let t=null==(r=e.children)?void 0:r[0];t&&(g&&t.geometry.dispose(),e.remove(t)),n.skeleton?(t=new p.SkinnedMesh,t.material=_,t.bind(n.skeleton,n.bindMatrix),e.add(t)):n.isInstancedMesh?(t=new p.InstancedMesh(n.geometry,_,n.count),t.instanceMatrix=n.instanceMatrix,e.add(t)):(t=new p.Mesh,t.material=_,e.add(t)),t.geometry=g?o.toCreasedNormals(n.geometry,g):n.geometry,t.morphTargetInfluences=n.morphTargetInfluences,t.morphTargetDictionary=n.morphTargetDictionary}})),u.useLayoutEffect((()=>{const o=y.current;if(!o)return;const l=o.children[0];if(l){l.renderOrder=d;const p=o.parent;i.applyProps(l,{morphTargetInfluences:p.morphTargetInfluences,morphTargetDictionary:p.morphTargetDictionary}),i.applyProps(l.material,{transparent:r,thickness:m,color:e,opacity:n,size:M,screenspace:t,toneMapped:c,polygonOffset:a,polygonOffsetFactor:s,clippingPlanes:v,clipping:v&&v.length>0})}})),u.useEffect((()=>()=>{const e=y.current;if(!e)return;const n=e.children[0];n&&(g&&n.geometry.dispose(),e.remove(n))}),[]),u.createElement("group",l.default({ref:y},h))};

package/core/Outlines.d.ts

@@ -1,17 +0,0 @@
-import * as THREE from 'three';
-import * as React from 'react';
-import { ReactThreeFiber, ThreeElements } from '@react-three/fiber';
-export type OutlinesProps = Omit<ThreeElements['group'], 'ref'> & {
-    color?: ReactThreeFiber.Color;
-    screenspace?: boolean;
-    opacity?: number;
-    transparent?: boolean;
-    thickness?: number;
-    angle?: number;
-    clippingPlanes?: THREE.Plane[];
-    toneMapped?: boolean;
-    polygonOffset?: boolean;
-    polygonOffsetFactor?: number;
-    renderOrder?: number;
-};
-export declare function Outlines({ color, opacity, transparent, screenspace, toneMapped, polygonOffset, polygonOffsetFactor, renderOrder, thickness, angle, clippingPlanes, ...props }: OutlinesProps): React.JSX.Element;

package/core/Outlines.js

@@ -1,166 +0,0 @@
-import _extends from '@babel/runtime/helpers/esm/extends';
-import * as THREE from 'three';
-import * as React from 'react';
-import { shaderMaterial } from './shaderMaterial.js';
-import { useThree, extend, applyProps } from '@react-three/fiber';
-import { toCreasedNormals } from 'three-stdlib';
-import { version } from '../helpers/constants.js';
-
-const OutlinesMaterial = /* @__PURE__ */shaderMaterial({
-  screenspace: false,
-  color: /* @__PURE__ */new THREE.Color('black'),
-  opacity: 1,
-  thickness: 0.05,
-  size: /* @__PURE__ */new THREE.Vector2()
-}, `#include <common>
-   #include <morphtarget_pars_vertex>
-   #include <skinning_pars_vertex>
-   #include <clipping_planes_pars_vertex>
-   uniform float thickness;
-   uniform bool screenspace;
-   uniform vec2 size;
-   void main() {
-     #if defined (USE_SKINNING)
-	     #include <beginnormal_vertex>
-       #include <morphnormal_vertex>
-       #include <skinbase_vertex>
-       #include <skinnormal_vertex>
-       #include <defaultnormal_vertex>
-     #endif
-     #include <begin_vertex>
-	   #include <morphtarget_vertex>
-	   #include <skinning_vertex>
-     #include <project_vertex>
-     #include <clipping_planes_vertex>
-     vec4 tNormal = vec4(normal, 0.0);
-     vec4 tPosition = vec4(transformed, 1.0);
-     #ifdef USE_INSTANCING
-       tNormal = instanceMatrix * tNormal;
-       tPosition = instanceMatrix * tPosition;
-     #endif
-     if (screenspace) {
-       vec3 newPosition = tPosition.xyz + tNormal.xyz * thickness;
-       gl_Position = projectionMatrix * modelViewMatrix * vec4(newPosition, 1.0); 
-     } else {
-       vec4 clipPosition = projectionMatrix * modelViewMatrix * tPosition;
-       vec4 clipNormal = projectionMatrix * modelViewMatrix * tNormal;
-       vec2 offset = normalize(clipNormal.xy) * thickness / size * clipPosition.w * 2.0;
-       clipPosition.xy += offset;
-       gl_Position = clipPosition;
-     }
-   }`, `uniform vec3 color;
-   uniform float opacity;
-   #include <clipping_planes_pars_fragment>
-   void main(){
-     #include <clipping_planes_fragment>
-     gl_FragColor = vec4(color, opacity);
-     #include <tonemapping_fragment>
-     #include <${version >= 154 ? 'colorspace_fragment' : 'encodings_fragment'}>
-   }`);
-function Outlines({
-  color = 'black',
-  opacity = 1,
-  transparent = false,
-  screenspace = false,
-  toneMapped = true,
-  polygonOffset = false,
-  polygonOffsetFactor = 0,
-  renderOrder = 0,
-  thickness = 0.05,
-  angle = Math.PI,
-  clippingPlanes,
-  ...props
-}) {
-  const ref = React.useRef(null);
-  const [material] = React.useState(() => new OutlinesMaterial({
-    side: THREE.BackSide
-  }));
-  const {
-    gl
-  } = useThree();
-  const contextSize = gl.getDrawingBufferSize(new THREE.Vector2());
-  React.useMemo(() => extend({
-    OutlinesMaterial
-  }), []);
-  const oldAngle = React.useRef(0);
-  const oldGeometry = React.useRef(null);
-  React.useLayoutEffect(() => {
-    const group = ref.current;
-    if (!group) return;
-    const parent = group.parent;
-    if (parent && parent.geometry) {
-      if (oldAngle.current !== angle || oldGeometry.current !== parent.geometry) {
-        var _group$children;
-        oldAngle.current = angle;
-        oldGeometry.current = parent.geometry;
-
-        // Remove old mesh
-        let mesh = (_group$children = group.children) == null ? void 0 : _group$children[0];
-        if (mesh) {
-          if (angle) mesh.geometry.dispose();
-          group.remove(mesh);
-        }
-        if (parent.skeleton) {
-          mesh = new THREE.SkinnedMesh();
-          mesh.material = material;
-          mesh.bind(parent.skeleton, parent.bindMatrix);
-          group.add(mesh);
-        } else if (parent.isInstancedMesh) {
-          mesh = new THREE.InstancedMesh(parent.geometry, material, parent.count);
-          mesh.instanceMatrix = parent.instanceMatrix;
-          group.add(mesh);
-        } else {
-          mesh = new THREE.Mesh();
-          mesh.material = material;
-          group.add(mesh);
-        }
-        mesh.geometry = angle ? toCreasedNormals(parent.geometry, angle) : parent.geometry;
-        mesh.morphTargetInfluences = parent.morphTargetInfluences;
-        mesh.morphTargetDictionary = parent.morphTargetDictionary;
-      }
-    }
-  });
-  React.useLayoutEffect(() => {
-    const group = ref.current;
-    if (!group) return;
-    const mesh = group.children[0];
-    if (mesh) {
-      mesh.renderOrder = renderOrder;
-      const parent = group.parent;
-      applyProps(mesh, {
-        morphTargetInfluences: parent.morphTargetInfluences,
-        morphTargetDictionary: parent.morphTargetDictionary
-      });
-      applyProps(mesh.material, {
-        transparent,
-        thickness,
-        color,
-        opacity,
-        size: contextSize,
-        screenspace,
-        toneMapped,
-        polygonOffset,
-        polygonOffsetFactor,
-        clippingPlanes,
-        clipping: clippingPlanes && clippingPlanes.length > 0
-      });
-    }
-  });
-  React.useEffect(() => {
-    return () => {
-      // Dispose everything on unmount
-      const group = ref.current;
-      if (!group) return;
-      const mesh = group.children[0];
-      if (mesh) {
-        if (angle) mesh.geometry.dispose();
-        group.remove(mesh);
-      }
-    };
-  }, []);
-  return /*#__PURE__*/React.createElement("group", _extends({
-    ref: ref
-  }, props));
-}
-
-export { Outlines };