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

package/core/Instances.js

@@ -0,0 +1,313 @@
+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 { setUpdateRange } from '../helpers/deprecated.js';
+
+function isFunctionChild(value) {
+  return typeof value === 'function';
+}
+const _instanceLocalMatrix = /* @__PURE__ */new THREE.Matrix4();
+const _instanceWorldMatrix = /* @__PURE__ */new THREE.Matrix4();
+const _instanceIntersects = [];
+const _mesh = /* @__PURE__ */new THREE.Mesh();
+class PositionMesh extends THREE.Group {
+  constructor() {
+    super();
+    this.color = new THREE.Color('white');
+    this.instance = {
+      current: undefined
+    };
+    this.instanceKey = {
+      current: undefined
+    };
+  }
+
+  // This will allow the virtual instance have bounds
+  get geometry() {
+    var _this$instance$curren;
+    return (_this$instance$curren = this.instance.current) == null ? void 0 : _this$instance$curren.geometry;
+  }
+
+  // And this will allow the virtual instance to receive events
+  raycast(raycaster, intersects) {
+    const parent = this.instance.current;
+    if (!parent) return;
+    if (!parent.geometry || !parent.material) return;
+    _mesh.geometry = parent.geometry;
+    const matrixWorld = parent.matrixWorld;
+    const instanceId = parent.userData.instances.indexOf(this.instanceKey);
+    // If the instance wasn't found or exceeds the parents draw range, bail out
+    if (instanceId === -1 || instanceId > parent.count) return;
+    // calculate the world matrix for each instance
+    parent.getMatrixAt(instanceId, _instanceLocalMatrix);
+    _instanceWorldMatrix.multiplyMatrices(matrixWorld, _instanceLocalMatrix);
+    // the mesh represents this single instance
+    _mesh.matrixWorld = _instanceWorldMatrix;
+    // raycast side according to instance material
+    if (parent.material instanceof THREE.Material) _mesh.material.side = parent.material.side;else _mesh.material.side = parent.material[0].side;
+    _mesh.raycast(raycaster, _instanceIntersects);
+    // process the result of raycast
+    for (let i = 0, l = _instanceIntersects.length; i < l; i++) {
+      const intersect = _instanceIntersects[i];
+      intersect.instanceId = instanceId;
+      intersect.object = this;
+      intersects.push(intersect);
+    }
+    _instanceIntersects.length = 0;
+  }
+}
+const globalContext = /* @__PURE__ */React.createContext(null);
+const parentMatrix = /* @__PURE__ */new THREE.Matrix4();
+const instanceMatrix = /* @__PURE__ */new THREE.Matrix4();
+const tempMatrix = /* @__PURE__ */new THREE.Matrix4();
+const translation = /* @__PURE__ */new THREE.Vector3();
+const rotation = /* @__PURE__ */new THREE.Quaternion();
+const scale = /* @__PURE__ */new THREE.Vector3();
+const isInstancedBufferAttribute = attr => attr.isInstancedBufferAttribute;
+const Instance = /* @__PURE__ */React.forwardRef(({
+  context,
+  children,
+  ...props
+}, ref) => {
+  React.useMemo(() => extend({
+    PositionMesh
+  }), []);
+  const group = React.useRef(null);
+  React.useImperativeHandle(ref, () => group.current, []);
+  const {
+    subscribe,
+    getParent
+  } = React.useContext(context || globalContext);
+  React.useLayoutEffect(() => subscribe(group), []);
+  return /*#__PURE__*/React.createElement("positionMesh", _extends({
+    instance: getParent(),
+    instanceKey: group,
+    ref: group
+  }, props), children);
+});
+const Instances = /* @__PURE__ */React.forwardRef(({
+  context,
+  children,
+  range,
+  limit = 1000,
+  frames = Infinity,
+  ...props
+}, ref) => {
+  const [{
+    localContext,
+    instance
+  }] = React.useState(() => {
+    const localContext = /*#__PURE__*/React.createContext(null);
+    return {
+      localContext,
+      instance: /*#__PURE__*/React.forwardRef((props, ref) => /*#__PURE__*/React.createElement(Instance, _extends({
+        context: localContext
+      }, props, {
+        ref: ref
+      })))
+    };
+  });
+  const parentRef = React.useRef(null);
+  React.useImperativeHandle(ref, () => parentRef.current, []);
+  const [instances, setInstances] = React.useState([]);
+  const [[matrices, colors]] = React.useState(() => {
+    const mArray = new Float32Array(limit * 16);
+    for (let i = 0; i < limit; i++) tempMatrix.identity().toArray(mArray, i * 16);
+    return [mArray, new Float32Array([...new Array(limit * 3)].map(() => 1))];
+  });
+  React.useEffect(() => {
+    // We might be a frame too late? 🤷‍♂️
+    parentRef.current.instanceMatrix.needsUpdate = true;
+  });
+  let iterations = 0;
+  let count = 0;
+  const attributes = React.useRef([]);
+  React.useLayoutEffect(() => {
+    attributes.current = Object.entries(parentRef.current.geometry.attributes).filter(([_name, value]) => isInstancedBufferAttribute(value));
+  });
+  useFrame(() => {
+    if (frames === Infinity || iterations < frames) {
+      parentRef.current.updateMatrix();
+      parentRef.current.updateMatrixWorld();
+      parentMatrix.copy(parentRef.current.matrixWorld).invert();
+      count = Math.min(limit, range !== undefined ? range : limit, instances.length);
+      parentRef.current.count = count;
+      setUpdateRange(parentRef.current.instanceMatrix, {
+        start: 0,
+        count: count * 16
+      });
+      setUpdateRange(parentRef.current.instanceColor, {
+        start: 0,
+        count: count * 3
+      });
+      for (let i = 0; i < instances.length; i++) {
+        const instance = instances[i].current;
+        // Multiply the inverse of the InstancedMesh world matrix or else
+        // Instances will be double-transformed if <Instances> isn't at identity
+        instance.matrixWorld.decompose(translation, rotation, scale);
+        instanceMatrix.compose(translation, rotation, scale).premultiply(parentMatrix);
+        instanceMatrix.toArray(matrices, i * 16);
+        parentRef.current.instanceMatrix.needsUpdate = true;
+        instance.color.toArray(colors, i * 3);
+        parentRef.current.instanceColor.needsUpdate = true;
+      }
+      iterations++;
+    }
+  });
+  const api = React.useMemo(() => ({
+    getParent: () => parentRef,
+    subscribe: ref => {
+      setInstances(instances => [...instances, ref]);
+      return () => setInstances(instances => instances.filter(item => item.current !== ref.current));
+    }
+  }), []);
+  return /*#__PURE__*/React.createElement("instancedMesh", _extends({
+    userData: {
+      instances,
+      limit,
+      frames
+    },
+    matrixAutoUpdate: false,
+    ref: parentRef,
+    args: [null, null, 0],
+    raycast: () => null
+  }, props), /*#__PURE__*/React.createElement("instancedBufferAttribute", {
+    attach: "instanceMatrix",
+    args: [matrices, 16],
+    usage: THREE.DynamicDrawUsage
+  }), /*#__PURE__*/React.createElement("instancedBufferAttribute", {
+    attach: "instanceColor",
+    args: [colors, 3],
+    usage: THREE.DynamicDrawUsage
+  }), isFunctionChild(children) ? /*#__PURE__*/React.createElement(localContext.Provider, {
+    value: api
+  }, children(instance)) : context ? /*#__PURE__*/React.createElement(context.Provider, {
+    value: api
+  }, children) : /*#__PURE__*/React.createElement(globalContext.Provider, {
+    value: api
+  }, children));
+});
+// TODO: make this non-recursive and type-safe
+const Merged = /* @__PURE__ */React.forwardRef(function Merged({
+  meshes,
+  children,
+  ...props
+}, ref) {
+  const isArray = Array.isArray(meshes);
+  // Filter out meshes from collections, which may contain non-meshes
+  // @ts-expect-error
+  if (!isArray) for (const key of Object.keys(meshes)) if (!meshes[key].isMesh) delete meshes[key];
+  const render = args => isArray ?
+  // @ts-expect-error
+  children(...args) : children(
+  // @ts-expect-error
+  Object.keys(meshes)
+  // @ts-expect-error
+  .filter(key => meshes[key].isMesh).reduce((acc, key, i) => ({
+    ...acc,
+    [key]: args[i]
+  }), {}));
+
+  // @ts-expect-error
+  const components = (isArray ? meshes : Object.values(meshes)).map(({
+    geometry,
+    material
+  }) => /*#__PURE__*/React.createElement(Instances, _extends({
+    key: geometry.uuid,
+    geometry: geometry,
+    material: material
+  }, props)));
+  return /*#__PURE__*/React.createElement("group", {
+    ref: ref
+  }, renderRecursive(render, components));
+});
+
+// https://github.com/jamesplease/react-composer
+function renderRecursive(render, components, results = []) {
+  // Once components is exhausted, we can render out the results array.
+  if (!components[0]) {
+    return render(results);
+  }
+
+  // Continue recursion for remaining items.
+  // results.concat([value]) ensures [...results, value] instead of [...results, ...value]
+  function nextRender(value) {
+    return renderRecursive(render, components.slice(1), results.concat([value]));
+  }
+
+  // Each props.components entry is either an element or function [element factory]
+  return typeof components[0] === 'function' ?
+  // When it is a function, produce an element by invoking it with "render component values".
+  components[0]({
+    results,
+    render: nextRender
+  }) :
+  /*#__PURE__*/
+  // When it is an element, enhance the element's props with the render prop.
+  React.cloneElement(components[0], {
+    children: nextRender
+  });
+}
+
+/** Idea and implementation for global instances and instanced attributes by
+/*  Matias Gonzalez Fernandez https://x.com/matiNotFound
+/*  and Paul Henschel https://x.com/0xca0a
+*/
+function createInstances() {
+  const context = /*#__PURE__*/React.createContext(null);
+  return [/*#__PURE__*/React.forwardRef((props, fref) => /*#__PURE__*/React.createElement(Instances, _extends({
+    ref: fref,
+    context: context
+  }, props))), /*#__PURE__*/React.forwardRef((props, fref) => /*#__PURE__*/React.createElement(Instance, _extends({
+    ref: fref,
+    context: context
+  }, props)))];
+}
+const InstancedAttribute = /*#__PURE__*/React.forwardRef(({
+  name,
+  defaultValue,
+  normalized,
+  usage = THREE.DynamicDrawUsage
+}, fref) => {
+  const ref = React.useRef(null);
+  React.useImperativeHandle(fref, () => ref.current, []);
+  React.useLayoutEffect(() => {
+    const parent = ref.current.__r3f.parent.object;
+    parent.geometry.attributes[name] = ref.current;
+    const value = Array.isArray(defaultValue) ? defaultValue : [defaultValue];
+    const array = Array.from({
+      length: parent.userData.limit
+    }, () => value).flat();
+    ref.current.array = new Float32Array(array);
+    ref.current.itemSize = value.length;
+    // @ts-expect-error
+    ref.current.count = array.length / ref.current.itemSize;
+    return () => {
+      delete parent.geometry.attributes[name];
+    };
+  }, [name]);
+  let iterations = 0;
+  useFrame(() => {
+    const parent = ref.current.__r3f.parent.object;
+    if (parent.userData.frames === Infinity || iterations < parent.userData.frames) {
+      for (let i = 0; i < parent.userData.instances.length; i++) {
+        const instance = parent.userData.instances[i].current;
+        const value = instance[name];
+        if (value !== undefined) {
+          ref.current.set(Array.isArray(value) ? value : typeof value.toArray === 'function' ? value.toArray() : [value], i * ref.current.itemSize);
+          ref.current.needsUpdate = true;
+        }
+      }
+      iterations++;
+    }
+  });
+  // @ts-expect-error we're abusing three API here by mutating immutable args
+  return /*#__PURE__*/React.createElement("instancedBufferAttribute", {
+    ref: ref,
+    usage: usage,
+    normalized: normalized
+  });
+});
+
+export { Instance, InstancedAttribute, Instances, Merged, PositionMesh, createInstances };

