@ohos-ports/react-three-drei 10.7.7-beta.0

package/core/Sky.js

@@ -0,0 +1,39 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import * as React from 'react';
+import { Sky as Sky$1 } from 'three-stdlib';
+import { Vector3 } from 'three';
+
+function calcPosFromAngles(inclination, azimuth, vector = new Vector3()) {
+  const theta = Math.PI * (inclination - 0.5);
+  const phi = 2 * Math.PI * (azimuth - 0.5);
+  vector.x = Math.cos(phi);
+  vector.y = Math.sin(theta);
+  vector.z = Math.sin(phi);
+  return vector;
+}
+const Sky = /* @__PURE__ */React.forwardRef(({
+  inclination = 0.6,
+  azimuth = 0.1,
+  distance = 1000,
+  mieCoefficient = 0.005,
+  mieDirectionalG = 0.8,
+  rayleigh = 0.5,
+  turbidity = 10,
+  sunPosition = calcPosFromAngles(inclination, azimuth),
+  ...props
+}, ref) => {
+  const scale = React.useMemo(() => new Vector3().setScalar(distance), [distance]);
+  const [sky] = React.useState(() => new Sky$1());
+  return /*#__PURE__*/React.createElement("primitive", _extends({
+    object: sky,
+    ref: ref,
+    "material-uniforms-mieCoefficient-value": mieCoefficient,
+    "material-uniforms-mieDirectionalG-value": mieDirectionalG,
+    "material-uniforms-rayleigh-value": rayleigh,
+    "material-uniforms-sunPosition-value": sunPosition,
+    "material-uniforms-turbidity-value": turbidity,
+    scale: scale
+  }, props));
+});
+
+export { Sky, calcPosFromAngles };

