three-render-objects 1.38.1 → 1.39.1

package/dist/three-render-objects.mjs

@@ -1,18 +1,18 @@
-import { WebGLRenderer, Scene, PerspectiveCamera, Raycaster, SRGBColorSpace, TextureLoader, Vector2, Vector3, Box3, Color, Mesh, SphereGeometry, MeshBasicMaterial, BackSide, EventDispatcher, MOUSE, Quaternion, Spherical, Clock } from 'three';
-import { WebGPURenderer } from 'three/webgpu';
+import { SphereGeometry, Color, TextureLoader, SRGBColorSpace, MeshBasicMaterial, BackSide, Vector2, WebGLRenderer, Mesh, Clock, PerspectiveCamera, Scene, Raycaster, Vector3, Box3 } from 'three';
+import { WebGPURenderer } from 'three/build/three.webgpu.js';
 import { TrackballControls } from 'three/examples/jsm/controls/TrackballControls.js';
 import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
 import { FlyControls } from 'three/examples/jsm/controls/FlyControls.js';
 import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer.js';
 import { RenderPass } from 'three/examples/jsm/postprocessing/RenderPass.js';
 import { parseToRgb, opacify } from 'polished';
-import { Tween, Easing, Group } from '@tweenjs/tween.js';
+import { Group, Tween, Easing } from '@tweenjs/tween.js';
 import accessorFn from 'accessor-fn';
 import Kapsule from 'kapsule';
 import Tooltip from 'float-tooltip';
 
 function styleInject(css, ref) {
-  if (ref === undefined) ref = {};
+  if (ref === void 0) ref = {};
   var insertAt = ref.insertAt;
   if (typeof document === 'undefined') {
     return;
@@ -100,8 +100,8 @@ function _toConsumableArray(r) {
 function _toPrimitive(t, r) {
   if ("object" != typeof t || !t) return t;
   var e = t[Symbol.toPrimitive];
-  if (undefined !== e) {
-    var i = e.call(t, r || "default");
+  if (void 0 !== e) {
+    var i = e.call(t, r);
     if ("object" != typeof i) return i;
     throw new TypeError("@@toPrimitive must return a primitive value.");
   }
@@ -115,7 +115,7 @@ function _unsupportedIterableToArray(r, a) {
   if (r) {
     if ("string" == typeof r) return _arrayLikeToArray(r, a);
     var t = {}.toString.call(r).slice(8, -1);
-    return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : undefined;
+    return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0;
   }
 }
 
@@ -135,10 +135,6 @@ var three = window.THREE ? window.THREE // Prefer consumption from global THREE,
   SphereGeometry: SphereGeometry,
   MeshBasicMaterial: MeshBasicMaterial,
   BackSide: BackSide,
-  EventDispatcher: EventDispatcher,
-  MOUSE: MOUSE,
-  Quaternion: Quaternion,
-  Spherical: Spherical,
   Clock: Clock
 };
 var threeRenderObjects = Kapsule({
@@ -155,6 +151,9 @@ var threeRenderObjects = Kapsule({
         isNaN(height) && (state.height = prevHeight);
       }
     },
+    viewOffset: {
+      "default": [0, 0]
+    },
     backgroundColor: {
       "default": '#000011'
     },
@@ -426,15 +425,15 @@ var threeRenderObjects = Kapsule({
   init: function init(domNode, state) {
     var _ref4 = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
       _ref4$controlType = _ref4.controlType,
-      controlType = _ref4$controlType === undefined ? 'trackball' : _ref4$controlType,
+      controlType = _ref4$controlType === void 0 ? 'trackball' : _ref4$controlType,
       _ref4$useWebGPU = _ref4.useWebGPU,
-      useWebGPU = _ref4$useWebGPU === undefined ? false : _ref4$useWebGPU,
+      useWebGPU = _ref4$useWebGPU === void 0 ? false : _ref4$useWebGPU,
       _ref4$rendererConfig = _ref4.rendererConfig,
-      rendererConfig = _ref4$rendererConfig === undefined ? {} : _ref4$rendererConfig,
+      rendererConfig = _ref4$rendererConfig === void 0 ? {} : _ref4$rendererConfig,
       _ref4$extraRenderers = _ref4.extraRenderers,
-      extraRenderers = _ref4$extraRenderers === undefined ? [] : _ref4$extraRenderers,
+      extraRenderers = _ref4$extraRenderers === void 0 ? [] : _ref4$extraRenderers,
       _ref4$waitForLoadComp = _ref4.waitForLoadComplete,
-      waitForLoadComplete = _ref4$waitForLoadComp === undefined ? true : _ref4$waitForLoadComp;
+      waitForLoadComplete = _ref4$waitForLoadComp === void 0 ? true : _ref4$waitForLoadComp;
     // Wipe DOM
     domNode.innerHTML = '';
 
@@ -583,14 +582,30 @@ var threeRenderObjects = Kapsule({
   update: function update(state, changedProps) {
     // resize canvas
     if (state.width && state.height && (changedProps.hasOwnProperty('width') || changedProps.hasOwnProperty('height'))) {
-      state.container.style.width = "".concat(state.width, "px");
-      state.container.style.height = "".concat(state.height, "px");
+      var _state$camera;
+      var w = state.width;
+      var h = state.height;
+      state.container.style.width = "".concat(w, "px");
+      state.container.style.height = "".concat(h, "px");
       [state.renderer, state.postProcessingComposer].concat(_toConsumableArray(state.extraRenderers)).forEach(function (r) {
-        return r.setSize(state.width, state.height);
+        return r.setSize(w, h);
       });
-      state.camera.aspect = state.width / state.height;
+      state.camera.aspect = w / h;
+      var o = state.viewOffset.slice(0, 2);
+      o.some(function (n) {
+        return n;
+      }) && (_state$camera = state.camera).setViewOffset.apply(_state$camera, [w, h].concat(_toConsumableArray(o), [w, h]));
       state.camera.updateProjectionMatrix();
     }
+    if (changedProps.hasOwnProperty('viewOffset')) {
+      var _state$camera2;
+      var _w = state.width;
+      var _h = state.height;
+      var _o = state.viewOffset.slice(0, 2);
+      _o.some(function (n) {
+        return n;
+      }) ? (_state$camera2 = state.camera).setViewOffset.apply(_state$camera2, [_w, _h].concat(_toConsumableArray(_o), [_w, _h])) : state.camera.clearViewOffset();
+    }
     if (changedProps.hasOwnProperty('skyRadius') && state.skyRadius) {
       state.controls.hasOwnProperty('maxDistance') && changedProps.skyRadius && (state.controls.maxDistance = Math.min(state.controls.maxDistance, state.skyRadius));
       state.camera.far = state.skyRadius * 2.5;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "three-render-objects",
-  "version": "1.38.1",
+  "version": "1.39.1",
   "description": "Easy way to render ThreeJS objects with built-in interaction defaults",
   "license": "MIT",
   "type": "module",
@@ -55,19 +55,19 @@
     "three": ">=0.168"
   },
   "devDependencies": {
-    "@babel/core": "^7.26.0",
-    "@babel/preset-env": "^7.26.0",
+    "@babel/core": "^7.26.9",
+    "@babel/preset-env": "^7.26.9",
     "@rollup/plugin-babel": "^6.0.4",
     "@rollup/plugin-commonjs": "^28.0.2",
     "@rollup/plugin-node-resolve": "^16.0.0",
     "@rollup/plugin-terser": "^0.4.4",
-    "@types/react": "^19.0.7",
-    "postcss": "^8.5.1",
+    "@types/react": "^19.0.10",
+    "postcss": "^8.5.2",
     "rimraf": "^6.0.1",
-    "rollup": "^4.30.1",
+    "rollup": "^4.34.8",
     "rollup-plugin-dts": "^6.1.1",
     "rollup-plugin-postcss": "^4.0.2",
-    "three": "^0.172.0",
+    "three": "^0.173.0",
     "typescript": "^5.7.3"
   },
   "engines": {