package/core/Ktx2.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("@react-three/fiber"),t=require("three-stdlib"),s=require("./Texture.cjs.js");function a(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var s=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,s.get?s:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}require("three");var c=a(e);const n="https://cdn.jsdelivr.net/gh/pmndrs/drei-assets@master";function u(a,c=`${n}/basis/`){const u=r.useThree((e=>e.gl)),o=r.useLoader(t.KTX2Loader,s.IsObject(a)?Object.values(a):a,(e=>{e.detectSupport(u),e.setTranscoderPath(c)}));if(e.useEffect((()=>{(Array.isArray(o)?o:[o]).forEach(u.initTexture)}),[u,o]),s.IsObject(a)){const e=Object.keys(a),r={};return e.forEach((t=>Object.assign(r,{[t]:o[e.indexOf(t)]}))),r}return o}u.preload=(e,s=`${n}/basis/`)=>r.useLoader.preload(t.KTX2Loader,e,(e=>{e.setTranscoderPath(s)})),u.clear=e=>r.useLoader.clear(t.KTX2Loader,e);exports.Ktx2=({children:e,input:r,basisPath:t})=>{const s=u(r,t);return c.createElement(c.Fragment,null,null==e?void 0:e(s))},exports.useKTX2=u;

package/core/Ktx2.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { Texture } from 'three';
+export declare function useKTX2<Url extends string[] | string | Record<string, string>>(input: Url, basisPath?: string): Url extends any[] ? Texture[] : Url extends object ? {
+    [key in keyof Url]: Texture;
+} : Texture;
+export declare namespace useKTX2 {
+    var preload: (url: string extends any[] ? string[] : string, basisPath?: string) => void;
+    var clear: (input: string | string[]) => void;
+}
+export declare const Ktx2: ({ children, input, basisPath, }: {
+    children?: (texture: ReturnType<typeof useKTX2>) => React.ReactNode;
+    input: Parameters<typeof useKTX2>[0];
+    basisPath?: Parameters<typeof useKTX2>[1];
+}) => React.JSX.Element;