package/core/Sparkles.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("react"),r=require("three"),i=require("@react-three/fiber"),o=require("../helpers/constants.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 t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var i=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,i.get?i:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var s=n(e),l=a(t),c=a(r);class u extends c.ShaderMaterial{constructor(){super({uniforms:{time:{value:0},pixelRatio:{value:1}},vertexShader:"\n        uniform float pixelRatio;\n        uniform float time;\n        attribute float size;  \n        attribute float speed;  \n        attribute float opacity;\n        attribute vec3 noise;\n        attribute vec3 color;\n        varying vec3 vColor;\n        varying float vOpacity;\n\n        void main() {\n          vec4 modelPosition = modelMatrix * vec4(position, 1.0);\n          modelPosition.y += sin(time * speed + modelPosition.x * noise.x * 100.0) * 0.2;\n          modelPosition.z += cos(time * speed + modelPosition.x * noise.y * 100.0) * 0.2;\n          modelPosition.x += cos(time * speed + modelPosition.x * noise.z * 100.0) * 0.2;\n          vec4 viewPosition = viewMatrix * modelPosition;\n          vec4 projectionPostion = projectionMatrix * viewPosition;\n          gl_Position = projectionPostion;\n          gl_PointSize = size * 25. * pixelRatio;\n          gl_PointSize *= (1.0 / - viewPosition.z);\n          vColor = color;\n          vOpacity = opacity;\n        }\n      ",fragmentShader:`\n        varying vec3 vColor;\n        varying float vOpacity;\n        void main() {\n          float distanceToCenter = distance(gl_PointCoord, vec2(0.5));\n          float strength = 0.05 / distanceToCenter - 0.1;\n          gl_FragColor = vec4(vColor, strength * vOpacity);\n          #include <tonemapping_fragment>\n          #include <${o.version>=154?"colorspace_fragment":"encodings_fragment"}>\n        }\n      `})}get time(){return this.uniforms.time.value}set time(e){this.uniforms.time.value=e}get pixelRatio(){return this.uniforms.pixelRatio.value}set pixelRatio(e){this.uniforms.pixelRatio.value=e}}const f=e=>e&&e.constructor===Float32Array,m=e=>e instanceof c.Vector2||e instanceof c.Vector3||e instanceof c.Vector4,p=e=>Array.isArray(e)?e:m(e)?e.toArray():[e,e,e];function d(e,t,r){return l.useMemo((()=>{if(void 0!==t){if(f(t))return t;if(t instanceof c.Color){const r=Array.from({length:3*e},(()=>{return[(e=t).r,e.g,e.b];var e})).flat();return Float32Array.from(r)}if(m(t)||Array.isArray(t)){const r=Array.from({length:3*e},(()=>p(t))).flat();return Float32Array.from(r)}return Float32Array.from({length:e},(()=>t))}return Float32Array.from({length:e},r)}),[t])}const v=l.forwardRef((({noise:e=1,count:t=100,speed:r=1,opacity:o=1,scale:n=1,size:a,color:m,children:v,...b},g)=>{l.useMemo((()=>i.extend({SparklesImplMaterial:u})),[]);const y=l.useRef(null),h=i.useThree((e=>e.viewport.dpr)),x=p(n),A=l.useMemo((()=>Float32Array.from(Array.from({length:t},(()=>x.map(c.MathUtils.randFloatSpread))).flat())),[t,...x]),P=d(t,a,Math.random),M=d(t,o),j=d(t,r),O=d(3*t,e),_=d(void 0===m?3*t:t,f(m)?m:new c.Color(m),(()=>1));return i.useFrame((e=>{y.current&&y.current.material&&(y.current.material.time=e.clock.elapsedTime)})),l.useImperativeHandle(g,(()=>y.current),[]),l.createElement("points",s.default({key:`particle-${t}-${JSON.stringify(n)}`},b,{ref:y}),l.createElement("bufferGeometry",null,l.createElement("bufferAttribute",{attach:"attributes-position",args:[A,3]}),l.createElement("bufferAttribute",{attach:"attributes-size",args:[P,1]}),l.createElement("bufferAttribute",{attach:"attributes-opacity",args:[M,1]}),l.createElement("bufferAttribute",{attach:"attributes-speed",args:[j,1]}),l.createElement("bufferAttribute",{attach:"attributes-color",args:[_,3]}),l.createElement("bufferAttribute",{attach:"attributes-noise",args:[O,3]})),v||l.createElement("sparklesImplMaterial",{transparent:!0,pixelRatio:h,depthWrite:!1}))}));exports.Sparkles=v;

package/core/Sparkles.d.ts

@@ -0,0 +1,26 @@
+import * as THREE from 'three';
+import { ThreeElement, ThreeElements } from '@react-three/fiber';
+import { ForwardRefComponent } from '../helpers/ts-utils';
+declare class SparklesImplMaterial extends THREE.ShaderMaterial {
+    constructor();
+    get time(): number;
+    set time(value: number);
+    get pixelRatio(): number;
+    set pixelRatio(value: number);
+}
+declare module '@react-three/fiber' {
+    interface ThreeElements {
+        sparklesImplMaterial: ThreeElement<typeof SparklesImplMaterial>;
+    }
+}
+export type SparklesProps = Omit<ThreeElements['points'], 'ref'> & {
+    count?: number;
+    speed?: number | Float32Array;
+    opacity?: number | Float32Array;
+    color?: THREE.ColorRepresentation | Float32Array;
+    size?: number | Float32Array;
+    scale?: number | [number, number, number] | THREE.Vector3;
+    noise?: number | [number, number, number] | THREE.Vector3 | Float32Array;
+};
+export declare const Sparkles: ForwardRefComponent<SparklesProps, THREE.Points>;
+export {};

package/core/Sparkles.js

@@ -0,0 +1,161 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import * as React from 'react';
+import * as THREE from 'three';
+import { extend, useThree, useFrame } from '@react-three/fiber';
+import { version } from '../helpers/constants.js';
+
+class SparklesImplMaterial extends THREE.ShaderMaterial {
+  constructor() {
+    super({
+      uniforms: {
+        time: {
+          value: 0
+        },
+        pixelRatio: {
+          value: 1
+        }
+      },
+      vertexShader: /* glsl */`
+        uniform float pixelRatio;
+        uniform float time;
+        attribute float size;  
+        attribute float speed;  
+        attribute float opacity;
+        attribute vec3 noise;
+        attribute vec3 color;
+        varying vec3 vColor;
+        varying float vOpacity;
+
+        void main() {
+          vec4 modelPosition = modelMatrix * vec4(position, 1.0);
+          modelPosition.y += sin(time * speed + modelPosition.x * noise.x * 100.0) * 0.2;
+          modelPosition.z += cos(time * speed + modelPosition.x * noise.y * 100.0) * 0.2;
+          modelPosition.x += cos(time * speed + modelPosition.x * noise.z * 100.0) * 0.2;
+          vec4 viewPosition = viewMatrix * modelPosition;
+          vec4 projectionPostion = projectionMatrix * viewPosition;
+          gl_Position = projectionPostion;
+          gl_PointSize = size * 25. * pixelRatio;
+          gl_PointSize *= (1.0 / - viewPosition.z);
+          vColor = color;
+          vOpacity = opacity;
+        }
+      `,
+      fragmentShader: /* glsl */`
+        varying vec3 vColor;
+        varying float vOpacity;
+        void main() {
+          float distanceToCenter = distance(gl_PointCoord, vec2(0.5));
+          float strength = 0.05 / distanceToCenter - 0.1;
+          gl_FragColor = vec4(vColor, strength * vOpacity);
+          #include <tonemapping_fragment>
+          #include <${version >= 154 ? 'colorspace_fragment' : 'encodings_fragment'}>
+        }
+      `
+    });
+  }
+  get time() {
+    return this.uniforms.time.value;
+  }
+  set time(value) {
+    this.uniforms.time.value = value;
+  }
+  get pixelRatio() {
+    return this.uniforms.pixelRatio.value;
+  }
+  set pixelRatio(value) {
+    this.uniforms.pixelRatio.value = value;
+  }
+}
+const isFloat32Array = def => def && def.constructor === Float32Array;
+const expandColor = v => [v.r, v.g, v.b];
+const isVector = v => v instanceof THREE.Vector2 || v instanceof THREE.Vector3 || v instanceof THREE.Vector4;
+const normalizeVector = v => {
+  if (Array.isArray(v)) return v;else if (isVector(v)) return v.toArray();
+  return [v, v, v];
+};
+function usePropAsIsOrAsAttribute(count, prop, setDefault) {
+  return React.useMemo(() => {
+    if (prop !== undefined) {
+      if (isFloat32Array(prop)) {
+        return prop;
+      } else {
+        if (prop instanceof THREE.Color) {
+          const a = Array.from({
+            length: count * 3
+          }, () => expandColor(prop)).flat();
+          return Float32Array.from(a);
+        } else if (isVector(prop) || Array.isArray(prop)) {
+          const a = Array.from({
+            length: count * 3
+          }, () => normalizeVector(prop)).flat();
+          return Float32Array.from(a);
+        }
+        return Float32Array.from({
+          length: count
+        }, () => prop);
+      }
+    }
+    return Float32Array.from({
+      length: count
+    }, setDefault);
+  }, [prop]);
+}
+const Sparkles = /* @__PURE__ */React.forwardRef(({
+  noise = 1,
+  count = 100,
+  speed = 1,
+  opacity = 1,
+  scale = 1,
+  size,
+  color,
+  children,
+  ...props
+}, forwardRef) => {
+  React.useMemo(() => extend({
+    SparklesImplMaterial
+  }), []);
+  const ref = React.useRef(null);
+  const dpr = useThree(state => state.viewport.dpr);
+  const _scale = normalizeVector(scale);
+  const positions = React.useMemo(() => Float32Array.from(Array.from({
+    length: count
+  }, () => _scale.map(THREE.MathUtils.randFloatSpread)).flat()), [count, ..._scale]);
+  const sizes = usePropAsIsOrAsAttribute(count, size, Math.random);
+  const opacities = usePropAsIsOrAsAttribute(count, opacity);
+  const speeds = usePropAsIsOrAsAttribute(count, speed);
+  const noises = usePropAsIsOrAsAttribute(count * 3, noise);
+  const colors = usePropAsIsOrAsAttribute(color === undefined ? count * 3 : count, !isFloat32Array(color) ? new THREE.Color(color) : color, () => 1);
+  useFrame(state => {
+    if (ref.current && ref.current.material) ref.current.material.time = state.clock.elapsedTime;
+  });
+  React.useImperativeHandle(forwardRef, () => ref.current, []);
+  return /*#__PURE__*/React.createElement("points", _extends({
+    key: `particle-${count}-${JSON.stringify(scale)}`
+  }, props, {
+    ref: ref
+  }), /*#__PURE__*/React.createElement("bufferGeometry", null, /*#__PURE__*/React.createElement("bufferAttribute", {
+    attach: "attributes-position",
+    args: [positions, 3]
+  }), /*#__PURE__*/React.createElement("bufferAttribute", {
+    attach: "attributes-size",
+    args: [sizes, 1]
+  }), /*#__PURE__*/React.createElement("bufferAttribute", {
+    attach: "attributes-opacity",
+    args: [opacities, 1]
+  }), /*#__PURE__*/React.createElement("bufferAttribute", {
+    attach: "attributes-speed",
+    args: [speeds, 1]
+  }), /*#__PURE__*/React.createElement("bufferAttribute", {
+    attach: "attributes-color",
+    args: [colors, 3]
+  }), /*#__PURE__*/React.createElement("bufferAttribute", {
+    attach: "attributes-noise",
+    args: [noises, 3]
+  })), children ? children : /*#__PURE__*/React.createElement("sparklesImplMaterial", {
+    transparent: true,
+    pixelRatio: dpr,
+    depthWrite: false
+  }));
+});
+
+export { Sparkles };

package/core/Splat.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),t=require("three"),n=require("react"),r=require("@react-three/fiber"),o=require("./shaderMaterial.cjs.js"),a=require("../helpers/constants.cjs.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function s(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var c=l(e),i=s(t),u=s(n);const d=o.shaderMaterial({alphaTest:0,viewport:new i.Vector2(1980,1080),focal:1e3,centerAndScaleTexture:null,covAndColorTexture:null},"\n    precision highp sampler2D;\n    precision highp usampler2D;\n    out vec4 vColor;\n    out vec3 vPosition;\n    uniform vec2 resolution;\n    uniform vec2 viewport;\n    uniform float focal;\n    attribute uint splatIndex;\n    uniform sampler2D centerAndScaleTexture;\n    uniform usampler2D covAndColorTexture;    \n\n    vec2 unpackInt16(in uint value) {\n      int v = int(value);\n      int v0 = v >> 16;\n      int v1 = (v & 0xFFFF);\n      if((v & 0x8000) != 0)\n        v1 |= 0xFFFF0000;\n      return vec2(float(v1), float(v0));\n    }\n\n    void main () {\n      ivec2 texSize = textureSize(centerAndScaleTexture, 0);\n      ivec2 texPos = ivec2(splatIndex%uint(texSize.x), splatIndex/uint(texSize.x));\n      vec4 centerAndScaleData = texelFetch(centerAndScaleTexture, texPos, 0);\n      vec4 center = vec4(centerAndScaleData.xyz, 1);\n      vec4 camspace = modelViewMatrix * center;\n      vec4 pos2d = projectionMatrix * camspace;\n\n      float bounds = 1.2 * pos2d.w;\n      if (pos2d.z < -pos2d.w || pos2d.x < -bounds || pos2d.x > bounds\n        || pos2d.y < -bounds || pos2d.y > bounds) {\n        gl_Position = vec4(0.0, 0.0, 2.0, 1.0);\n        return;\n      }\n\n      uvec4 covAndColorData = texelFetch(covAndColorTexture, texPos, 0);\n      vec2 cov3D_M11_M12 = unpackInt16(covAndColorData.x) * centerAndScaleData.w;\n      vec2 cov3D_M13_M22 = unpackInt16(covAndColorData.y) * centerAndScaleData.w;\n      vec2 cov3D_M23_M33 = unpackInt16(covAndColorData.z) * centerAndScaleData.w;\n      mat3 Vrk = mat3(\n        cov3D_M11_M12.x, cov3D_M11_M12.y, cov3D_M13_M22.x,\n        cov3D_M11_M12.y, cov3D_M13_M22.y, cov3D_M23_M33.x,\n        cov3D_M13_M22.x, cov3D_M23_M33.x, cov3D_M23_M33.y\n      );\n\n      mat3 J = mat3(\n        focal / camspace.z, 0., -(focal * camspace.x) / (camspace.z * camspace.z),\n        0., focal / camspace.z, -(focal * camspace.y) / (camspace.z * camspace.z),\n        0., 0., 0.\n      );\n\n      mat3 W = transpose(mat3(modelViewMatrix));\n      mat3 T = W * J;\n      mat3 cov = transpose(T) * Vrk * T;\n      vec2 vCenter = vec2(pos2d) / pos2d.w;\n      float diagonal1 = cov[0][0] + 0.3;\n      float offDiagonal = cov[0][1];\n      float diagonal2 = cov[1][1] + 0.3;\n      float mid = 0.5 * (diagonal1 + diagonal2);\n      float radius = length(vec2((diagonal1 - diagonal2) / 2.0, offDiagonal));\n      float lambda1 = mid + radius;\n      float lambda2 = max(mid - radius, 0.1);\n      vec2 diagonalVector = normalize(vec2(offDiagonal, lambda1 - diagonal1));\n      vec2 v1 = min(sqrt(2.0 * lambda1), 1024.0) * diagonalVector;\n      vec2 v2 = min(sqrt(2.0 * lambda2), 1024.0) * vec2(diagonalVector.y, -diagonalVector.x);\n      uint colorUint = covAndColorData.w;\n      vColor = vec4(\n        float(colorUint & uint(0xFF)) / 255.0,\n        float((colorUint >> uint(8)) & uint(0xFF)) / 255.0,\n        float((colorUint >> uint(16)) & uint(0xFF)) / 255.0,\n        float(colorUint >> uint(24)) / 255.0\n      );\n      vPosition = position;\n\n      gl_Position = vec4(\n        vCenter \n          + position.x * v2 / viewport * 2.0 \n          + position.y * v1 / viewport * 2.0, pos2d.z / pos2d.w, 1.0);\n    }\n    ",`\n    #include <alphatest_pars_fragment>\n    #include <alphahash_pars_fragment>\n    in vec4 vColor;\n    in vec3 vPosition;\n    void main () {\n      float A = -dot(vPosition.xy, vPosition.xy);\n      if (A < -4.0) discard;\n      float B = exp(A) * vColor.a;\n      vec4 diffuseColor = vec4(vColor.rgb, B);\n      #include <alphatest_fragment>\n      #include <alphahash_fragment>\n      gl_FragColor = diffuseColor;\n      #include <tonemapping_fragment>\n      #include <${a.version>=154?"colorspace_fragment":"encodings_fragment"}>\n    }\n  `);function f(e){let t=null,n=0;e.onmessage=r=>{if("push"==r.data.method){0===n&&(t=new Float32Array(r.data.length));const e=new Float32Array(r.data.matrices);t.set(e,n),n+=e.length}else if("sort"==r.data.method&&null!==t){const n=function(e,n=!1){const r=t.length/16;let o=-1/0,a=1/0;const l=new Float32Array(r),s=new Int32Array(l.buffer),c=new Int32Array(r);let i=0;for(let s=0;s<r;s++){const r=e[0]*t[16*s+12]+e[1]*t[16*s+13]+e[2]*t[16*s+14]+e[3];(n||r<0&&t[16*s+15]>-1e-4*r)&&(l[i]=r,c[i]=s,i++,r>o&&(o=r),r<a&&(a=r))}const u=65535/(o-a),d=new Uint32Array(65536);for(let e=0;e<i;e++)s[e]=(l[e]-a)*u|0,d[s[e]]++;const f=new Uint32Array(65536);for(let e=1;e<65536;e++)f[e]=f[e-1]+d[e-1];const x=new Uint32Array(i);for(let e=0;e<i;e++)x[f[s[e]]++]=c[e];return x}(new Float32Array(r.data.view),r.data.hashed);e.postMessage({indices:n,key:r.data.key},[n.buffer])}}}class x extends i.Loader{constructor(...e){super(...e),this.gl=null,this.chunkSize=25e3}load(e,t,n,r){const o={gl:this.gl,url:this.manager.resolveURL(e),worker:new Worker(URL.createObjectURL(new Blob(["(",f.toString(),")(self)"],{type:"application/javascript"}))),manager:this.manager,update:(e,t,n)=>function(e,t,n,r){if(e.updateMatrixWorld(),t.gl.getCurrentViewport(n.viewport),n.material.viewport.x=n.viewport.z,n.material.viewport.y=n.viewport.w,n.material.focal=n.viewport.w/2*Math.abs(e.projectionMatrix.elements[5]),n.ready){if(r&&n.sorted)return;n.ready=!1;const e=new Float32Array([n.modelViewMatrix.elements[2],-n.modelViewMatrix.elements[6],n.modelViewMatrix.elements[10],n.modelViewMatrix.elements[14]]);t.worker.postMessage({method:"sort",src:t.url,key:n.uuid,view:e.buffer,hashed:r},[e.buffer]),r&&t.loaded&&(n.sorted=!0)}}(t,o,e,n),connect:e=>function(e,t){e.loading||async function(e){e.loading=!0;let t=0,n=0;const r=[];let o=0;const a=0!==e.totalDownloadBytes;for(;;)try{const{value:l,done:s}=await e.stream.read();if(s)break;if(t+=l.length,null!=e.totalDownloadBytes){const n=t/e.totalDownloadBytes*100;if(e.onProgress&&n-o>1){const r=new ProgressEvent("progress",{lengthComputable:a,loaded:t,total:e.totalDownloadBytes});e.onProgress(r),o=n}}r.push(l);const c=t-n;if(null!=e.totalDownloadBytes&&c>e.rowLength*e.chunkSize){let t=Math.floor(c/e.rowLength);const o=new Uint8Array(c);let l=0;for(const e of r)o.set(e,l),l+=e.length;if(r.length=0,c>t*e.rowLength){const n=new Uint8Array(c-t*e.rowLength);n.set(o.subarray(c-n.length,c),0),r.push(n)}const s=new Uint8Array(t*e.rowLength);s.set(o.subarray(0,s.byteLength),0);const i=p(e,s.buffer,t);if(e.worker.postMessage({method:"push",src:e.url,length:16*e.numVertices,matrices:i.buffer},[i.buffer]),n+=t*e.rowLength,e.onProgress){const t=new ProgressEvent("progress",{lengthComputable:a,loaded:e.totalDownloadBytes,total:e.totalDownloadBytes});e.onProgress(t)}}}catch(e){console.error(e);break}if(t-n>0){let t=new Uint8Array(r.reduce(((e,t)=>e+t.length),0)),n=0;for(const e of r)t.set(e,n),n+=e.length;let o=Math.floor(t.byteLength/e.rowLength);const a=p(e,t.buffer,o);e.worker.postMessage({method:"push",src:e.url,length:16*o,matrices:a.buffer},[a.buffer])}e.loaded=!0,e.manager.itemEnd(e.url)}(e);t.ready=!1,t.pm=new i.Matrix4,t.vm1=new i.Matrix4,t.vm2=new i.Matrix4,t.viewport=new i.Vector4;let n=new Uint32Array(e.bufferTextureWidth*e.bufferTextureHeight);const r=new i.InstancedBufferAttribute(n,1,!1);r.setUsage(i.DynamicDrawUsage);const o=t.geometry=new i.InstancedBufferGeometry,a=new Float32Array(18),l=new i.BufferAttribute(a,3);function s(e){if(t&&e.data.key===t.uuid){let n=new Uint32Array(e.data.indices);o.attributes.splatIndex.set(n),o.attributes.splatIndex.needsUpdate=!0,o.instanceCount=n.length,t.ready=!0}}async function c(){for(;;){const t=e.gl.properties.get(e.centerAndScaleTexture),n=e.gl.properties.get(e.covAndColorTexture);if(null!=t&&t.__webglTexture&&null!=n&&n.__webglTexture&&e.loadedVertexCount>0)break;await new Promise((e=>setTimeout(e,10)))}t.ready=!0}return o.setAttribute("position",l),l.setXYZ(2,-2,2,0),l.setXYZ(1,2,2,0),l.setXYZ(0,-2,-2,0),l.setXYZ(5,-2,-2,0),l.setXYZ(4,2,2,0),l.setXYZ(3,2,-2,0),l.needsUpdate=!0,o.setAttribute("splatIndex",r),o.instanceCount=1,e.worker.addEventListener("message",s),c(),()=>e.worker.removeEventListener("message",s)}(o,e),loading:!1,loaded:!1,loadedVertexCount:0,chunkSize:this.chunkSize,totalDownloadBytes:0,numVertices:0,rowLength:32,maxVertexes:0,bufferTextureWidth:0,bufferTextureHeight:0,stream:null,centerAndScaleData:null,covAndColorData:null,covAndColorTexture:null,centerAndScaleTexture:null,onProgress:n};(async function(e){e.manager.itemStart(e.url);const t=await fetch(e.url);if(null===t.body)throw"Failed to fetch file";let n=t.headers.get("Content-Length");const r=n?parseInt(n):void 0;if(null==r)throw"Failed to get content length";e.stream=t.body.getReader(),e.totalDownloadBytes=r,e.numVertices=Math.floor(e.totalDownloadBytes/e.rowLength);const o=e.gl.getContext();let a=o.getParameter(o.MAX_TEXTURE_SIZE);e.maxVertexes=a*a,e.numVertices>e.maxVertexes&&(e.numVertices=e.maxVertexes);return e.bufferTextureWidth=a,e.bufferTextureHeight=Math.floor((e.numVertices-1)/a)+1,e.centerAndScaleData=new Float32Array(e.bufferTextureWidth*e.bufferTextureHeight*4),e.covAndColorData=new Uint32Array(e.bufferTextureWidth*e.bufferTextureHeight*4),e.centerAndScaleTexture=new i.DataTexture(e.centerAndScaleData,e.bufferTextureWidth,e.bufferTextureHeight,i.RGBAFormat,i.FloatType),e.centerAndScaleTexture.needsUpdate=!0,e.covAndColorTexture=new i.DataTexture(e.covAndColorData,e.bufferTextureWidth,e.bufferTextureHeight,i.RGBAIntegerFormat,i.UnsignedIntType),e.covAndColorTexture.internalFormat="RGBA32UI",e.covAndColorTexture.needsUpdate=!0,e})(o).then(t).catch((e=>{null==r||r(e),o.manager.itemError(o.url)}))}}function p(e,t,n){const r=e.gl.getContext();if(e.loadedVertexCount+n>e.maxVertexes&&(n=e.maxVertexes-e.loadedVertexCount),n<=0)throw"Failed to parse file";const o=new Uint8Array(t),a=new Float32Array(t),l=new Float32Array(16*n),s=new Uint8Array(e.covAndColorData.buffer),c=new Int16Array(e.covAndColorData.buffer);for(let t=0;t<n;t++){const n=new i.Quaternion(-(o[32*t+28+1]-128)/128,(o[32*t+28+2]-128)/128,(o[32*t+28+3]-128)/128,-(o[32*t+28+0]-128)/128);n.invert();const r=new i.Vector3(a[8*t+0],a[8*t+1],-a[8*t+2]),u=new i.Vector3(a[8*t+3+0],a[8*t+3+1],a[8*t+3+2]),d=new i.Matrix4;d.makeRotationFromQuaternion(n),d.transpose(),d.scale(u);const f=d.clone();d.transpose(),d.premultiply(f),d.setPosition(r);const x=[0,1,2,5,6,10];let p=0;for(let e=0;e<x.length;e++)Math.abs(d.elements[x[e]])>p&&(p=Math.abs(d.elements[x[e]]));let g=4*e.loadedVertexCount+4*t;e.centerAndScaleData[g+0]=r.x,e.centerAndScaleData[g+1]=-r.y,e.centerAndScaleData[g+2]=r.z,e.centerAndScaleData[g+3]=p/32767,g=8*e.loadedVertexCount+4*t*2;for(let e=0;e<x.length;e++)c[g+e]=32767*d.elements[x[e]]/p;g=16*e.loadedVertexCount+4*(4*t+3);const m=new i.Color(o[32*t+24+0]/255,o[32*t+24+1]/255,o[32*t+24+2]/255);m.convertSRGBToLinear(),s[g+0]=255*m.r,s[g+1]=255*m.g,s[g+2]=255*m.b,s[g+3]=o[32*t+24+3],d.elements[15]=Math.max(u.x,u.y,u.z)*o[32*t+24+3]/255;for(let e=0;e<16;e++)l[16*t+e]=d.elements[e]}for(;n>0;){let t=0,o=0;const a=e.loadedVertexCount%e.bufferTextureWidth,l=Math.floor(e.loadedVertexCount/e.bufferTextureWidth);e.loadedVertexCount%e.bufferTextureWidth!=0?(t=Math.min(e.bufferTextureWidth,a+n)-a,o=1):Math.floor(n/e.bufferTextureWidth)>0?(t=e.bufferTextureWidth,o=Math.floor(n/e.bufferTextureWidth)):(t=n%e.bufferTextureWidth,o=1);const s=e.gl.properties.get(e.centerAndScaleTexture);r.bindTexture(r.TEXTURE_2D,s.__webglTexture),r.texSubImage2D(r.TEXTURE_2D,0,a,l,t,o,r.RGBA,r.FLOAT,e.centerAndScaleData,4*e.loadedVertexCount);const c=e.gl.properties.get(e.covAndColorTexture);r.bindTexture(r.TEXTURE_2D,c.__webglTexture),r.texSubImage2D(r.TEXTURE_2D,0,a,l,t,o,r.RGBA_INTEGER,r.UNSIGNED_INT,e.covAndColorData,4*e.loadedVertexCount),e.gl.resetState(),e.loadedVertexCount+=t*o,n-=t*o}return l}exports.Splat=function({src:e,toneMapped:t=!1,alphaTest:n=0,alphaHash:o=!1,chunkSize:a=25e3,...l}){r.extend({SplatMaterial:d});const s=u.useRef(null),f=r.useThree((e=>e.gl)),p=r.useThree((e=>e.camera)),g=r.useLoader(x,e,(e=>{e.gl=f,e.chunkSize=a}));return u.useLayoutEffect((()=>g.connect(s.current)),[e]),r.useFrame((()=>g.update(s.current,p,o))),u.createElement("mesh",c.default({ref:s,frustumCulled:!1},l),u.createElement("splatMaterial",{key:`${e}/${n}/${o}${d.key}`,transparent:!o,depthTest:!0,alphaTest:o?0:n,centerAndScaleTexture:g.centerAndScaleTexture,covAndColorTexture:g.covAndColorTexture,depthWrite:!!o||n>0,blending:o?i.NormalBlending:i.CustomBlending,blendSrcAlpha:i.OneFactor,alphaHash:!!o,toneMapped:t}))};

package/core/Splat.d.ts

@@ -0,0 +1,56 @@
+import * as THREE from 'three';
+import * as React from 'react';
+import { ThreeElements } from '@react-three/fiber';
+export type SplatMaterialType = {
+    alphaTest?: number;
+    alphaHash?: boolean;
+    centerAndScaleTexture?: THREE.DataTexture;
+    covAndColorTexture?: THREE.DataTexture;
+    viewport?: THREE.Vector2;
+    focal?: number;
+};
+export type TargetMesh = THREE.Mesh<THREE.InstancedBufferGeometry, THREE.ShaderMaterial & SplatMaterialType> & {
+    ready: boolean;
+    sorted: boolean;
+    pm: THREE.Matrix4;
+    vm1: THREE.Matrix4;
+    vm2: THREE.Matrix4;
+    viewport: THREE.Vector4;
+};
+export type SharedState = {
+    url: string;
+    gl: THREE.WebGLRenderer;
+    worker: Worker;
+    manager: THREE.LoadingManager;
+    stream: ReadableStreamDefaultReader<Uint8Array>;
+    loading: boolean;
+    loaded: boolean;
+    loadedVertexCount: number;
+    rowLength: number;
+    maxVertexes: number;
+    chunkSize: number;
+    totalDownloadBytes: number;
+    numVertices: number;
+    bufferTextureWidth: number;
+    bufferTextureHeight: number;
+    centerAndScaleData: Float32Array;
+    covAndColorData: Uint32Array;
+    covAndColorTexture: THREE.DataTexture;
+    centerAndScaleTexture: THREE.DataTexture;
+    connect(target: TargetMesh): () => void;
+    update(target: TargetMesh, camera: THREE.Camera, hashed: boolean): void;
+    onProgress?: (event: ProgressEvent) => void;
+};
+declare module '@react-three/fiber' {
+    interface ThreeElements {
+        splatMaterial: SplatMaterialType & ThreeElements['shaderMaterial'];
+    }
+}
+export type SplatProps = {
+    src: string;
+    toneMapped?: boolean;
+    alphaTest?: number;
+    alphaHash?: boolean;
+    chunkSize?: number;
+} & Omit<ThreeElements['mesh'], 'ref'>;
+export declare function Splat({ src, toneMapped, alphaTest, alphaHash, chunkSize, ...props }: SplatProps): React.JSX.Element;