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

package/core/RoundedBox.js

@@ -0,0 +1,70 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import * as React from 'react';
+import { Shape } from 'three';
+import { toCreasedNormals } from 'three-stdlib';
+
+const eps = 0.00001;
+function createShape(width, height, radius0) {
+  const shape = new Shape();
+  const radius = radius0 - eps;
+  shape.absarc(eps, eps, eps, -Math.PI / 2, -Math.PI, true);
+  shape.absarc(eps, height - radius * 2, eps, Math.PI, Math.PI / 2, true);
+  shape.absarc(width - radius * 2, height - radius * 2, eps, Math.PI / 2, 0, true);
+  shape.absarc(width - radius * 2, eps, eps, 0, -Math.PI / 2, true);
+  return shape;
+}
+const RoundedBox = /* @__PURE__ */React.forwardRef(function RoundedBox({
+  args: [width = 1, height = 1, depth = 1] = [],
+  radius = 0.05,
+  steps = 1,
+  smoothness = 4,
+  bevelSegments = 4,
+  creaseAngle = 0.4,
+  children,
+  ...rest
+}, ref) {
+  return /*#__PURE__*/React.createElement("mesh", _extends({
+    ref: ref
+  }, rest), /*#__PURE__*/React.createElement(RoundedBoxGeometry, {
+    args: [width, height, depth],
+    radius: radius,
+    steps: steps,
+    smoothness: smoothness,
+    bevelSegments: bevelSegments,
+    creaseAngle: creaseAngle
+  }), children);
+});
+const RoundedBoxGeometry = /* @__PURE__ */React.forwardRef(function RoundedBoxGeometry({
+  args: [width = 1, height = 1, depth = 1] = [],
+  radius = 0.05,
+  steps = 1,
+  smoothness = 4,
+  bevelSegments = 4,
+  creaseAngle = 0.4,
+  ...rest
+}, ref) {
+  const shape = React.useMemo(() => createShape(width, height, radius), [width, height, radius]);
+  const params = React.useMemo(() => ({
+    depth: depth - radius * 2,
+    bevelEnabled: true,
+    bevelSegments: bevelSegments * 2,
+    steps,
+    bevelSize: radius - eps,
+    bevelThickness: radius,
+    curveSegments: smoothness
+  }), [depth, radius, smoothness, bevelSegments, steps]);
+  const geomRef = React.useRef(null);
+  React.useLayoutEffect(() => {
+    if (geomRef.current) {
+      geomRef.current.center();
+      toCreasedNormals(geomRef.current, creaseAngle);
+    }
+  }, [shape, params, creaseAngle]);
+  React.useImperativeHandle(ref, () => geomRef.current);
+  return /*#__PURE__*/React.createElement("extrudeGeometry", _extends({
+    ref: geomRef,
+    args: [shape, params]
+  }, rest));
+});
+
+export { RoundedBox, RoundedBoxGeometry };

package/core/Sampler.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("react"),t=require("three-stdlib"),n=require("three");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function c(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)}var o=u(e),a=c(r);function i(e,r=16,u,c,o){const[i,l]=a.useState((()=>{const e=Array.from({length:r},(()=>[1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1])).flat();return new n.InstancedBufferAttribute(Float32Array.from(e),16)}));return a.useLayoutEffect((()=>{if(void 0===e.current)return;const a=new t.MeshSurfaceSampler(e.current);c&&a.setWeightAttribute(c),a.build();const s=new n.Vector3,f=new n.Vector3,d=new n.Color,p=new n.Object3D;e.current.updateMatrixWorld(!0);for(let t=0;t<r;t++)a.sample(s,f,d),"function"==typeof u?u({dummy:p,sampledMesh:e.current,position:s,normal:f,color:d},t):p.position.copy(s),p.updateMatrix(),null!=o&&o.current&&o.current.setMatrixAt(t,p.matrix),p.matrix.toArray(i.array,16*t);null!=o&&o.current&&(o.current.instanceMatrix.needsUpdate=!0),i.needsUpdate=!0,l(new n.InstancedBufferAttribute(i.array,i.itemSize).copy(i))}),[e,o,c,r,u]),i}exports.Sampler=function({children:e,weight:r,transform:t,instances:n,mesh:u,count:c=16,...l}){const s=a.useRef(null),f=a.useRef(null),d=a.useRef(null);return a.useLayoutEffect((()=>{var e,r;f.current=null!==(e=null==n?void 0:n.current)&&void 0!==e?e:s.current.children.find((e=>e.hasOwnProperty("instanceMatrix"))),d.current=null!==(r=null==u?void 0:u.current)&&void 0!==r?r:s.current.children.find((e=>"Mesh"===e.type))}),[e,null==u?void 0:u.current,null==n?void 0:n.current]),i(d,c,t,r,f),a.createElement("group",o.default({ref:s},l),e)},exports.useSurfaceSampler=i;

