@tresjs/core 2.4.0-next.3 → 2.4.0-next.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/tres.umd.cjs CHANGED
@@ -1,8 +1,8 @@
1
1
  /**
2
2
  * name: @tresjs/core
3
- * version: v2.4.0-next.3
3
+ * version: v2.4.0-next.4
4
4
  * (c) 2023
5
5
  * description: Declarative ThreeJS using Vue Components
6
6
  * author: Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)
7
7
  */
8
- (function(d,u){typeof exports=="object"&&typeof module<"u"?u(exports,require("vue"),require("three"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","three","@vueuse/core"],u):(d=typeof globalThis<"u"?globalThis:d||self,u(d.tres={},d.Vue,d.Three,d.VueUseCore))})(this,function(d,u,g,f){"use strict";function ue(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const a in e)if(a!=="default"){const t=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(n,a,t.get?t:{enumerable:!0,get:()=>e[a]})}}return n.default=e,Object.freeze(n)}const le=ue(g);function Y(e){const n=u.shallowReactive([]),a=u.computed(()=>n.find(i=>i.userData.IS_ACTIVE_CAMERA));function t(i,s=!0){n.push(i),s&&r(i.uuid)}function r(i){const s=n.find(o=>o.uuid===i);s&&(n.forEach(o=>o.userData.IS_ACTIVE_CAMERA=!1),s.userData.IS_ACTIVE_CAMERA=!0)}return u.watchEffect(()=>{var i;(i=e.aspectRatio)!=null&&i.value&&(console.log("camera watcher aspectRatio",e.aspectRatio.value),n.forEach(s=>{s instanceof g.PerspectiveCamera&&(s.aspect=e.aspectRatio.value),s.updateProjectionMatrix()}))}),{cameras:n,camera:a,addCamera:t,setCameraToActive:r}}const K=f.createEventHook(),X=f.createEventHook(),I=f.createEventHook(),E=new g.Clock;let R=0,x=0;const{pause:fe,resume:de,isActive:me}=f.useRafFn(()=>{K.trigger({delta:R,elapsed:x,clock:E}),X.trigger({delta:R,elapsed:x,clock:E}),I.trigger({delta:R,elapsed:x,clock:E})},{immediate:!1});I.on(()=>{R=E.getDelta(),x=E.getElapsedTime()});function z(){return{onBeforeLoop:K.on,onLoop:X.on,onAfterLoop:I.on,pause:fe,resume:de,isActive:me}}function pe(e){return typeof e=="number"?[e,e,e]:e instanceof g.Vector3?[e.x,e.y,e.z]:e}function J(e){return e instanceof g.Color?e:Array.isArray(e)?new g.Color(...e):new g.Color(e)}const G={realistic:{outputColorSpace:g.SRGBColorSpace,toneMapping:g.ACESFilmicToneMapping,toneMappingExposure:3,shadowMap:{enabled:!0,type:g.PCFSoftShadowMap}}},Q=(e,n)=>{for(const a of Object.keys(n))n[a]instanceof Object&&Object.assign(n[a],Q(e[a],n[a]));return Object.assign(e||{},n),e},ve=ge("html,body,base,head,link,meta,style,title,address,article,aside,footer,header,hgroup,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,option,output,progress,select,textarea,details,dialog,menu,summary,template,blockquote,iframe,tfoot");function k(e){return e.replace(/-([a-z])/g,(n,a)=>a.toUpperCase())}function ge(e,n){const a=Object.create(null),t=e.split(",");for(let r=0;r<t.length;r++)a[t[r]]=!0;return n?r=>!!a[r.toLowerCase()]:r=>!!a[r]}const we=(e,n)=>{const a=new Set,t=[];for(const r of e){const i=n(r);a.has(i)||(a.add(i),t.push(r))}return t},be=!0,Z="[TresJS ▲ ■ ●] ";function A(){function e(t,r){console.error(`${Z} ${t}`,r||"")}function n(t){console.warn(`${Z} ${t}`)}function a(t,r){}return{logError:e,logWarning:n,logMessage:a}}function H(e,n,a){const t=u.shallowRef(),r=u.ref(!1),{alpha:i=!0,antialias:s=!0,depth:o,logarithmicDepthBuffer:c,failIfMajorPerformanceCaveat:l,precision:p,premultipliedAlpha:w,stencil:v,shadows:_=!1,shadowMapType:M=g.PCFShadowMap,useLegacyLights:h=!1,outputColorSpace:C=g.LinearSRGBColorSpace,toneMapping:P=g.NoToneMapping,toneMappingExposure:O=1,context:V=void 0,powerPreference:j="default",preserveDrawingBuffer:B=!1,clearColor:S,windowSize:m=!1,preset:b=void 0}=u.toRefs(a),{cameras:Ue,setRenderer:je,sizes:q}=n,{logError:Be,logWarning:$e}=A(),{pixelRatio:D}=f.useDevicePixelRatio(),{pause:De,resume:Ie}=z(),se=()=>{t.value&&(t.value.setSize(q.width.value,q.height.value),t.value.setPixelRatio(Math.min(D.value,2)))},ce=()=>{if(!t.value)return;const T=f.toValue(b);if(T){T in G||Be("Renderer Preset must be one of these: "+Object.keys(G).join(", ")),Q(t.value,G[T]);return}t.value.shadowMap.enabled=f.toValue(_),t.value.shadowMap.type=f.toValue(M),t.value.toneMapping=f.toValue(P)||g.NoToneMapping,t.value.toneMappingExposure=f.toValue(O),t.value.outputColorSpace=f.toValue(C)||g.LinearSRGBColorSpace,S!=null&&S.value&&t.value.setClearColor(J(f.toValue(S))),t.value.useLegacyLights=f.toValue(h)},ze=()=>{const T=f.unrefElement(e);console.count("init renderer"),T&&(t.value=new g.WebGLRenderer({canvas:T,alpha:f.toValue(i),antialias:f.toValue(s),context:f.toValue(V),depth:f.toValue(o),failIfMajorPerformanceCaveat:f.toValue(l),logarithmicDepthBuffer:f.toValue(c),powerPreference:f.toValue(j),precision:f.toValue(p),stencil:f.toValue(v),preserveDrawingBuffer:f.toValue(B),premultipliedAlpha:f.toValue(w)}),je(t.value),ce(),se(),Ie(),r.value=!0)},Ge=()=>{t.value&&(t.value.dispose(),t.value=void 0,r.value=!1,De())};return u.watchEffect(()=>{var T;((T=q.aspectRatio)!=null&&T.value||D!=null&&D.value)&&se()}),u.watch([_,M,C,h,P,O,S],ce),u.watch(e,()=>{f.unrefElement(e)&&ze()},{immediate:!0,deep:!0}),{renderer:t,isReady:r,dispose:Ge}}const ee=e=>typeof e=="function",te=e=>!!e&&e.constructor===Array;function ne(e){const n={nodes:{},materials:{}};return e&&e.traverse(a=>{a.name&&(n.nodes[a.name]=a),a.material&&!n.materials[a.material.name]&&(n.materials[a.material.name]=a.material)}),n}async function ye(e,n,a,t,r){const{logError:i}=A(),s=new e;r&&r(s),a&&a(s);const c=(Array.isArray(n)?n:[n]).map(l=>new Promise((p,w)=>{s.load(l,v=>{v.scene&&Object.assign(v,ne(v.scene)),p(v)},t,v=>w(i("[useLoader] - Failed to load resource",v)))}));return te(n)?await Promise.all(c):await c[0]}async function Ce(e){const n=new g.LoadingManager,a=new g.TextureLoader(n),t=r=>new Promise((i,s)=>{a.load(r,o=>i(o),()=>null,()=>{s(new Error("[useTextures] - Failed to load texture"))})});if(te(e)){const r=await Promise.all(e.map(i=>t(i)));return e.length>1?r:r[0]}else{const{map:r,displacementMap:i,normalMap:s,roughnessMap:o,metalnessMap:c,aoMap:l,alphaMap:p,matcap:w}=e;return{map:r?await t(r):null,displacementMap:i?await t(i):null,normalMap:s?await t(s):null,roughnessMap:o?await t(o):null,metalnessMap:c?await t(c):null,aoMap:l?await t(l):null,alphaMap:p?await t(p):null,matcap:w?await t(w):null}}}const y=["00","01","02","03","04","05","06","07","08","09","0a","0b","0c","0d","0e","0f","10","11","12","13","14","15","16","17","18","19","1a","1b","1c","1d","1e","1f","20","21","22","23","24","25","26","27","28","29","2a","2b","2c","2d","2e","2f","30","31","32","33","34","35","36","37","38","39","3a","3b","3c","3d","3e","3f","40","41","42","43","44","45","46","47","48","49","4a","4b","4c","4d","4e","4f","50","51","52","53","54","55","56","57","58","59","5a","5b","5c","5d","5e","5f","60","61","62","63","64","65","66","67","68","69","6a","6b","6c","6d","6e","6f","70","71","72","73","74","75","76","77","78","79","7a","7b","7c","7d","7e","7f","80","81","82","83","84","85","86","87","88","89","8a","8b","8c","8d","8e","8f","90","91","92","93","94","95","96","97","98","99","9a","9b","9c","9d","9e","9f","a0","a1","a2","a3","a4","a5","a6","a7","a8","a9","aa","ab","ac","ad","ae","af","b0","b1","b2","b3","b4","b5","b6","b7","b8","b9","ba","bb","bc","bd","be","bf","c0","c1","c2","c3","c4","c5","c6","c7","c8","c9","ca","cb","cc","cd","ce","cf","d0","d1","d2","d3","d4","d5","d6","d7","d8","d9","da","db","dc","dd","de","df","e0","e1","e2","e3","e4","e5","e6","e7","e8","e9","ea","eb","ec","ed","ee","ef","f0","f1","f2","f3","f4","f5","f6","f7","f8","f9","fa","fb","fc","fd","fe","ff"];function he(){const e=Math.random()*4294967295|0,n=Math.random()*4294967295|0,a=Math.random()*4294967295|0,t=Math.random()*4294967295|0;return(y[e&255]+y[e>>8&255]+y[e>>16&255]+y[e>>24&255]+"-"+y[n&255]+y[n>>8&255]+"-"+y[n>>16&15|64]+y[n>>24&255]+"-"+y[a&63|128]+y[a>>8&255]+"-"+y[a>>16&255]+y[a>>24&255]+y[t&255]+y[t>>8&255]+y[t>>16&255]+y[t>>24&255]).toLowerCase()}const N=Symbol();function Me(){const e=u.shallowReactive({uuid:he(),camera:void 0,cameras:[],canvas:void 0,scene:void 0,renderer:void 0,aspectRatio:void 0,pointerEventHandler:void 0});function n(r){return e[r]}function a(r,i){e[r]=i}const t={state:e,...u.toRefs(e),getState:n,setState:a};return u.provide(N,t),t}const ae=()=>u.inject(N,{state:u.shallowReactive({camera:void 0,cameras:[],canvas:void 0,scene:void 0,renderer:void 0,pointerEventHandler:void 0})}),oe=e=>{const{state:n}=ae(),a=u.computed(()=>{var m;return(m=n.canvas)==null?void 0:m.value}),{x:t,y:r}=f.usePointer({target:a}),{width:i,height:s,top:o,left:c}=f.useElementBounding(a),l=new g.Raycaster,p=({x:m,y:b})=>{if(a.value)return{x:(m-c.value)/i.value*2-1,y:-((b-o.value)/s.value)*2+1}},w=({x:m,y:b})=>{if(n.camera)return l.setFromCamera(new g.Vector2(m,b),n.camera),l.intersectObjects(e.value,!1)},v=m=>{const b=p({x:(m==null?void 0:m.clientX)??t.value,y:(m==null?void 0:m.clientY)??r.value});return b?w(b)||[]:[]},_=u.computed(()=>v()),M=f.createEventHook(),h=f.createEventHook(),C=(m,b)=>{m.trigger({event:b,intersects:v(b)})},P=m=>{C(h,m)};let O;const V=m=>{var b;O=(b=v(m)[0])==null?void 0:b.object},j=m=>{var b;m instanceof PointerEvent&&O===((b=v(m)[0])==null?void 0:b.object)&&C(M,m)},B=m=>h.trigger({event:m,intersects:[]}),S=u.watchEffect(()=>{a!=null&&a.value&&(a.value.addEventListener("pointerup",j),a.value.addEventListener("pointerdown",V),a.value.addEventListener("pointermove",P),a.value.addEventListener("pointerleave",B),S())});return u.onUnmounted(()=>{a!=null&&a.value&&(a.value.removeEventListener("pointerup",j),a.value.removeEventListener("pointerdown",V),a.value.removeEventListener("pointermove",P),a.value.removeEventListener("pointerleave",B))}),{intersects:_,onClick:m=>M.on(m).off,onPointerMove:m=>h.on(m).off}};function Pe(){const{logWarning:e}=A();function n(t,r,i){let s=null;return t.traverse(o=>{o[r]===i&&(s=o)}),s||e(`Child with ${r} '${i}' not found.`),s}function a(t,r){return n(t,"name",r)}return{seek:n,seekByName:a}}const _e=()=>{const e=u.reactive({click:new Map,pointerMove:new Map,pointerEnter:new Map,pointerLeave:new Map}),n=o=>{Object.values(e).forEach(c=>c.delete(o))},a=o=>{const{onClick:c,onPointerMove:l,onPointerEnter:p,onPointerLeave:w}=o;c&&e.click.set(o,c),l&&e.pointerMove.set(o,l),p&&e.pointerEnter.set(o,p),w&&e.pointerLeave.set(o,w),o.addEventListener("removed",()=>{o.traverse(v=>{n(v)}),n(o)})},t=u.computed(()=>we(Object.values(e).map(o=>Array.from(o.keys())).flat(),({uuid:o})=>o)),{onClick:r,onPointerMove:i}=oe(t);r(({intersects:o,event:c})=>{var l;o.length&&((l=e.click.get(o[0].object))==null||l(o[0],c))});let s;return i(({intersects:o,event:c})=>{var _,M,h,C;const l=(_=o==null?void 0:o[0])==null?void 0:_.object,{pointerLeave:p,pointerEnter:w,pointerMove:v}=e;s&&s!==l&&((M=p.get(s))==null||M(s,c)),l&&(s!==l&&((h=w.get(l))==null||h(o[0],c)),(C=v.get(l))==null||C(o[0],c)),s=l||null}),{registerObject:a,deregisterObject:n}},{logError:Te}=A();function Ae(e,n,a){var h;e||Te("A scene most be provided to the TresProvider");const{width:t,height:r}=f.toValue(a.windowSize)==!0||f.toValue(a.windowSize)===""||f.toValue(a.windowSize)==="true"||n.value===void 0?f.useWindowSize():f.useElementSize((h=n.value)==null?void 0:h.parentElement),i=u.computed(()=>t.value/r.value),s={height:r,width:t,aspectRatio:i},o=u.shallowRef(e),{camera:c,cameras:l,addCamera:p,setCameraToActive:w}=Y(s),v=u.shallowRef(null);function _(C){v.value||(v.value=C)}const M={scene:u.readonly(o),cameras:u.readonly(l),camera:c,addCamera:p,setCameraToActive:w,renderer:u.readonly(v),setRenderer:_,sizes:s};return u.provide("useTres",M),M}function Se(){const e=u.inject("useTres");if(!e)throw new Error("useTresContext must be used within a TresProvider");return e}const F=u.ref({}),W=e=>void Object.assign(F.value,e),U={GEOMETRY_VIA_PROP:"tres__geometryViaProp",MATERIAL_VIA_PROP:"tres__materialViaProp",REGISTER_AT_POINTER_EVENT_HANDLER:"tres__registerAtPointerEventHandler"};function Fe(e){}let $=null,L=null;const{logError:re}=A(),Ee={createElement(e,n,a,t){var c,l;if(t||(t={}),t.args||(t.args=[]),e==="template"||ve(e))return null;let r=e.replace("Tres",""),i;if(e==="primitive"){(t==null?void 0:t.object)===void 0&&re("Tres primitives need a prop 'object'");const p=t.object;r=p.type,i=Object.assign(p,{type:r,attach:t.attach,primitive:!0})}else{const p=F.value[r];p||re(`${r} is not defined on the THREE namespace. Use extend to add it to the catalog.`),i=new p(...t.args)}i.isCamera&&(t!=null&&t.position||i.position.set(3,3,3),t!=null&&t.lookAt||i.lookAt(0,0,0)),(t==null?void 0:t.attach)===void 0&&(i.isMaterial?i.attach="material":i.isBufferGeometry&&(i.attach="geometry"));const{GEOMETRY_VIA_PROP:s,MATERIAL_VIA_PROP:o}=U;return i.isObject3D&&((c=t==null?void 0:t.material)!=null&&c.isMaterial&&(i.userData[o]=!0),(l=t==null?void 0:t.geometry)!=null&&l.isBufferGeometry&&(i.userData[s]=!0)),i},insert(e,n){var a,t,r,i,s,o,c;if(n&&n.isScene&&(L=n),(((a=e==null?void 0:e.__vnode)==null?void 0:a.type)==="TresGroup"||((t=e==null?void 0:e.__vnode)==null?void 0:t.type)==="TresObject3D")&&n===null&&!((i=(r=e==null?void 0:e.__vnode)==null?void 0:r.ctx)!=null&&i.asyncResolved)){$=e;return}else(s=e==null?void 0:e.__vnode)!=null&&s.type.includes("Controls")&&n===null&&($=L);n||(n=$),e!=null&&e.isObject3D&&(n!=null&&n.isObject3D)?(n.add(e),e.dispatchEvent({type:"added"}),(c=(o=L==null?void 0:L.userData)==null?void 0:o[U.REGISTER_AT_POINTER_EVENT_HANDLER])==null||c.call(o,e)):e!=null&&e.isFog?n.fog=e:typeof(e==null?void 0:e.attach)=="string"&&(e.__previousAttach=e[n==null?void 0:n.attach],n&&(n[e.attach]=e))},remove(e){var n,a;if(e){if(e.isObject3D){const t=e,r=i=>{var c,l;const{GEOMETRY_VIA_PROP:s,MATERIAL_VIA_PROP:o}=U;i.userData[o]||(c=i.material)==null||c.dispose(),i.userData[s]||(l=i.geometry)==null||l.dispose()};t.traverse(i=>{r(i)}),r(t)}(n=e.removeFromParent)==null||n.call(e),(a=e.dispose)==null||a.call(e)}},patchProp(e,n,a,t){if(e){let r=e,i=n,s=k(i),o=r==null?void 0:r[s];if(r.type==="BufferGeometry"){if(i==="args")return;r.setAttribute(k(i),new g.BufferAttribute(...t));return}if(i.includes("-")&&o===void 0){const l=i.split("-");o=l.reduce((p,w)=>p[k(w)],r),i=l.pop(),s=i.toLowerCase(),o!=null&&o.set||(r=l.reduce((p,w)=>p[k(w)],r))}let c=t;if(c===""&&(c=!0),ee(o)){Array.isArray(c)?e[s](...c):e[s](c);return}!(o!=null&&o.set)&&!ee(o)?r[s]=c:o.constructor===c.constructor&&(o!=null&&o.copy)?o==null||o.copy(c):Array.isArray(c)?o.set(...c):!o.isColor&&o.setScalar?o.setScalar(c):o.set(c)}},parentNode(e){return(e==null?void 0:e.parent)||null},createText:()=>void 0,createComment:()=>void 0,setText:()=>void 0,setElementText:()=>void 0,nextSibling:()=>void 0,querySelector:()=>void 0,setScopeId:()=>void 0,cloneNode:()=>void 0,insertStaticContent:()=>void 0},{createApp:Le}=u.createRenderer(Ee),Oe=e=>{const n=Le(a);function a(){return e&&e.default?e.default():[]}return n};W(le);const Re=["data-scene"],ie=u.defineComponent({__name:"TresCanvas",props:{shadows:{type:Boolean},shadowMapType:{},useLegacyLights:{type:Boolean},outputColorSpace:{},toneMapping:{},toneMappingExposure:{},context:{},powerPreference:{},preserveDrawingBuffer:{type:Boolean},clearColor:{},windowSize:{type:Boolean},preset:{},disableRender:{type:Boolean},camera:{}},setup(e){const n=e,{logWarning:a}=A(),t=u.ref(),r=u.shallowRef(new g.Scene),{onLoop:i}=z(),s=u.useSlots();function o(){const c=Ae(r.value,t,n),{addCamera:l,camera:p,clearCameras:w}=c;let v;function _(){v=Oe(s),v.provide("useTres",c),v.provide("extend",W),v.mount(r.value),h()}_();const{renderer:M}=H(t,c,n);n.camera&&l(n.camera),i(()=>{var C;p.value&&n.disableRender!==!0&&((C=M.value)==null||C.render(r.value,p.value))});function h(){const C=r.value.getObjectByProperty("isCamera",!0);if(C)l(C);else{a("No camera found. Creating a default perspective camera. To have full control over a camera, please add one to the scene.");const P=new g.PerspectiveCamera(45,window.innerWidth/window.innerHeight,.1,1e3);P.position.set(3,3,3),P.lookAt(0,0,0),l(P)}u.watch(()=>n.camera,P=>{P&&(w(),l(P))})}}return u.onMounted(()=>{o()}),u.onUnmounted(()=>{}),(c,l)=>(u.openBlock(),u.createElementBlock("canvas",{ref_key:"canvas",ref:t,"data-scene":r.value.uuid,style:u.normalizeStyle({display:"block",width:"100%",height:"100%",position:c.windowSize?"fixed":"relative",top:0,left:0,pointerEvents:"auto",touchAction:"none",zIndex:1})},null,12,Re))}}),xe=["TresCanvas","TresLeches","TresScene"],ke={template:{compilerOptions:{isCustomElement:e=>e.startsWith("Tres")&&!xe.includes(e)||e==="primitive"}}},Ve={install(e){e.component("TresCanvas",ie)}};d.TRES_CONTEXT_KEY=N,d.TresCanvas=ie,d.catalogue=F,d.default=Ve,d.extend=W,d.isProd=be,d.normalizeColor=J,d.normalizeVectorFlexibleParam=pe,d.templateCompilerOptions=ke,d.trasverseObjects=ne,d.useCamera=Y,d.useLoader=ye,d.useLogger=A,d.usePointerEventHandler=_e,d.useRaycaster=oe,d.useRenderLoop=z,d.useRenderer=H,d.useSeek=Pe,d.useTexture=Ce,d.useTres=ae,d.useTresContext=Se,d.useTresProvider=Me,Object.defineProperties(d,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
8
+ (function(C,l){typeof exports=="object"&&typeof module<"u"?l(exports,require("vue"),require("three"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","three","@vueuse/core"],l):(C=typeof globalThis<"u"?globalThis:C||self,l(C.tres={},C.Vue,C.Three,C.VueUseCore))})(this,function(C,l,w,v){"use strict";function ae(e){const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const t=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(a,n,t.get?t:{enumerable:!0,get:()=>e[n]})}}return a.default=e,Object.freeze(a)}const oe=ae(w),I=l.ref({}),B=e=>void Object.assign(I.value,e),F=e=>typeof e=="function",W=e=>!!e&&e.constructor===Array,S={REGISTER_CAMERA:"tres__registerCamera",IS_ACTIVE_CAMERA:"tres__isActiveCamera",GEOMETRY_VIA_PROP:"tres__geometryViaProp",MATERIAL_VIA_PROP:"tres__materialViaProp",DEREGISTER_CAMERA:"tres__deregisterCamera",REGISTER_AT_POINTER_EVENT_HANDLER:"tres__registerAtPointerEventHandler",DEREGISTER_AT_POINTER_EVENT_HANDLER:"tres__deregisterAtPointerEventHandler"};function $({sizes:e,scene:a}){const{IS_ACTIVE_CAMERA:n,REGISTER_CAMERA:t,DEREGISTER_CAMERA:i}=S,o=l.ref([]),c=l.computed(()=>o.value.find(({userData:s})=>s[n])),r=(s,f=!0)=>{o.value.some(({uuid:g})=>g===s.uuid)||(o.value.push(s),f&&d(s))},m=s=>{if(s.userData[n]){const f=o.value[o.value.length-1];f&&d(f.uuid)}o.value=o.value.filter(({uuid:f})=>f!==s.uuid)},d=s=>{const f=s instanceof w.Camera?s:o.value.find(g=>g.uuid===s);f&&(o.value.forEach(({userData:g})=>g[n]=!1),f.userData[n]=!0)},p=()=>{o.value=[]};return l.watchEffect(()=>{e.aspectRatio.value&&o.value.forEach(s=>{s instanceof w.PerspectiveCamera&&(s.aspect=e.aspectRatio.value),(s instanceof w.PerspectiveCamera||s instanceof w.OrthographicCamera)&&s.updateProjectionMatrix()})}),a.userData[t]=r,a.userData[i]=m,l.onUnmounted(()=>{p()}),{camera:c,cameras:o,addCamera:r,removeCamera:m,setCameraActive:d}}const U=v.createEventHook(),q=v.createEventHook(),G=v.createEventHook(),b=new w.Clock;let k=0,V=0;const{pause:re,resume:se,isActive:ie}=v.useRafFn(()=>{U.trigger({delta:k,elapsed:V,clock:b}),q.trigger({delta:k,elapsed:V,clock:b}),G.trigger({delta:k,elapsed:V,clock:b})},{immediate:!1});G.on(()=>{k=b.getDelta(),V=b.getElapsedTime()});const N=()=>({onBeforeLoop:U.on,onLoop:q.on,onAfterLoop:G.on,pause:re,resume:se,isActive:ie}),z={realistic:{outputColorSpace:w.SRGBColorSpace,toneMapping:w.ACESFilmicToneMapping,toneMappingExposure:3,shadowMap:{enabled:!0,type:w.PCFSoftShadowMap}}},Y=(e,a)=>{for(const n of Object.keys(a))a[n]instanceof Object&&Object.assign(a[n],Y(e[n],a[n]));return Object.assign(e||{},a),e},ue=le("html,body,base,head,link,meta,style,title,address,article,aside,footer,header,hgroup,h1,h2,h3,h4,h5,h6,nav,section,div,dd,dl,dt,figcaption,figure,picture,hr,img,li,main,ol,p,pre,ul,a,b,abbr,bdi,bdo,br,cite,code,data,dfn,em,i,kbd,mark,q,rp,rt,ruby,s,samp,small,span,strong,sub,sup,time,u,var,wbr,area,audio,map,track,video,embed,object,param,source,canvas,script,noscript,del,ins,caption,col,colgroup,table,thead,tbody,td,th,tr,button,datalist,fieldset,form,input,label,legend,meter,optgroup,option,output,progress,select,textarea,details,dialog,menu,summary,template,blockquote,iframe,tfoot");function x(e){return e.replace(/-([a-z])/g,(a,n)=>n.toUpperCase())}function le(e,a){const n=Object.create(null),t=e.split(",");for(let i=0;i<t.length;i++)n[t[i]]=!0;return a?i=>!!n[i.toLowerCase()]:i=>!!n[i]}const ce=(e,a)=>{const n=new Set,t=[];for(const i of e){const o=a(i);n.has(o)||(n.add(o),t.push(i))}return t},fe=!0,J="[TresJS ▲ ■ ●] ";function h(){function e(t,i){console.error(`${J} ${t}`,i||"")}function a(t){console.warn(`${J} ${t}`)}function n(t,i){}return{logError:e,logWarning:a,logMessage:n}}function pe(e){return typeof e=="number"?[e,e,e]:e instanceof w.Vector3?[e.x,e.y,e.z]:e}function K(e){return e instanceof w.Color?e:Array.isArray(e)?new w.Color(...e):new w.Color(e)}function X({scene:e,canvas:a,options:n,disableRender:t,contextParts:{sizes:i,camera:o}}){const c=l.computed(()=>({alpha:v.toValue(n.alpha),depth:v.toValue(n.depth),canvas:v.unrefElement(a),context:v.toValue(n.context),stencil:v.toValue(n.stencil),antialias:v.toValue(n.antialias),precision:v.toValue(n.precision),powerPreference:v.toValue(n.powerPreference),premultipliedAlpha:v.toValue(n.premultipliedAlpha),preserveDrawingBuffer:v.toValue(n.preserveDrawingBuffer),logarithmicDepthBuffer:v.toValue(n.logarithmicDepthBuffer),failIfMajorPerformanceCaveat:v.toValue(n.failIfMajorPerformanceCaveat)})),r=l.shallowRef(new w.WebGLRenderer(c.value));l.watch(c,()=>{r.value.dispose(),r.value=new w.WebGLRenderer(c.value)}),l.watchEffect(()=>{r.value.setSize(i.width.value,i.height.value)});const{pixelRatio:m}=v.useDevicePixelRatio();l.watchEffect(()=>{r.value.setPixelRatio(m.value)});const{logError:d}=h(),s=(()=>{const u=new w.WebGLRenderer,_={shadowMap:{enabled:u.shadowMap.enabled,type:u.shadowMap.type},toneMapping:u.toneMapping,toneMappingExposure:u.toneMappingExposure,outputColorSpace:u.outputColorSpace,useLegacyLights:u.useLegacyLights};return u.dispose(),_})();l.watchEffect(()=>{const u=v.toValue(n.preset);if(u){u in z||d("Renderer Preset must be one of these: "+Object.keys(z).join(", ")),Y(r.value,z[u]);return}const _=v.toValue(n.shadows);r.value.shadowMap.enabled=_!==void 0?_:s.shadowMap.enabled;const E=v.toValue(n.shadowMapType);r.value.shadowMap.type=E!==void 0?E:s.shadowMap.type;const T=v.toValue(n.toneMapping);r.value.toneMapping=T!==void 0?T:s.toneMapping;const R=v.toValue(n.toneMappingExposure);r.value.toneMappingExposure=R!==void 0?R:s.toneMappingExposure;const L=v.toValue(n.outputColorSpace);r.value.outputColorSpace=L!==void 0?L:s.outputColorSpace;const D=v.toValue(n.useLegacyLights);r.value.useLegacyLights=D!==void 0?D:s.useLegacyLights;const O=v.toValue(n.clearColor);O&&r.value.setClearColor(O?K(O):new w.Color(0))});const{pause:f,resume:g,onLoop:M}=N();return M(()=>{o.value&&!v.toValue(t)&&r.value.render(e,o.value)}),g(),l.onUnmounted(()=>{f(),r.value.dispose(),r.value.forceContextLoss()}),{renderer:r}}function Q(e){const a={nodes:{},materials:{}};return e&&e.traverse(n=>{n.name&&(a.nodes[n.name]=n),n.material&&!a.materials[n.material.name]&&(a.materials[n.material.name]=n.material)}),a}async function me(e,a,n,t,i){const{logError:o}=h(),c=new e;i&&i(c),n&&n(c);const m=(Array.isArray(a)?a:[a]).map(d=>new Promise((p,s)=>{c.load(d,f=>{f.scene&&Object.assign(f,Q(f.scene)),p(f)},t,f=>s(o("[useLoader] - Failed to load resource",f)))}));return W(a)?await Promise.all(m):await m[0]}async function de(e){const a=new w.LoadingManager,n=new w.TextureLoader(a),t=i=>new Promise((o,c)=>{n.load(i,r=>o(r),()=>null,()=>{c(new Error("[useTextures] - Failed to load texture"))})});if(W(e)){const i=await Promise.all(e.map(o=>t(o)));return e.length>1?i:i[0]}else{const{map:i,displacementMap:o,normalMap:c,roughnessMap:r,metalnessMap:m,aoMap:d,alphaMap:p,matcap:s}=e;return{map:i?await t(i):null,displacementMap:o?await t(o):null,normalMap:c?await t(c):null,roughnessMap:r?await t(r):null,metalnessMap:m?await t(m):null,aoMap:d?await t(d):null,alphaMap:p?await t(p):null,matcap:s?await t(s):null}}}const Z=(e,{renderer:a,camera:n})=>{const t=l.computed(()=>a.value.domElement),{x:i,y:o}=v.usePointer({target:t}),{width:c,height:r,top:m,left:d}=v.useElementBounding(t),p=new w.Raycaster,s=({x:y,y:P})=>{if(t.value)return{x:(y-d.value)/c.value*2-1,y:-((P-m.value)/r.value)*2+1}},f=({x:y,y:P})=>{if(n.value)return p.setFromCamera(new w.Vector2(y,P),n.value),p.intersectObjects(e.value,!1)},g=y=>{const P=s({x:(y==null?void 0:y.clientX)??i.value,y:(y==null?void 0:y.clientY)??o.value});return P?f(P)||[]:[]},M=l.computed(()=>g()),u=v.createEventHook(),_=v.createEventHook(),E=(y,P)=>{y.trigger({event:P,intersects:g(P)})},T=y=>{E(_,y)};let R;const L=y=>{var P;R=(P=g(y)[0])==null?void 0:P.object},D=y=>{var P;y instanceof PointerEvent&&R===((P=g(y)[0])==null?void 0:P.object)&&E(u,y)},O=y=>_.trigger({event:y,intersects:[]});return t.value.addEventListener("pointerup",D),t.value.addEventListener("pointerdown",L),t.value.addEventListener("pointermove",T),t.value.addEventListener("pointerleave",O),l.onUnmounted(()=>{t!=null&&t.value&&(t.value.removeEventListener("pointerup",D),t.value.removeEventListener("pointerdown",L),t.value.removeEventListener("pointermove",T),t.value.removeEventListener("pointerleave",O))}),{intersects:M,onClick:y=>u.on(y).off,onPointerMove:y=>_.on(y).off}};function ve(){const{logWarning:e}=h();function a(t,i,o){let c=null;return t.traverse(r=>{r[i]===o&&(c=r)}),c||e(`Child with ${i} '${o}' not found.`),c}function n(t,i){return a(t,"name",i)}return{seek:a,seekByName:n}}const H=(e,a)=>{const n=l.reactive({click:new Map,pointerMove:new Map,pointerEnter:new Map,pointerLeave:new Map}),t=s=>{Object.values(n).forEach(f=>f.delete(s))},i=s=>{const{onClick:f,onPointerMove:g,onPointerEnter:M,onPointerLeave:u}=s;f&&n.click.set(s,f),g&&n.pointerMove.set(s,g),M&&n.pointerEnter.set(s,M),u&&n.pointerLeave.set(s,u)},{REGISTER_AT_POINTER_EVENT_HANDLER:o,DEREGISTER_AT_POINTER_EVENT_HANDLER:c}=S;e.userData[o]=i,e.userData[c]=t;const r=l.computed(()=>ce(Object.values(n).map(s=>Array.from(s.keys())).flat(),({uuid:s})=>s)),{onClick:m,onPointerMove:d}=Z(r,a);m(({intersects:s,event:f})=>{var g;s.length&&((g=n.click.get(s[0].object))==null||g(s[0],f))});let p;return d(({intersects:s,event:f})=>{var E,T,R,L;const g=(E=s==null?void 0:s[0])==null?void 0:E.object,{pointerLeave:M,pointerEnter:u,pointerMove:_}=n;p&&p!==g&&((T=M.get(p))==null||T(p,f)),g&&(p!==g&&((R=u.get(g))==null||R(s[0],f)),(L=_.get(g))==null||L(s[0],f)),p=g||null}),{registerObject:i,deregisterObject:t}};function ee({scene:e,canvas:a,windowSize:n,disableRender:t,rendererOptions:i}){const o=l.computed(()=>v.toValue(n)?v.useWindowSize():v.useElementSize(v.toValue(a).parentElement)),c=l.computed(()=>o.value.width.value),r=l.computed(()=>o.value.height.value),m=l.computed(()=>c.value/r.value),d={height:r,width:c,aspectRatio:m},p=l.shallowRef(e),{camera:s,cameras:f,addCamera:g,removeCamera:M,setCameraActive:u}=$({sizes:d,scene:e}),{renderer:_}=X({scene:e,canvas:a,options:i,contextParts:{sizes:d,camera:s},disableRender:t}),E={sizes:d,scene:l.readonly(p),camera:s,cameras:l.readonly(f),renderer:l.readonly(_),addCamera:g,removeCamera:M,setCameraActive:u};return l.provide("useTres",E),E}function ge(){const e=l.inject("useTres");if(!e)throw new Error("useTresContext must be used together with useTresContextProvider");return e}function Te(e){}let j=null,A=null;const{logError:te}=h(),Ce={createElement(e,a,n,t){var m,d;if(t||(t={}),t.args||(t.args=[]),e==="template"||ue(e))return null;let i=e.replace("Tres",""),o;if(e==="primitive"){(t==null?void 0:t.object)===void 0&&te("Tres primitives need a prop 'object'");const p=t.object;i=p.type,o=Object.assign(p,{type:i,attach:t.attach,primitive:!0})}else{const p=I.value[i];p||te(`${i} is not defined on the THREE namespace. Use extend to add it to the catalog.`),o=new p(...t.args)}o.isCamera&&(t!=null&&t.position||o.position.set(3,3,3),t!=null&&t.lookAt||o.lookAt(0,0,0)),(t==null?void 0:t.attach)===void 0&&(o.isMaterial?o.attach="material":o.isBufferGeometry&&(o.attach="geometry"));const{GEOMETRY_VIA_PROP:c,MATERIAL_VIA_PROP:r}=S;return o.isObject3D&&((m=t==null?void 0:t.material)!=null&&m.isMaterial&&(o.userData[r]=!0),(d=t==null?void 0:t.geometry)!=null&&d.isBufferGeometry&&(o.userData[c]=!0)),o},insert(e,a){var n,t,i,o,c,r,m,d,p;if(a&&a.isScene&&(A=a),(((n=e==null?void 0:e.__vnode)==null?void 0:n.type)==="TresGroup"||((t=e==null?void 0:e.__vnode)==null?void 0:t.type)==="TresObject3D")&&a===null&&!((o=(i=e==null?void 0:e.__vnode)==null?void 0:i.ctx)!=null&&o.asyncResolved)){j=e;return}else(c=e==null?void 0:e.__vnode)!=null&&c.type.includes("Controls")&&a===null&&(j=A);a||(a=j),e!=null&&e.isObject3D&&(e!=null&&e.isCamera&&((m=(r=A==null?void 0:A.userData)==null?void 0:r[S.REGISTER_CAMERA])==null||m.call(r,e)),(e!=null&&e.onClick||e!=null&&e.onPointerMove||e!=null&&e.onPointerEnter||e!=null&&e.onPointerLeave)&&((p=(d=A==null?void 0:A.userData)==null?void 0:d[S.REGISTER_AT_POINTER_EVENT_HANDLER])==null||p.call(d,e))),e!=null&&e.isObject3D&&(a!=null&&a.isObject3D)?(a.add(e),e.dispatchEvent({type:"added"})):e!=null&&e.isFog?a.fog=e:typeof(e==null?void 0:e.attach)=="string"&&(e.__previousAttach=e[a==null?void 0:a.attach],a&&(a[e.attach]=e))},remove(e){var a,n,t,i;if(e){if(e.isObject3D){const o=e,{DEREGISTER_CAMERA:c,GEOMETRY_VIA_PROP:r,MATERIAL_VIA_PROP:m,DEREGISTER_AT_POINTER_EVENT_HANDLER:d}=S,p=u=>{var _,E;u.userData[m]||(_=u.material)==null||_.dispose(),u.userData[r]||(E=u.geometry)==null||E.dispose()},s=(a=A==null?void 0:A.userData)==null?void 0:a[d],f=u=>{(u!=null&&u.onClick||u!=null&&u.onPointerMove||u!=null&&u.onPointerEnter||u!=null&&u.onPointerLeave)&&(s==null||s(u))},g=(n=A==null?void 0:A.userData)==null?void 0:n[c],M=u=>{u.isCamera&&g(u)};o.traverse(u=>{p(u),M(u),f==null||f(u)}),p(o),M(o),f==null||f(o)}(t=e.removeFromParent)==null||t.call(e),(i=e.dispose)==null||i.call(e)}},patchProp(e,a,n,t){if(e){let i=e,o=a,c=x(o),r=i==null?void 0:i[c];if(i.type==="BufferGeometry"){if(o==="args")return;i.setAttribute(x(o),new w.BufferAttribute(...t));return}if(o.includes("-")&&r===void 0){const d=o.split("-");r=d.reduce((p,s)=>p[x(s)],i),o=d.pop(),c=o.toLowerCase(),r!=null&&r.set||(i=d.reduce((p,s)=>p[x(s)],i))}let m=t;if(m===""&&(m=!0),F(r)){Array.isArray(m)?e[c](...m):e[c](m);return}!(r!=null&&r.set)&&!F(r)?i[c]=m:r.constructor===m.constructor&&(r!=null&&r.copy)?r==null||r.copy(m):Array.isArray(m)?r.set(...m):!r.isColor&&r.setScalar?r.setScalar(m):r.set(m)}},parentNode(e){return(e==null?void 0:e.parent)||null},createText:()=>void 0,createComment:()=>void 0,setText:()=>void 0,setElementText:()=>void 0,nextSibling:()=>void 0,querySelector:()=>void 0,setScopeId:()=>void 0,cloneNode:()=>void 0,insertStaticContent:()=>void 0},{createApp:ye}=l.createRenderer(Ce),we=e=>{const a=ye(n);function n(){return e&&e.default?e.default():[]}return a};B(oe);const _e=["data-scene"],ne=l.defineComponent({__name:"TresCanvas",props:{shadows:{type:Boolean},clearColor:{},toneMapping:{},shadowMapType:{},useLegacyLights:{type:Boolean},outputColorSpace:{},toneMappingExposure:{},windowSize:{type:Boolean},preset:{},disableRender:{type:Boolean},camera:{},context:{},precision:{},alpha:{type:Boolean},premultipliedAlpha:{type:Boolean},antialias:{type:Boolean},stencil:{type:Boolean},preserveDrawingBuffer:{type:Boolean},powerPreference:{},depth:{type:Boolean},logarithmicDepthBuffer:{type:Boolean},failIfMajorPerformanceCaveat:{type:Boolean}},setup(e){const a=e,{logWarning:n}=h(),t=l.ref(),i=l.shallowRef(new w.Scene);N();const o=l.useSlots();let c;const r=d=>{c=we(o),c.provide("useTres",d),c.provide("extend",B),c.mount(i.value)},m=l.computed(()=>a.disableRender);return l.onMounted(()=>{const d=t,p=ee({scene:i.value,canvas:d,windowSize:a.windowSize,disableRender:m,rendererOptions:{...a,antialias:a.antialias===void 0?!0:a.antialias}});H(i.value,p);const{addCamera:s,camera:f,cameras:g,removeCamera:M}=p;r(p);const u=()=>{const _=new w.PerspectiveCamera(45,window.innerWidth/window.innerHeight,.1,1e3);_.position.set(3,3,3),_.lookAt(0,0,0),s(_);const E=l.watchEffect(()=>{g.value.length>=2&&(_.removeFromParent(),M(_),E==null||E())})};l.watch(()=>a.camera,(_,E)=>{_?s(_):E&&(E.removeFromParent(),M(E))},{immediate:!0}),f.value||(n("No camera found. Creating a default perspective camera. To have full control over a camera, please add one to the scene."),u())}),(d,p)=>(l.openBlock(),l.createElementBlock("canvas",{ref_key:"canvas",ref:t,"data-scene":i.value.uuid,style:l.normalizeStyle({display:"block",width:"100%",height:"100%",position:d.windowSize?"fixed":"relative",top:0,left:0,pointerEvents:"auto",touchAction:"none",zIndex:1})},null,12,_e))}}),Ee=["TresCanvas","TresLeches","TresScene"],Me={template:{compilerOptions:{isCustomElement:e=>e.startsWith("Tres")&&!Ee.includes(e)||e==="primitive"}}},Pe={install(e){e.component("TresCanvas",ne)}};C.TresCanvas=ne,C.catalogue=I,C.default=Pe,C.extend=B,C.isProd=fe,C.normalizeColor=K,C.normalizeVectorFlexibleParam=pe,C.templateCompilerOptions=Me,C.trasverseObjects=Q,C.useCamera=$,C.useLoader=me,C.useLogger=h,C.usePointerEventHandler=H,C.useRaycaster=Z,C.useRenderLoop=N,C.useRenderer=X,C.useSeek=ve,C.useTexture=de,C.useTresContext=ge,C.useTresContextProvider=ee,Object.defineProperties(C,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@tresjs/core",
3
3
  "description": "Declarative ThreeJS using Vue Components",
4
- "version": "2.4.0-next.3",
4
+ "version": "2.4.0-next.4",
5
5
  "type": "module",
6
6
  "packageManager": "pnpm@8.3.1",
7
7
  "author": "Alvaro Saburido <hola@alvarosaburido.dev> (https://github.com/alvarosabu/)",
@@ -1,98 +0,0 @@
1
- import { TresCamera } from 'src/types';
2
- import { PerspectiveCamera, OrthographicCamera } from 'three';
3
- import { Ref } from 'vue';
4
- export declare enum CameraType {
5
- Perspective = "Perspective",
6
- Orthographic = "Orthographic"
7
- }
8
- export type Camera = PerspectiveCamera | OrthographicCamera;
9
- export interface PerspectiveCameraOptions {
10
- /**
11
- * Camera frustum vertical field of view, from bottom to top of view, in degrees.
12
- *
13
- * @type {number}
14
- * @memberof PerspectiveCameraOptions
15
- */
16
- fov?: number;
17
- /**
18
- * Camera frustum near plane.
19
- *
20
- * @type {number}
21
- * @memberof PerspectiveCameraOptions
22
- */
23
- near?: number;
24
- /**
25
- * Camera frustum far plane.
26
- *
27
- * @type {number}
28
- * @memberof PerspectiveCameraOptions
29
- */
30
- far?: number;
31
- }
32
- export interface OrthographicCameraOptions {
33
- /**
34
- * Camera frustum left plane.
35
- *
36
- * @type {number}
37
- * @memberof OrthographicCameraOptions
38
- */
39
- left?: number;
40
- /**
41
- * Camera frustum right plane.
42
- *
43
- * @type {number}
44
- * @memberof OrthographicCameraOptions
45
- */
46
- right?: number;
47
- /**
48
- * Camera frustum top plane.
49
- *
50
- * @type {number}
51
- * @memberof OrthographicCameraOptions
52
- */
53
- top?: number;
54
- /**
55
- * Camera frustum bottom plane.
56
- *
57
- * @type {number}
58
- * @memberof OrthographicCameraOptions
59
- */
60
- bottom?: number;
61
- /**
62
- * Camera frustum near plane.
63
- *
64
- * @type {number}
65
- * @memberof OrthographicCameraOptions
66
- */
67
- near?: number;
68
- /**
69
- * Camera frustum far plane.
70
- *
71
- * @type {number}
72
- * @memberof OrthographicCameraOptions
73
- */
74
- far?: number;
75
- }
76
- interface UseCameraReturn {
77
- activeCamera: Ref<TresCamera | undefined>;
78
- createCamera: (cameraType?: CameraType, options?: PerspectiveCameraOptions | OrthographicCameraOptions) => Camera;
79
- updateCamera: () => void;
80
- pushCamera: (camera: TresCamera) => void;
81
- clearCameras: () => void;
82
- setFirstCamera: (camera: TresCamera) => void;
83
- }
84
- /**
85
- * Create and update cameras
86
- *
87
- * ```ts
88
- * import { useCamera } from '@tresjs/core'
89
- * const { createCamera, updateCamera } = useCamera()
90
- * const camera = createCamera(new PerspectiveCamera(45, 1, 0.1, 1000))
91
- * updateCamera()
92
- * ```
93
- *
94
- * @export
95
- * @return {*} {UseCameraReturn}
96
- */
97
- export declare function useCamera(): UseCameraReturn;
98
- export {};
@@ -1,142 +0,0 @@
1
- import { Clock, EventDispatcher, Raycaster, Scene, Vector2, WebGLRenderer } from 'three';
2
- import { ComputedRef, Ref } from 'vue';
3
- import { Camera } from '../useCamera/old';
4
- import type { usePointerEventHandler } from '../usePointerEventHandler';
5
- export interface TresState {
6
- /**
7
- * The active camera used for rendering the scene.
8
- *
9
- * @see https://threejs.org/docs/index.html?q=camera#api/en/cameras/Camera
10
- *
11
- * @type {Camera}
12
- * @memberof TresState
13
- */
14
- camera?: Camera;
15
- /**
16
- * All cameras available in the scene.
17
- *
18
- * @see https://threejs.org/docs/index.html?q=camera#api/en/cameras/Camera
19
- *
20
- * @type {Camera[]}
21
- * @memberof TresState
22
- */
23
- cameras?: Camera[];
24
- /**
25
- * The aspect ratio of the scene.
26
- *
27
- * @type {ComputedRef<number>}
28
- * @memberof TresState
29
- */
30
- aspectRatio?: ComputedRef<number>;
31
- /**
32
- * The WebGLRenderer used to display the scene using WebGL.
33
- *
34
- * @see https://threejs.org/docs/index.html?q=webglren#api/en/renderers/WebGLRenderer
35
- *
36
- * @type {WebGLRenderer}
37
- * @memberof TresState
38
- */
39
- renderer?: WebGLRenderer;
40
- /**
41
- * The scene. This is the place where you place objects, lights and cameras.
42
- *
43
- * @see https://threejs.org/docs/index.html?q=scene#api/en/scenes/Scene
44
- *
45
- * @type {Scene}
46
- * @memberof TresState
47
- */
48
- scene?: Scene;
49
- /**
50
- * The raycaster.
51
- *
52
- * @see https://threejs.org/docs/index.html?q=raycas#api/en/core/Raycaster
53
- *
54
- * @type {Raycaster}
55
- * @memberof TresState
56
- */
57
- raycaster?: Raycaster;
58
- /**
59
- * Object for keeping track of time. This uses `performance.now` if it is available,
60
- * otherwise it reverts to the less accurate `Date.now`.
61
- *
62
- * @see https://threejs.org/docs/index.html?q=clock#api/en/core/Clock
63
- *
64
- * @type {Clock}
65
- * @memberof TresState
66
- */
67
- clock?: Clock;
68
- /**
69
- * The current mouse position.
70
- *
71
- * @type {Vector2}
72
- * @memberof TresState
73
- */
74
- pointer?: Vector2;
75
- /**
76
- * The current instance of the component.
77
- *
78
- * @type {*}
79
- * @memberof TresState
80
- */
81
- currentInstance?: any;
82
- /**
83
- * The current active scene control
84
- *
85
- * @type {((EventDispatcher & { enabled: boolean }) | null)}
86
- * @memberof TresState
87
- */
88
- controls?: (EventDispatcher & {
89
- enabled: boolean;
90
- }) | null;
91
- canvas?: Ref<HTMLElement>;
92
- /**
93
- * The entity that handles pointer events
94
- * @type {ReturnType<typeof usePointerEventHandler>}
95
- * @memberof TresState
96
- */
97
- pointerEventHandler?: ReturnType<typeof usePointerEventHandler>;
98
- [key: string]: any;
99
- }
100
- export type UseTresReturn = {
101
- state: TresState;
102
- getState: (key: string) => void;
103
- setState: (key: string, value: any) => void;
104
- aspectRatio: ComputedRef<number>;
105
- };
106
- export declare const TRES_CONTEXT_KEY: unique symbol;
107
- /**
108
- * The Tres state.
109
- *
110
- * @see https://threejs.org/docs/index.html?q=scene#api/en/scenes/Scene
111
- *
112
- * @export
113
- * @return {*} {TresState, getState, setState}
114
- */
115
- export declare function useTresProvider(): {
116
- getState: (key: string) => any;
117
- setState: (key: string, value: any) => void;
118
- camera?: Ref<Camera | undefined> | undefined;
119
- cameras?: Ref<Camera[] | undefined> | undefined;
120
- aspectRatio?: Ref<ComputedRef<number> | undefined> | undefined;
121
- renderer?: Ref<WebGLRenderer | undefined> | undefined;
122
- scene?: Ref<Scene | undefined> | undefined;
123
- raycaster?: Ref<Raycaster | undefined> | undefined;
124
- clock?: Ref<Clock | undefined> | undefined;
125
- pointer?: Ref<Vector2 | undefined> | undefined;
126
- currentInstance?: Ref<any> | undefined;
127
- controls?: Ref<(EventDispatcher<import("three").Event> & {
128
- enabled: boolean;
129
- }) | null | undefined> | undefined;
130
- canvas?: Ref<Ref<HTMLElement> | undefined> | undefined;
131
- pointerEventHandler?: Ref<{
132
- registerObject: (object: import("three").Object3D<import("three").Event> & {
133
- onClick?: ((intersection: import("three").Intersection<import("three").Object3D<import("three").Event>>, event: PointerEvent) => void) | undefined;
134
- onPointerEnter?: ((intersection: import("three").Intersection<import("three").Object3D<import("three").Event>>, event: PointerEvent) => void) | undefined;
135
- onPointerMove?: ((intersection: import("three").Intersection<import("three").Object3D<import("three").Event>>, event: PointerEvent) => void) | undefined;
136
- onPointerLeave?: ((object: import("three").Object3D<import("three").Event>, event: PointerEvent) => void) | undefined;
137
- }) => void;
138
- deregisterObject: (object: import("three").Object3D<import("three").Event>) => void;
139
- } | undefined> | undefined;
140
- state: TresState;
141
- };
142
- export declare const useTres: () => UseTresReturn;
@@ -1,20 +0,0 @@
1
- import { Scene, WebGLRenderer } from 'three';
2
- import type { ComputedRef, Ref, ShallowRef } from 'vue';
3
- import { TresCamera } from '../types';
4
- export type TresState = {
5
- scene: Readonly<ShallowRef<Scene>>;
6
- cameras: Readonly<ShallowRef<TresCamera[]>>;
7
- camera: ComputedRef<TresCamera | undefined>;
8
- renderer?: Readonly<ShallowRef<WebGLRenderer | null>>;
9
- addCamera: (camera: TresCamera) => void;
10
- setCameraToActive: (cameraId: string) => void;
11
- clearCameras: () => void;
12
- setRenderer: (renderer: WebGLRenderer) => void;
13
- sizes: {
14
- height: Ref<number>;
15
- width: Ref<number>;
16
- aspectRatio: ComputedRef<number>;
17
- };
18
- };
19
- export declare function useTresContextProvider(scene: Scene, canvas: Ref<HTMLCanvasElement | undefined>, props: any): TresState;
20
- export declare function useTresContext(): TresState;