package/core/Ktx2.js

@@ -0,0 +1,48 @@
+import * as React from 'react';
+import { useEffect } from 'react';
+import { useThree, useLoader } from '@react-three/fiber';
+import { KTX2Loader } from 'three-stdlib';
+import { IsObject } from './Texture.js';
+
+const cdn = 'https://cdn.jsdelivr.net/gh/pmndrs/drei-assets@master';
+function useKTX2(input, basisPath = `${cdn}/basis/`) {
+  const gl = useThree(state => state.gl);
+  const textures = useLoader(KTX2Loader, IsObject(input) ? Object.values(input) : input, loader => {
+    loader.detectSupport(gl);
+    loader.setTranscoderPath(basisPath);
+  });
+
+  // https://github.com/mrdoob/three.js/issues/22696
+  // Upload the texture to the GPU immediately instead of waiting for the first render
+  useEffect(() => {
+    const array = Array.isArray(textures) ? textures : [textures];
+    array.forEach(gl.initTexture);
+  }, [gl, textures]);
+  if (IsObject(input)) {
+    const keys = Object.keys(input);
+    const keyed = {};
+    keys.forEach(key => Object.assign(keyed, {
+      [key]: textures[keys.indexOf(key)]
+    }));
+    return keyed;
+  } else {
+    return textures;
+  }
+}
+useKTX2.preload = (url, basisPath = `${cdn}/basis/`) => useLoader.preload(KTX2Loader, url, loader => {
+  loader.setTranscoderPath(basisPath);
+});
+useKTX2.clear = input => useLoader.clear(KTX2Loader, input);
+
+//
+
+const Ktx2 = ({
+  children,
+  input,
+  basisPath
+}) => {
+  const texture = useKTX2(input, basisPath);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, children == null ? void 0 : children(texture));
+};
+
+export { Ktx2, useKTX2 };