package/core/Sampler.d.ts

@@ -0,0 +1,28 @@
+import * as React from 'react';
+import { Color, InstancedBufferAttribute, InstancedMesh, Mesh, Object3D, Vector3 } from 'three';
+import { ThreeElements } from '@react-three/fiber';
+type SamplePayload = {
+    position: Vector3;
+    normal: Vector3;
+    color: Color;
+};
+export type TransformFn = (payload: TransformPayload, i: number) => void;
+type TransformPayload = SamplePayload & {
+    dummy: Object3D;
+    sampledMesh: Mesh;
+};
+export type SamplerProps = Omit<ThreeElements['group'], 'ref'> & {
+    mesh?: React.RefObject<Mesh>;
+    instances?: React.RefObject<InstancedMesh>;
+    weight?: string;
+    transform?: TransformFn;
+    count?: number;
+};
+export interface useSurfaceSamplerProps {
+    transform?: TransformFn;
+    weight?: string;
+    count?: number;
+}
+export declare function useSurfaceSampler(mesh: React.RefObject<Mesh>, count?: number, transform?: TransformFn, weight?: string, instanceMesh?: React.RefObject<InstancedMesh> | null): InstancedBufferAttribute;
+export declare function Sampler({ children, weight, transform, instances, mesh, count, ...props }: SamplerProps): React.JSX.Element;
+export {};

package/core/Sampler.js

@@ -0,0 +1,75 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import * as React from 'react';
+import { MeshSurfaceSampler } from 'three-stdlib';
+import { InstancedBufferAttribute, Vector3, Color, Object3D } from 'three';
+
+function useSurfaceSampler(mesh, count = 16, transform, weight, instanceMesh) {
+  const [buffer, setBuffer] = React.useState(() => {
+    const arr = Array.from({
+      length: count
+    }, () => [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1]).flat();
+    return new InstancedBufferAttribute(Float32Array.from(arr), 16);
+  });
+  React.useLayoutEffect(() => {
+    if (typeof mesh.current === 'undefined') return;
+    const sampler = new MeshSurfaceSampler(mesh.current);
+    if (weight) {
+      sampler.setWeightAttribute(weight);
+    }
+    sampler.build();
+    const position = new Vector3();
+    const normal = new Vector3();
+    const color = new Color();
+    const dummy = new Object3D();
+    mesh.current.updateMatrixWorld(true);
+    for (let i = 0; i < count; i++) {
+      sampler.sample(position, normal, color);
+      if (typeof transform === 'function') {
+        transform({
+          dummy,
+          sampledMesh: mesh.current,
+          position,
+          normal,
+          color
+        }, i);
+      } else {
+        dummy.position.copy(position);
+      }
+      dummy.updateMatrix();
+      if (instanceMesh != null && instanceMesh.current) {
+        instanceMesh.current.setMatrixAt(i, dummy.matrix);
+      }
+      dummy.matrix.toArray(buffer.array, i * 16);
+    }
+    if (instanceMesh != null && instanceMesh.current) {
+      instanceMesh.current.instanceMatrix.needsUpdate = true;
+    }
+    buffer.needsUpdate = true;
+    setBuffer(new InstancedBufferAttribute(buffer.array, buffer.itemSize).copy(buffer));
+  }, [mesh, instanceMesh, weight, count, transform]);
+  return buffer;
+}
+function Sampler({
+  children,
+  weight,
+  transform,
+  instances,
+  mesh,
+  count = 16,
+  ...props
+}) {
+  const group = React.useRef(null);
+  const instancedRef = React.useRef(null);
+  const meshToSampleRef = React.useRef(null);
+  React.useLayoutEffect(() => {
+    var _instances$current, _mesh$current;
+    instancedRef.current = (_instances$current = instances == null ? void 0 : instances.current) !== null && _instances$current !== void 0 ? _instances$current : group.current.children.find(c => c.hasOwnProperty('instanceMatrix'));
+    meshToSampleRef.current = (_mesh$current = mesh == null ? void 0 : mesh.current) !== null && _mesh$current !== void 0 ? _mesh$current : group.current.children.find(c => c.type === 'Mesh');
+  }, [children, mesh == null ? void 0 : mesh.current, instances == null ? void 0 : instances.current]);
+  useSurfaceSampler(meshToSampleRef, count, transform, weight, instancedRef);
+  return /*#__PURE__*/React.createElement("group", _extends({
+    ref: group
+  }, props), children);
+}
+
+export { Sampler, useSurfaceSampler };

package/core/ScreenQuad.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("three"),t=require("react");function n(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 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)}var o=n(e),f=u(r),c=u(t);function i(){const e=new f.BufferGeometry,r=new Float32Array([-1,-1,3,-1,-1,3]);return e.boundingSphere=new f.Sphere,e.boundingSphere.set(new f.Vector3,1/0),e.setAttribute("position",new f.BufferAttribute(r,2)),e}const a=c.forwardRef((function({children:e,...r},t){const n=c.useMemo(i,[]);return c.createElement("mesh",o.default({ref:t,geometry:n,frustumCulled:!1},r),e)}));exports.ScreenQuad=a;

package/core/ScreenQuad.d.ts

@@ -0,0 +1,5 @@
+import * as THREE from 'three';
+import { ForwardRefComponent } from '../helpers/ts-utils';
+import { ThreeElements } from '@react-three/fiber';
+export type ScreenQuadProps = Omit<ThreeElements['mesh'], 'ref' | 'args'>;
+export declare const ScreenQuad: ForwardRefComponent<ScreenQuadProps, THREE.Mesh>;

package/core/ScreenQuad.js

@@ -0,0 +1,25 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import * as THREE from 'three';
+import * as React from 'react';
+
+function createScreenQuadGeometry() {
+  const geometry = new THREE.BufferGeometry();
+  const vertices = new Float32Array([-1, -1, 3, -1, -1, 3]);
+  geometry.boundingSphere = new THREE.Sphere();
+  geometry.boundingSphere.set(new THREE.Vector3(), Infinity);
+  geometry.setAttribute('position', new THREE.BufferAttribute(vertices, 2));
+  return geometry;
+}
+const ScreenQuad = /* @__PURE__ */React.forwardRef(function ScreenQuad({
+  children,
+  ...restProps
+}, ref) {
+  const geometry = React.useMemo(createScreenQuadGeometry, []);
+  return /*#__PURE__*/React.createElement("mesh", _extends({
+    ref: ref,
+    geometry: geometry,
+    frustumCulled: false
+  }, restProps), children);
+});
+
+export { ScreenQuad };