package/core/Lightformer.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"),a=require("three");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function o(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var a=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,a.get?a:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var c=n(e),l=o(t),i=o(a);const u=l.forwardRef((({light:e,args:t,map:a,toneMapped:n=!1,color:o="white",form:u="rect",intensity:s=1,scale:f=1,target:m=[0,0,0],children:p,...d},y)=>{const g=l.useRef(null);return l.useImperativeHandle(y,(()=>g.current),[]),l.useLayoutEffect((()=>{p||d.material||(r.applyProps(g.current.material,{color:o}),g.current.material.color.multiplyScalar(s))}),[o,s,p,d.material]),l.useLayoutEffect((()=>{d.rotation||g.current.quaternion.identity(),m&&!d.rotation&&("boolean"==typeof m?g.current.lookAt(0,0,0):g.current.lookAt(Array.isArray(m)?new i.Vector3(...m):m))}),[m,d.rotation]),f=Array.isArray(f)&&2===f.length?[f[0],f[1],1]:f,l.createElement("mesh",c.default({ref:g,scale:f},d),"circle"===u?l.createElement("ringGeometry",{args:t||[0,.5,64]}):"ring"===u?l.createElement("ringGeometry",{args:t||[.25,.5,64]}):"rect"===u||"plane"===u?l.createElement("planeGeometry",{args:t||[1,1]}):"box"===u?l.createElement("boxGeometry",{args:t||[1,1,1]}):l.createElement(u,{args:t}),p||l.createElement("meshBasicMaterial",{toneMapped:n,map:a,side:i.DoubleSide}),e&&l.createElement("pointLight",c.default({castShadow:!0},e)))}));exports.Lightformer=u;