package/core/ScreenSizer.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("@react-three/fiber"),t=require("react"),c=require("three"),a=require("./calculateScaleFactor.cjs.js");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function n(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var c=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,c.get?c:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var l=u(e),o=n(t);const i=new c.Vector3,s=t.forwardRef((({scale:e=1,...c},u)=>{const n=t.useRef(null);return o.useImperativeHandle(u,(()=>n.current),[]),r.useFrame((r=>{const t=n.current;if(!t)return;const c=a.calculateScaleFactor(t.getWorldPosition(i),e,r.camera,r.size);t.scale.setScalar(c*e)})),o.createElement("object3D",l.default({ref:n},c))}));exports.ScreenSizer=s;

package/core/ScreenSizer.d.ts

@@ -0,0 +1,7 @@
+import { ThreeElements } from '@react-three/fiber';
+import { Object3D } from 'three';
+import { ForwardRefComponent } from '../helpers/ts-utils';
+export type ScreenSizerProps = Omit<ThreeElements['object3D'], 'ref'> & {
+    scale?: number;
+};
+export declare const ScreenSizer: ForwardRefComponent<ScreenSizerProps, Object3D>;

package/core/ScreenSizer.js

@@ -0,0 +1,39 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import { useFrame } from '@react-three/fiber';
+import * as React from 'react';
+import { forwardRef, useRef } from 'react';
+import { Vector3 } from 'three';
+import { calculateScaleFactor } from './calculateScaleFactor.js';
+
+const worldPos = /* @__PURE__ */new Vector3();
+/**
+ * Wraps children in an `Object3D` and attempts to scale from
+ * world units to screen units * scale factor.
+ *
+ * For example, this will render a box of roughly 1x1 pixel size,
+ * independently of how far the camera is.
+ *
+ * ```jsx
+ * <ScreenSizer>
+ *   <Box />
+ * </ScreenSizer>
+ * ```
+ */
+const ScreenSizer = /* @__PURE__ */forwardRef(({
+  scale = 1,
+  ...props
+}, ref) => {
+  const container = useRef(null);
+  React.useImperativeHandle(ref, () => container.current, []);
+  useFrame(state => {
+    const obj = container.current;
+    if (!obj) return;
+    const sf = calculateScaleFactor(obj.getWorldPosition(worldPos), scale, state.camera, state.size);
+    obj.scale.setScalar(sf * scale);
+  });
+  return /*#__PURE__*/React.createElement("object3D", _extends({
+    ref: container
+  }, props));
+});
+
+export { ScreenSizer };

package/core/ScreenSpace.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@babel/runtime/helpers/extends"),r=require("react"),t=require("@react-three/fiber");function n(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 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)}var c=n(e),o=u(r);const a=o.forwardRef((({children:e,depth:r=-1,...n},u)=>{const a=o.useRef(null);return o.useImperativeHandle(u,(()=>a.current),[]),t.useFrame((({camera:e})=>{a.current.quaternion.copy(e.quaternion),a.current.position.copy(e.position)})),o.createElement("group",c.default({ref:a},n),o.createElement("group",{"position-z":-r},e))}));exports.ScreenSpace=a;

package/core/ScreenSpace.d.ts

@@ -0,0 +1,7 @@
+import { Group } from 'three';
+import { ThreeElements } from '@react-three/fiber';
+import { ForwardRefComponent } from '../helpers/ts-utils';
+export type ScreenSpaceProps = Omit<ThreeElements['group'], 'ref'> & {
+    depth?: number;
+};
+export declare const ScreenSpace: ForwardRefComponent<ScreenSpaceProps, Group>;

package/core/ScreenSpace.js

@@ -0,0 +1,25 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import * as React from 'react';
+import { useFrame } from '@react-three/fiber';
+
+const ScreenSpace = /* @__PURE__ */React.forwardRef(({
+  children,
+  depth = -1,
+  ...rest
+}, ref) => {
+  const localRef = React.useRef(null);
+  React.useImperativeHandle(ref, () => localRef.current, []);
+  useFrame(({
+    camera
+  }) => {
+    localRef.current.quaternion.copy(camera.quaternion);
+    localRef.current.position.copy(camera.position);
+  });
+  return /*#__PURE__*/React.createElement("group", _extends({
+    ref: localRef
+  }, rest), /*#__PURE__*/React.createElement("group", {
+    "position-z": -depth
+  }, children));
+});
+
+export { ScreenSpace };

package/core/Segments.cjs.js

@@ -0,0 +1 @@
+"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("three-stdlib");function c(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(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 i=c(e),u=s(t),a=s(r);const l=a.createContext(null),f=a.forwardRef(((e,t)=>{a.useMemo((()=>n.extend({SegmentObject:m})),[]);const{limit:r=1e3,lineWidth:c=1,children:s,...f}=e,[d,b]=a.useState([]),[p]=a.useState((()=>new o.Line2)),[h]=a.useState((()=>new o.LineMaterial)),[g]=a.useState((()=>new o.LineSegmentsGeometry)),[v]=a.useState((()=>new u.Vector2(512,512))),[w]=a.useState((()=>Array(6*r).fill(0))),[S]=a.useState((()=>Array(6*r).fill(0))),j=a.useMemo((()=>({subscribe:e=>(b((t=>[...t,e])),()=>b((t=>t.filter((t=>t.current!==e.current)))))})),[]);return n.useFrame((()=>{for(let t=0;t<r;t++){var e;const r=null==(e=d[t])?void 0:e.current;r&&(w[6*t+0]=r.start.x,w[6*t+1]=r.start.y,w[6*t+2]=r.start.z,w[6*t+3]=r.end.x,w[6*t+4]=r.end.y,w[6*t+5]=r.end.z,S[6*t+0]=r.color.r,S[6*t+1]=r.color.g,S[6*t+2]=r.color.b,S[6*t+3]=r.color.r,S[6*t+4]=r.color.g,S[6*t+5]=r.color.b)}g.setColors(S),g.setPositions(w),p.computeLineDistances()})),a.createElement("primitive",{object:p,ref:t},a.createElement("primitive",{object:g,attach:"geometry"}),a.createElement("primitive",i.default({object:h,attach:"material",vertexColors:!0,resolution:v,linewidth:c},f)),a.createElement(l.Provider,{value:j},s))}));class m{constructor(){this.color=new u.Color("white"),this.start=new u.Vector3(0,0,0),this.end=new u.Vector3(0,0,0)}}const d=e=>e instanceof u.Vector3?e:new u.Vector3(..."number"==typeof e?[e,e,e]:e),b=a.forwardRef((({color:e,start:t,end:r},n)=>{const o=a.useContext(l);if(!o)throw"Segment must used inside Segments component.";const c=a.useRef(null);return a.useImperativeHandle(n,(()=>c.current),[]),a.useLayoutEffect((()=>o.subscribe(c)),[]),a.createElement("segmentObject",{ref:c,color:e,start:d(t),end:d(r)})}));exports.Segment=b,exports.SegmentObject=m,exports.Segments=f;

package/core/Segments.d.ts

@@ -0,0 +1,29 @@
+import * as THREE from 'three';
+import * as React from 'react';
+import { ReactThreeFiber, ThreeElements, ThreeElement } from '@react-three/fiber';
+import { Line2, LineMaterialParameters } from 'three-stdlib';
+import { ForwardRefComponent } from '../helpers/ts-utils';
+export type SegmentsProps = LineMaterialParameters & {
+    limit?: number;
+    lineWidth?: number;
+    children: React.ReactNode;
+};
+export type SegmentProps = Omit<ThreeElements['segmentObject'], 'ref' | 'start' | 'end' | 'color'> & {
+    start: ReactThreeFiber.Vector3;
+    end: ReactThreeFiber.Vector3;
+    color?: ReactThreeFiber.Color;
+};
+declare const Segments: ForwardRefComponent<SegmentsProps, Line2>;
+declare module '@react-three/fiber' {
+    interface ThreeElements {
+        segmentObject: ThreeElement<typeof SegmentObject>;
+    }
+}
+export declare class SegmentObject {
+    color: THREE.Color;
+    start: THREE.Vector3;
+    end: THREE.Vector3;
+    constructor();
+}
+declare const Segment: ForwardRefComponent<SegmentProps, SegmentObject>;
+export { Segments, Segment };

package/core/Segments.js

@@ -0,0 +1,96 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import * as THREE from 'three';
+import * as React from 'react';
+import { extend, useFrame } from '@react-three/fiber';
+import { Line2, LineMaterial, LineSegmentsGeometry } from 'three-stdlib';
+
+const context = /* @__PURE__ */React.createContext(null);
+const Segments = /* @__PURE__ */React.forwardRef((props, forwardedRef) => {
+  React.useMemo(() => extend({
+    SegmentObject
+  }), []);
+  const {
+    limit = 1000,
+    lineWidth = 1.0,
+    children,
+    ...rest
+  } = props;
+  const [segments, setSegments] = React.useState([]);
+  const [line] = React.useState(() => new Line2());
+  const [material] = React.useState(() => new LineMaterial());
+  const [geometry] = React.useState(() => new LineSegmentsGeometry());
+  const [resolution] = React.useState(() => new THREE.Vector2(512, 512));
+  const [positions] = React.useState(() => Array(limit * 6).fill(0));
+  const [colors] = React.useState(() => Array(limit * 6).fill(0));
+  const api = React.useMemo(() => ({
+    subscribe: ref => {
+      setSegments(segments => [...segments, ref]);
+      return () => setSegments(segments => segments.filter(item => item.current !== ref.current));
+    }
+  }), []);
+  useFrame(() => {
+    for (let i = 0; i < limit; i++) {
+      var _segments$i;
+      const segment = (_segments$i = segments[i]) == null ? void 0 : _segments$i.current;
+      if (segment) {
+        positions[i * 6 + 0] = segment.start.x;
+        positions[i * 6 + 1] = segment.start.y;
+        positions[i * 6 + 2] = segment.start.z;
+        positions[i * 6 + 3] = segment.end.x;
+        positions[i * 6 + 4] = segment.end.y;
+        positions[i * 6 + 5] = segment.end.z;
+        colors[i * 6 + 0] = segment.color.r;
+        colors[i * 6 + 1] = segment.color.g;
+        colors[i * 6 + 2] = segment.color.b;
+        colors[i * 6 + 3] = segment.color.r;
+        colors[i * 6 + 4] = segment.color.g;
+        colors[i * 6 + 5] = segment.color.b;
+      }
+    }
+    geometry.setColors(colors);
+    geometry.setPositions(positions);
+    line.computeLineDistances();
+  });
+  return /*#__PURE__*/React.createElement("primitive", {
+    object: line,
+    ref: forwardedRef
+  }, /*#__PURE__*/React.createElement("primitive", {
+    object: geometry,
+    attach: "geometry"
+  }), /*#__PURE__*/React.createElement("primitive", _extends({
+    object: material,
+    attach: "material",
+    vertexColors: true,
+    resolution: resolution,
+    linewidth: lineWidth
+  }, rest)), /*#__PURE__*/React.createElement(context.Provider, {
+    value: api
+  }, children));
+});
+class SegmentObject {
+  constructor() {
+    this.color = new THREE.Color('white');
+    this.start = new THREE.Vector3(0, 0, 0);
+    this.end = new THREE.Vector3(0, 0, 0);
+  }
+}
+const normPos = pos => pos instanceof THREE.Vector3 ? pos : new THREE.Vector3(...(typeof pos === 'number' ? [pos, pos, pos] : pos));
+const Segment = /* @__PURE__ */React.forwardRef(({
+  color,
+  start,
+  end
+}, forwardedRef) => {
+  const api = React.useContext(context);
+  if (!api) throw 'Segment must used inside Segments component.';
+  const ref = React.useRef(null);
+  React.useImperativeHandle(forwardedRef, () => ref.current, []);
+  React.useLayoutEffect(() => api.subscribe(ref), []);
+  return /*#__PURE__*/React.createElement("segmentObject", {
+    ref: ref,
+    color: color,
+    start: normPos(start),
+    end: normPos(end)
+  });
+});
+
+export { Segment, SegmentObject, Segments };

package/core/Shadow.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");function a(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 a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,a.get?a:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var n=a(e),c=o(t);const i=c.forwardRef((({fog:e=!1,renderOrder:t,depthWrite:a=!1,colorStop:o=0,color:i="black",opacity:l=.5,...d},u)=>{const f=c.useMemo((()=>{const e=document.createElement("canvas");e.width=128,e.height=128;const t=e.getContext("2d"),a=t.createRadialGradient(e.width/2,e.height/2,0,e.width/2,e.height/2,e.width/2);return a.addColorStop(o,new r.Color(i).getStyle()),a.addColorStop(1,"rgba(0,0,0,0)"),t.fillStyle=a,t.fillRect(0,0,e.width,e.height),e}),[i,o]);return c.createElement("mesh",n.default({renderOrder:t,ref:u,"rotation-x":-Math.PI/2},d),c.createElement("planeGeometry",null),c.createElement("meshBasicMaterial",{transparent:!0,opacity:l,fog:e,depthWrite:a,side:r.DoubleSide},c.createElement("canvasTexture",{attach:"map",args:[f]})))}));exports.Shadow=i;

package/core/Shadow.d.ts

@@ -0,0 +1,12 @@
+import { Mesh, Color, type PlaneGeometry, type MeshBasicMaterial } from 'three';
+import { ForwardRefComponent } from '../helpers/ts-utils';
+import { ThreeElements } from '@react-three/fiber';
+export type ShadowProps = Omit<ThreeElements['mesh'], 'ref'> & {
+    colorStop?: number;
+    fog?: boolean;
+    color?: Color | number | string;
+    opacity?: number;
+    depthWrite?: boolean;
+};
+export type ShadowType = Mesh<PlaneGeometry, MeshBasicMaterial>;
+export declare const Shadow: ForwardRefComponent<ShadowProps, ShadowType>;

package/core/Shadow.js

@@ -0,0 +1,42 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import * as React from 'react';
+import { Color, DoubleSide } from 'three';
+
+const Shadow = /* @__PURE__ */React.forwardRef(({
+  fog = false,
+  renderOrder,
+  depthWrite = false,
+  colorStop = 0.0,
+  color = 'black',
+  opacity = 0.5,
+  ...props
+}, ref) => {
+  const canvas = React.useMemo(() => {
+    const canvas = document.createElement('canvas');
+    canvas.width = 128;
+    canvas.height = 128;
+    const context = canvas.getContext('2d');
+    const gradient = context.createRadialGradient(canvas.width / 2, canvas.height / 2, 0, canvas.width / 2, canvas.height / 2, canvas.width / 2);
+    gradient.addColorStop(colorStop, new Color(color).getStyle());
+    gradient.addColorStop(1, 'rgba(0,0,0,0)');
+    context.fillStyle = gradient;
+    context.fillRect(0, 0, canvas.width, canvas.height);
+    return canvas;
+  }, [color, colorStop]);
+  return /*#__PURE__*/React.createElement("mesh", _extends({
+    renderOrder: renderOrder,
+    ref: ref,
+    "rotation-x": -Math.PI / 2
+  }, props), /*#__PURE__*/React.createElement("planeGeometry", null), /*#__PURE__*/React.createElement("meshBasicMaterial", {
+    transparent: true,
+    opacity: opacity,
+    fog: fog,
+    depthWrite: depthWrite,
+    side: DoubleSide
+  }, /*#__PURE__*/React.createElement("canvasTexture", {
+    attach: "map",
+    args: [canvas]
+  })));
+});
+
+export { Shadow };

package/core/ShadowAlpha.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("@react-three/fiber"),r=require("react"),a=require("three");function t(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(a){if("default"!==a){var t=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(r,a,t.get?t:{enumerable:!0,get:function(){return e[a]}})}})),r.default=e,Object.freeze(r)}var n=t(r),u=t(a);exports.ShadowAlpha=function({opacity:r,alphaMap:a}){const t=n.useRef(null),l=n.useRef(null),o=n.useRef({value:1}),c=n.useRef({value:null}),i=n.useRef({value:!1});return n.useLayoutEffect((()=>{t.current.onBeforeCompile=l.current.onBeforeCompile=e=>{const r=e.fragmentShader.indexOf("void main");let a,t="",n=r;for(;"\n"!==a&&n<r+100;)a=e.fragmentShader.charAt(n),t+=a,n++;t=t.trim(),e.vertexShader=e.vertexShader.replace("void main() {","\n        varying vec2 custom_vUv;\n\n        void main() {\n          custom_vUv = uv;\n          \n        "),e.fragmentShader=e.fragmentShader.replace(t,"\n          uniform float uShadowOpacity;\n          uniform sampler2D uAlphaMap;\n          uniform bool uHasAlphaMap;\n\n          varying vec2 custom_vUv;\n  \n          float bayerDither2x2( vec2 v ) {\n            return mod( 3.0 * v.y + 2.0 * v.x, 4.0 );\n          }\n    \n          float bayerDither4x4( vec2 v ) {\n            vec2 P1 = mod( v, 2.0 );\n            vec2 P2 = mod( floor( 0.5  * v ), 2.0 );\n            return 4.0 * bayerDither2x2( P1 ) + bayerDither2x2( P2 );\n          }\n  \n          void main() {\n            float alpha = \n              uHasAlphaMap ? \n                uShadowOpacity * texture2D(uAlphaMap, custom_vUv).x\n              : uShadowOpacity;\n\n            if( ( bayerDither4x4( floor( mod( gl_FragCoord.xy, 4.0 ) ) ) ) / 16.0 >= alpha ) discard;\n            \n          "),e.uniforms.uShadowOpacity=o.current,e.uniforms.uAlphaMap=c.current,e.uniforms.uHasAlphaMap=i.current}}),[]),e.useFrame((()=>{var e;const n=null==(e=t.current.__r3f)||null==(e=e.parent)?void 0:e.object;if(n){const e=n.material;e&&(o.current.value=null!=r?r:e.opacity,!1===a?(c.current.value=null,i.current.value=!1):(c.current.value=a||e.alphaMap,i.current.value=!!c.current.value))}})),n.createElement(n.Fragment,null,n.createElement("meshDepthMaterial",{ref:t,attach:"customDepthMaterial",depthPacking:u.RGBADepthPacking}),n.createElement("meshDistanceMaterial",{ref:l,attach:"customDistanceMaterial"}))};