package/core/Lightformer.d.ts

@@ -0,0 +1,15 @@
+import { ReactThreeFiber, ThreeElements } from '@react-three/fiber';
+import * as THREE from 'three';
+import { ForwardRefComponent } from '../helpers/ts-utils';
+export type LightProps = Omit<ThreeElements['mesh'], 'ref'> & {
+    args?: any[];
+    map?: THREE.Texture;
+    toneMapped?: boolean;
+    color?: ReactThreeFiber.Color;
+    form?: 'circle' | 'ring' | 'rect' | 'plane' | 'box' | any;
+    scale?: number | [number, number, number] | [number, number];
+    intensity?: number;
+    target?: boolean | [number, number, number] | THREE.Vector3;
+    light?: Partial<ThreeElements['pointLight']>;
+};
+export declare const Lightformer: ForwardRefComponent<LightProps, THREE.Mesh>;

package/core/Lightformer.js

@@ -0,0 +1,63 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import { applyProps } from '@react-three/fiber';
+import * as React from 'react';
+import * as THREE from 'three';
+
+const Lightformer = /* @__PURE__ */React.forwardRef(({
+  light,
+  args,
+  map,
+  toneMapped = false,
+  color = 'white',
+  form: Form = 'rect',
+  intensity = 1,
+  scale = 1,
+  target = [0, 0, 0],
+  children,
+  ...props
+}, forwardRef) => {
+  // Apply emissive power
+  const ref = React.useRef(null);
+  React.useImperativeHandle(forwardRef, () => ref.current, []);
+  React.useLayoutEffect(() => {
+    if (!children && !props.material) {
+      applyProps(ref.current.material, {
+        color
+      });
+      ref.current.material.color.multiplyScalar(intensity);
+    }
+  }, [color, intensity, children, props.material]);
+
+  // Target light
+  React.useLayoutEffect(() => {
+    if (!props.rotation) ref.current.quaternion.identity();
+    if (target && !props.rotation) {
+      'boolean' === typeof target ? ref.current.lookAt(0, 0, 0) : ref.current.lookAt(Array.isArray(target) ? new THREE.Vector3(...target) : target);
+    }
+  }, [target, props.rotation]);
+
+  // Fix 2-dimensional scale
+  scale = Array.isArray(scale) && scale.length === 2 ? [scale[0], scale[1], 1] : scale;
+  return /*#__PURE__*/React.createElement("mesh", _extends({
+    ref: ref,
+    scale: scale
+  }, props), Form === 'circle' ? /*#__PURE__*/React.createElement("ringGeometry", {
+    args: args ? args : [0, 0.5, 64]
+  }) : Form === 'ring' ? /*#__PURE__*/React.createElement("ringGeometry", {
+    args: args ? args : [0.25, 0.5, 64]
+  }) : Form === 'rect' || Form === 'plane' ? /*#__PURE__*/React.createElement("planeGeometry", {
+    args: args ? args : [1, 1]
+  }) : Form === 'box' ? /*#__PURE__*/React.createElement("boxGeometry", {
+    args: args ? args : [1, 1, 1]
+  }) : /*#__PURE__*/React.createElement(Form, {
+    args: args
+  }), children ? children : /*#__PURE__*/React.createElement("meshBasicMaterial", {
+    toneMapped: toneMapped,
+    map: map,
+    side: THREE.DoubleSide
+  }), light && /*#__PURE__*/React.createElement("pointLight", _extends({
+    castShadow: true
+  }, light)));
+});
+
+export { Lightformer };