package/core/ShadowAlpha.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import * as THREE from 'three';
+export interface ShadowAlphaProps {
+    opacity?: number;
+    alphaMap?: THREE.Texture | boolean;
+}
+export declare function ShadowAlpha({ opacity, alphaMap }: ShadowAlphaProps): React.JSX.Element;

package/core/ShadowAlpha.js

@@ -0,0 +1,108 @@
+import { useFrame } from '@react-three/fiber';
+import * as React from 'react';
+import * as THREE from 'three';
+
+/**
+ * Integration and compilation: Faraz Shaikh (https://twitter.com/CantBeFaraz)
+ *
+ * Based on:
+ *  - https://gkjohnson.github.io/threejs-sandbox/screendoor-transparency/ by Garrett Johnson (https://github.com/gkjohnson)
+ *
+ * Note:
+ *  - Must depreciate in favor of https://github.com/mrdoob/three.js/issues/10600 when it's ready.
+ */
+function ShadowAlpha({
+  opacity,
+  alphaMap
+}) {
+  const depthMaterialRef = React.useRef(null);
+  const distanceMaterialRef = React.useRef(null);
+  const uShadowOpacity = React.useRef({
+    value: 1
+  });
+  const uAlphaMap = React.useRef({
+    value: null
+  });
+  const uHasAlphaMap = React.useRef({
+    value: false
+  });
+  React.useLayoutEffect(() => {
+    depthMaterialRef.current.onBeforeCompile = distanceMaterialRef.current.onBeforeCompile = shader => {
+      // Need to get the "void main" line dynamically because the lines for
+      // MeshDistanceMaterial and MeshDepthMaterial are different 🤦‍♂️
+      const mainLineStart = shader.fragmentShader.indexOf('void main');
+      let mainLine = '';
+      let ch;
+      let i = mainLineStart;
+      while (ch !== '\n' && i < mainLineStart + 100) {
+        ch = shader.fragmentShader.charAt(i);
+        mainLine += ch;
+        i++;
+      }
+      mainLine = mainLine.trim();
+      shader.vertexShader = shader.vertexShader.replace('void main() {', `
+        varying vec2 custom_vUv;
+
+        void main() {
+          custom_vUv = uv;
+          
+        `);
+      shader.fragmentShader = shader.fragmentShader.replace(mainLine, `
+          uniform float uShadowOpacity;
+          uniform sampler2D uAlphaMap;
+          uniform bool uHasAlphaMap;
+
+          varying vec2 custom_vUv;
+  
+          float bayerDither2x2( vec2 v ) {
+            return mod( 3.0 * v.y + 2.0 * v.x, 4.0 );
+          }
+    
+          float bayerDither4x4( vec2 v ) {
+            vec2 P1 = mod( v, 2.0 );
+            vec2 P2 = mod( floor( 0.5  * v ), 2.0 );
+            return 4.0 * bayerDither2x2( P1 ) + bayerDither2x2( P2 );
+          }
+  
+          void main() {
+            float alpha = 
+              uHasAlphaMap ? 
+                uShadowOpacity * texture2D(uAlphaMap, custom_vUv).x
+              : uShadowOpacity;
+
+            if( ( bayerDither4x4( floor( mod( gl_FragCoord.xy, 4.0 ) ) ) ) / 16.0 >= alpha ) discard;
+            
+          `);
+      shader.uniforms['uShadowOpacity'] = uShadowOpacity.current;
+      shader.uniforms['uAlphaMap'] = uAlphaMap.current;
+      shader.uniforms['uHasAlphaMap'] = uHasAlphaMap.current;
+    };
+  }, []);
+  useFrame(() => {
+    var _r3f;
+    const parent = (_r3f = depthMaterialRef.current.__r3f) == null || (_r3f = _r3f.parent) == null ? void 0 : _r3f.object;
+    if (parent) {
+      const parentMainMaterial = parent.material;
+      if (parentMainMaterial) {
+        uShadowOpacity.current.value = opacity !== null && opacity !== void 0 ? opacity : parentMainMaterial.opacity;
+        if (alphaMap === false) {
+          uAlphaMap.current.value = null;
+          uHasAlphaMap.current.value = false;
+        } else {
+          uAlphaMap.current.value = alphaMap || parentMainMaterial.alphaMap;
+          uHasAlphaMap.current.value = !!uAlphaMap.current.value;
+        }
+      }
+    }
+  });
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("meshDepthMaterial", {
+    ref: depthMaterialRef,
+    attach: "customDepthMaterial",
+    depthPacking: THREE.RGBADepthPacking
+  }), /*#__PURE__*/React.createElement("meshDistanceMaterial", {
+    ref: distanceMaterialRef,
+    attach: "customDistanceMaterial"
+  }));
+}
+
+export { ShadowAlpha };