package/core/Line.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"),n=require("@react-three/fiber"),i=require("three-stdlib");function o(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 a=o(e),c=s(t);const l=c.forwardRef((function({points:e,color:t=16777215,vertexColors:o,linewidth:s,lineWidth:l,segments:u,dashed:f,...d},m){var h,p;const b=n.useThree((e=>e.size)),y=c.useMemo((()=>u?new i.LineSegments2:new i.Line2),[u]),[v]=c.useState((()=>new i.LineMaterial)),g=4===(null==o||null==(h=o[0])?void 0:h.length)?4:3,j=c.useMemo((()=>{const n=u?new i.LineSegmentsGeometry:new i.LineGeometry,s=e.map((e=>{const t=Array.isArray(e);return e instanceof r.Vector3||e instanceof r.Vector4?[e.x,e.y,e.z]:e instanceof r.Vector2?[e.x,e.y,0]:t&&3===e.length?[e[0],e[1],e[2]]:t&&2===e.length?[e[0],e[1],0]:e}));if(n.setPositions(s.flat()),o){t=16777215;const e=o.map((e=>e instanceof r.Color?e.toArray():e));n.setColors(e.flat(),g)}return n}),[e,u,o,g]);return c.useLayoutEffect((()=>{y.computeLineDistances()}),[e,y]),c.useLayoutEffect((()=>{f?v.defines.USE_DASH="":delete v.defines.USE_DASH,v.needsUpdate=!0}),[f,v]),c.useEffect((()=>()=>{j.dispose(),v.dispose()}),[j]),c.createElement("primitive",a.default({object:y,ref:m},d),c.createElement("primitive",{object:j,attach:"geometry"}),c.createElement("primitive",a.default({object:v,attach:"material",color:t,vertexColors:Boolean(o),resolution:[b.width,b.height],linewidth:null!==(p=null!=s?s:l)&&void 0!==p?p:1,dashed:f,transparent:4===g},d)))}));exports.Line=l;

package/core/Line.d.ts

@@ -0,0 +1,13 @@
+import { Color, ColorRepresentation } from 'three';
+import { Vector2 as FiberVector2, Vector3 as FiberVector3, ThreeElement } from '@react-three/fiber';
+import { LineMaterial, LineMaterialParameters, Line2, LineSegments2 } from 'three-stdlib';
+import { ForwardRefComponent } from '../helpers/ts-utils';
+export type LineProps = Omit<{
+    points: ReadonlyArray<FiberVector2 | FiberVector3>;
+    vertexColors?: ReadonlyArray<Color | [number, number, number] | [number, number, number, number]>;
+    lineWidth?: number;
+    segments?: boolean;
+} & Omit<LineMaterialParameters, 'vertexColors' | 'color'> & Omit<ThreeElement<typeof Line2>, 'ref' | 'args'> & Omit<ThreeElement<typeof LineMaterial>, 'ref' | 'color' | 'vertexColors' | 'args'> & {
+    color?: ColorRepresentation;
+}, 'ref'>;
+export declare const Line: ForwardRefComponent<LineProps, Line2 | LineSegments2>;

package/core/Line.js

@@ -0,0 +1,73 @@
+import _extends from '@babel/runtime/helpers/esm/extends';
+import * as React from 'react';
+import { Vector3, Vector4, Vector2, Color } from 'three';
+import { useThree } from '@react-three/fiber';
+import { LineSegments2, Line2, LineMaterial, LineSegmentsGeometry, LineGeometry } from 'three-stdlib';
+
+const Line = /* @__PURE__ */React.forwardRef(function Line({
+  points,
+  color = 0xffffff,
+  vertexColors,
+  linewidth,
+  lineWidth,
+  segments,
+  dashed,
+  ...rest
+}, ref) {
+  var _vertexColors$, _ref;
+  const size = useThree(state => state.size);
+  const line2 = React.useMemo(() => segments ? new LineSegments2() : new Line2(), [segments]);
+  const [lineMaterial] = React.useState(() => new LineMaterial());
+  const itemSize = (vertexColors == null || (_vertexColors$ = vertexColors[0]) == null ? void 0 : _vertexColors$.length) === 4 ? 4 : 3;
+  const lineGeom = React.useMemo(() => {
+    const geom = segments ? new LineSegmentsGeometry() : new LineGeometry();
+    const pValues = points.map(p => {
+      const isArray = Array.isArray(p);
+      return p instanceof Vector3 || p instanceof Vector4 ? [p.x, p.y, p.z] : p instanceof Vector2 ? [p.x, p.y, 0] : isArray && p.length === 3 ? [p[0], p[1], p[2]] : isArray && p.length === 2 ? [p[0], p[1], 0] : p;
+    });
+    geom.setPositions(pValues.flat());
+    if (vertexColors) {
+      // using vertexColors requires the color value to be white see #1813
+      color = 0xffffff;
+      const cValues = vertexColors.map(c => c instanceof Color ? c.toArray() : c);
+      geom.setColors(cValues.flat(), itemSize);
+    }
+    return geom;
+  }, [points, segments, vertexColors, itemSize]);
+  React.useLayoutEffect(() => {
+    line2.computeLineDistances();
+  }, [points, line2]);
+  React.useLayoutEffect(() => {
+    if (dashed) {
+      lineMaterial.defines.USE_DASH = '';
+    } else {
+      // Setting lineMaterial.defines.USE_DASH to undefined is apparently not sufficient.
+      delete lineMaterial.defines.USE_DASH;
+    }
+    lineMaterial.needsUpdate = true;
+  }, [dashed, lineMaterial]);
+  React.useEffect(() => {
+    return () => {
+      lineGeom.dispose();
+      lineMaterial.dispose();
+    };
+  }, [lineGeom]);
+  return /*#__PURE__*/React.createElement("primitive", _extends({
+    object: line2,
+    ref: ref
+  }, rest), /*#__PURE__*/React.createElement("primitive", {
+    object: lineGeom,
+    attach: "geometry"
+  }), /*#__PURE__*/React.createElement("primitive", _extends({
+    object: lineMaterial,
+    attach: "material",
+    color: color,
+    vertexColors: Boolean(vertexColors),
+    resolution: [size.width, size.height],
+    linewidth: (_ref = linewidth !== null && linewidth !== void 0 ? linewidth : lineWidth) !== null && _ref !== void 0 ? _ref : 1,
+    dashed: dashed,
+    transparent: itemSize === 4
+  }, rest)));
+});
+
+export { Line };