package/core/Sky.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-stdlib"),i=require("three");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 u=n(e),o=a(t);function c(e,t,r=new i.Vector3){const n=Math.PI*(e-.5),a=2*Math.PI*(t-.5);return r.x=Math.cos(a),r.y=Math.sin(n),r.z=Math.sin(a),r}const l=o.forwardRef((({inclination:e=.6,azimuth:t=.1,distance:n=1e3,mieCoefficient:a=.005,mieDirectionalG:l=.8,rayleigh:s=.5,turbidity:f=10,sunPosition:m=c(e,t),...d},b)=>{const h=o.useMemo((()=>(new i.Vector3).setScalar(n)),[n]),[y]=o.useState((()=>new r.Sky));return o.createElement("primitive",u.default({object:y,ref:b,"material-uniforms-mieCoefficient-value":a,"material-uniforms-mieDirectionalG-value":l,"material-uniforms-rayleigh-value":s,"material-uniforms-sunPosition-value":m,"material-uniforms-turbidity-value":f,scale:h},d))}));exports.Sky=l,exports.calcPosFromAngles=c;

package/core/Sky.d.ts

@@ -0,0 +1,16 @@
+import { ReactThreeFiber } from '@react-three/fiber';
+import { Sky as SkyImpl } from 'three-stdlib';
+import { Vector3 } from 'three';
+import { ForwardRefComponent } from '../helpers/ts-utils';
+export type SkyProps = {
+    distance?: number;
+    sunPosition?: ReactThreeFiber.Vector3;
+    inclination?: number;
+    azimuth?: number;
+    mieCoefficient?: number;
+    mieDirectionalG?: number;
+    rayleigh?: number;
+    turbidity?: number;
+};
+export declare function calcPosFromAngles(inclination: number, azimuth: number, vector?: Vector3): Vector3;
+export declare const Sky: ForwardRefComponent<SkyProps, SkyImpl>;