package/core/MapControls.cjs.js

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

package/core/MapControls.d.ts

@@ -0,0 +1,14 @@
+import { ReactThreeFiber, ThreeElement } from '@react-three/fiber';
+import * as THREE from 'three';
+import { MapControls as MapControlsImpl } from 'three-stdlib';
+import { ForwardRefComponent, Overwrite } from '../helpers/ts-utils';
+export type MapControlsProps = Omit<Overwrite<ThreeElement<typeof MapControlsImpl>, {
+    target?: ReactThreeFiber.Vector3;
+    camera?: THREE.Camera;
+    makeDefault?: boolean;
+    onChange?: (e?: THREE.Event) => void;
+    onStart?: (e?: THREE.Event) => void;
+    onEnd?: (e?: THREE.Event) => void;
+    domElement?: HTMLElement;
+}>, 'ref' | 'args'>;
+export declare const MapControls: ForwardRefComponent<MapControlsProps, MapControlsImpl>;

package/core/MapControls.js

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

package/core/MarchingCubes.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"),n=require("three-stdlib"),u=require("@react-three/fiber");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function l(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=a(e),c=l(r),s=l(t);const i=s.createContext(null),d=s.forwardRef((({resolution:e=28,maxPolyCount:r=1e4,enableUvs:t=!1,enableColors:a=!1,children:l,...c},d)=>{const f=s.useRef(null);s.useImperativeHandle(d,(()=>f.current),[]);const m=s.useMemo((()=>new n.MarchingCubes(e,null,t,a,r)),[e,r,t,a]),b=s.useMemo((()=>({getParent:()=>f})),[]);return u.useFrame((()=>{m.update(),m.reset()}),-1),s.createElement(s.Fragment,null,s.createElement("primitive",o.default({object:m,ref:f},c),s.createElement(i.Provider,{value:b},l)))})),f=s.forwardRef((({strength:e=.5,subtract:r=12,color:t,...n},a)=>{const{getParent:l}=s.useContext(i),d=s.useMemo((()=>l()),[l]),f=s.useRef(null);s.useImperativeHandle(a,(()=>f.current),[]);const m=new c.Vector3;return u.useFrame((n=>{d.current&&f.current&&(f.current.getWorldPosition(m),d.current.addBall(.5+.5*m.x,.5+.5*m.y,.5+.5*m.z,e,r,t))})),s.createElement("group",o.default({ref:f},n))})),m=s.forwardRef((({planeType:e="x",strength:r=.5,subtract:t=12,...n},a)=>{const{getParent:l}=s.useContext(i),c=s.useMemo((()=>l()),[l]),d=s.useRef(null);s.useImperativeHandle(a,(()=>d.current),[]);const f=s.useMemo((()=>"x"===e?"addPlaneX":"y"===e?"addPlaneY":"addPlaneZ"),[e]);return u.useFrame((()=>{c.current&&d.current&&c.current[f](r,t)})),s.createElement("group",o.default({ref:d},n))}));exports.MarchingCube=f,exports.MarchingCubes=d,exports.MarchingPlane=m;