@ifiwas/standard-view 2.0.0

package/lib/utils/performance.js

@@ -0,0 +1,114 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.performanceEnd = performanceEnd;
+exports.performanceLog = performanceLog;
+exports.performanceStart = performanceStart;
+// performance.tsx
+
+/**
+ * Performance Check Timers
+ * Aggregates timers that execute multiple times with the same name.
+ * Handles multiple concurrent timers with different names.
+ * Cannot aggregate multiple concurrent timers with the same name.
+ *
+ * Usage:
+ *    - Place performanceStart("timer name") at the beginning.
+ *    - Place performanceEnd("timer name") at the end.
+ *    - For multiple timers, names must be unique.
+ *    - stopwatchMode allows for printing total performance time
+ *    at each occurence of performanceEnd without having to
+ *    create new performanceStart's. Default is false.
+ *    - Place performanceLog("timer name") after recording with
+ *    performanceStart and performanceEnd to print results.
+ */
+
+var timers = {};
+function performanceStart() {
+  var name = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "no name";
+  var stopwatchMode = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+  // Timer Already Exists
+  if (timers[name]) {
+    var timer = timers[name];
+
+    // Timer Already Running
+    if (timer.running) {
+      console.warn("".concat(name, " is already running! Cannot start another timer with the same name."));
+      return;
+    }
+
+    // Start Timer
+    timer.running = true;
+    timer.start = performance.now();
+    return;
+  }
+
+  // New Timer
+  timers[name] = {
+    start: 0,
+    count: 0,
+    total: 0,
+    average: 0,
+    running: true,
+    stopwatchMode: stopwatchMode
+  };
+  timers[name].start = performance.now();
+}
+function performanceEnd() {
+  var name = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "no name";
+  var end = performance.now();
+
+  // Timer Never Started
+  if (timers[name] == null) {
+    console.warn("Timer ".concat(name, " does not exist. Make sure to place performanceStart(\"timer name\") before performanceEnd(\"timer name\")!"));
+    return;
+  }
+  var timer = timers[name];
+  if (!timer.running) {
+    console.warn("Timer ".concat(name, " not running. Make sure to place performanceStart(\"timer name\") before performanceEnd(\"timer name\")!"));
+    return;
+  }
+
+  // End Timer
+  var time = end - timer.start;
+  timer.count++;
+  timer.total += time;
+  timer.average = timer.total / timer.count;
+
+  // Stopwatch Mode
+  if (timer.stopwatchMode) {
+    /* eslint-disable-next-line no-console */
+    console.log("".concat(name, ": total ").concat(timer.total, ", average ").concat(timer.average, ", runs ").concat(timer.count));
+    timer.start = performance.now();
+  } else {
+    timer.running = false;
+  }
+}
+function performanceLog() {
+  var name = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "no name";
+  var print = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+  // Timer Never Recorded
+  if (timers[name] == null) {
+    console.warn("Timer ".concat(name, " never recorded. Make sure to place performanceStart(\"timer name\") and performanceEnd(\"timer name\") before performanceLog(\"timer name\")!"));
+    return {
+      average: 0,
+      total: 0,
+      count: 0
+    };
+  }
+  var _timers$name = timers[name],
+    count = _timers$name.count,
+    total = _timers$name.total,
+    average = _timers$name.average;
+  if (print) {
+    /* eslint-disable-next-line no-console */
+    console.log("\x1B[36m ".concat(name, "\t \x1B[33m average: ").concat(average, "\t \x1B[31m total: ").concat(total, "\t \x1B[92m count: ").concat(count));
+  }
+  return {
+    average: average,
+    total: total,
+    count: count
+  };
+}

package/lib/utils/styles.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DEFAULT_HIGHLIGHT_COLOR = exports.DEFAULT_COLOR = void 0;
+// styles.js
+
+var DEFAULT_COLOR = exports.DEFAULT_COLOR = "gray";
+var DEFAULT_HIGHLIGHT_COLOR = exports.DEFAULT_HIGHLIGHT_COLOR = "yellow";

package/lib/utils/util.d.ts

@@ -0,0 +1,76 @@
+import * as THREE from 'three';
+/**
+ * getAlignmentOffset
+ *
+ * Given an old anchor position and new anchor position as strings,
+ * for example, oldAnchor: "right"  and newAnchor: "center",
+ * and also optional current position, diagonal, and scale,
+ * getAlignmentOffset will provide the new position.
+ *
+ * diagonal is the displacement between the boundingBox.min
+ * and boundingBox.max or any other displacement between
+ * the min and max corners. This is necessary for Labels and Text,
+ * where the fundamental geometry is not to unit scale of [1, 1, 1].
+ *
+ * In general, it is better to apply getAlignmentOffset on
+ * unit geometry before scaling.
+ */
+export declare function getAlignmentOffset(oldAnchor: string, newAnchor: string, diagonal?: Array<number>): Array<number>;
+/**
+ * reconcileSynonymousProps
+ *
+ * Given the correct type, synonymous prop key value pairs are removed.
+ * If correctly named prop does not exist, value is extracted from
+ * synonymous props and assigned to the correctly named prop, then
+ * synonymous props are removed.
+ *
+ * This functions mutates props!
+ */
+export declare function reconcileSynonymousProps(props: any, synonymousProps: Record<string, string>[], correctType: string, opposite?: boolean): void;
+export declare function areArraysEqual(array1: any, array2: any): boolean;
+/**
+ * FPS
+ */
+export declare const FPS: import("react").NamedExoticComponent<object>;
+/**
+ * RGBStringToNumber
+ */
+export declare function RGBStringToNumber(rgbString: any): {
+    r: number;
+    g: number;
+    b: number;
+};
+/**
+ * numberToRGBString
+ */
+export declare function numberToRGBString(r: any, g: any, b: any): string;
+/**
+ * objectToArray
+ * returns obj if already an array
+ * default is [0, 0, 0]
+ * default is array of all zeros for custom order with more than 3 components
+ */
+export declare function objectToArray(obj: any, order?: string): Array<number>;
+/**
+ * arrayToObject
+ * returns array if already an object with fields x, y, and z
+ * default is { x: 0, y: 0, z: 0 }
+ * default is an object with all zero value components for custom order
+ */
+export declare function arrayToObject(array: any, order?: string): any;
+/**
+ * arrayToQuaternion
+ * return THREE.Quaternion if already THREE.Quaternion
+ */
+export declare function toQuaternion(obj: any, order?: string): THREE.Quaternion;
+/**
+ * filterArrayLength
+ */
+export declare function filterArrayLength(array: any, length?: number, defaultArray?: number[]): Array<number> | undefined;
+/**
+ * billboard
+ */
+export declare function billboard({ mesh, camera }: {
+    mesh: any;
+    camera: any;
+}): void;

package/lib/utils/util.js

@@ -0,0 +1,290 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FPS = void 0;
+exports.RGBStringToNumber = RGBStringToNumber;
+exports.areArraysEqual = areArraysEqual;
+exports.arrayToObject = arrayToObject;
+exports.billboard = billboard;
+exports.filterArrayLength = filterArrayLength;
+exports.getAlignmentOffset = getAlignmentOffset;
+exports.numberToRGBString = numberToRGBString;
+exports.objectToArray = objectToArray;
+exports.reconcileSynonymousProps = reconcileSynonymousProps;
+exports.toQuaternion = toQuaternion;
+var THREE = _interopRequireWildcard(require("three"));
+var _react = require("react");
+var _drei = require("@react-three/drei");
+var _constants = require("./constants");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _construct(t, e, r) { if (_isNativeReflectConstruct()) return Reflect.construct.apply(null, arguments); var o = [null]; o.push.apply(o, e); var p = new (t.bind.apply(t, o))(); return r && _setPrototypeOf(p, r.prototype), p; }
+function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+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) : void 0; } }
+function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
+function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; } // util.ts
+/**
+ * getAlignmentOffset
+ *
+ * Given an old anchor position and new anchor position as strings,
+ * for example, oldAnchor: "right"  and newAnchor: "center",
+ * and also optional current position, diagonal, and scale,
+ * getAlignmentOffset will provide the new position.
+ *
+ * diagonal is the displacement between the boundingBox.min
+ * and boundingBox.max or any other displacement between
+ * the min and max corners. This is necessary for Labels and Text,
+ * where the fundamental geometry is not to unit scale of [1, 1, 1].
+ *
+ * In general, it is better to apply getAlignmentOffset on
+ * unit geometry before scaling.
+ */
+function getAlignmentOffset(oldAnchor, newAnchor) {
+  var diagonal = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [1, 1, 1];
+  var posVec = new THREE.Vector3();
+  diagonal.map(function (val, index) {
+    /* eslint-disable-next-line no-param-reassign */
+    diagonal[index] = Math.abs(val);
+    return null;
+  });
+  var diagonalVec = _construct(THREE.Vector3, _toConsumableArray(diagonal));
+  var oldAnchorVec = _constants.ANCHORS[_constants.ANCHOR_SYNONYMS[oldAnchor]];
+  var newAnchorVec = _constants.ANCHORS[_constants.ANCHOR_SYNONYMS[newAnchor]];
+  var offset = oldAnchorVec.clone().sub(newAnchorVec);
+  posVec.add(offset.multiply(diagonalVec));
+  return [posVec.x, posVec.y, posVec.z];
+}
+
+/**
+ * reconcileSynonymousProps
+ *
+ * Given the correct type, synonymous prop key value pairs are removed.
+ * If correctly named prop does not exist, value is extracted from
+ * synonymous props and assigned to the correctly named prop, then
+ * synonymous props are removed.
+ *
+ * This functions mutates props!
+ */
+function reconcileSynonymousProps(/* eslint-disable @typescript-eslint/no-explicit-any */
+props, synonymousProps, /* eslint-enable @typescript-eslint/no-explicit-any */
+correctType) {
+  var opposite = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false;
+  // Ensure props is an object
+  if (!props || _typeof(props) !== 'object') {
+    return;
+  }
+  synonymousProps.map(function (propNames) {
+    var correctName = propNames[correctType];
+    var synnonyms = Object.values(propNames).filter(function (name) {
+      return name !== correctName;
+    });
+
+    // Assign Synnonymous Prop
+    if (props[correctName] == null) {
+      /* eslint-disable no-restricted-syntax */
+      // loop
+      var _iterator = _createForOfIteratorHelper(synnonyms),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var synnonym = _step.value;
+          if (props[synnonym] != null) {
+            /* eslint-disable-next-line no-param-reassign */
+            props[correctName] = opposite ? !props[synnonym] : props[synnonym];
+            break;
+          }
+        }
+        /* eslint-enable no-restricted-syntax */
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+    }
+    // Delete Synnonymous Props
+    /* eslint-disable no-restricted-syntax */
+    var _iterator2 = _createForOfIteratorHelper(synnonyms),
+      _step2;
+    try {
+      for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+        var _synnonym = _step2.value;
+        /* eslint-disable-next-line no-param-reassign */
+        delete props[_synnonym];
+      }
+      /* eslint-enable no-restricted-syntax */
+    } catch (err) {
+      _iterator2.e(err);
+    } finally {
+      _iterator2.f();
+    }
+    return null;
+  });
+}
+function areArraysEqual(array1, array2) {
+  return Array.isArray(array1) && Array.isArray(array2) && array1.length === array2.length && array1[0] === array2[0] && array1[1] === array2[1] && array1[2] === array2[2];
+}
+
+/**
+ * FPS
+ */
+var FPS = exports.FPS = /*#__PURE__*/(0, _react.memo)(function FPS() {
+  return /*#__PURE__*/React.createElement(_drei.Stats, {
+    showPanel: 0,
+    className: "fps-stats"
+  });
+});
+FPS.displayName = 'FPS';
+
+/**
+ * RGBStringToNumber
+ */
+function RGBStringToNumber(rgbString) {
+  var _rgbString$split = rgbString.split(/[,()]/),
+    _rgbString$split2 = _slicedToArray(_rgbString$split, 4),
+    r = _rgbString$split2[1],
+    g = _rgbString$split2[2],
+    b = _rgbString$split2[3];
+  r = parseInt(r, 10);
+  g = parseInt(g, 10);
+  b = parseInt(b, 10);
+  return {
+    r: r,
+    g: g,
+    b: b
+  };
+}
+
+/**
+ * numberToRGBString
+ */
+function numberToRGBString(r, g, b) {
+  return "RGB(".concat(r, ", ").concat(g, ", ").concat(b, ")");
+}
+
+/**
+ * objectToArray
+ * returns obj if already an array
+ * default is [0, 0, 0]
+ * default is array of all zeros for custom order with more than 3 components
+ */
+function objectToArray(obj) {
+  var order = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'xyz';
+  // Object is an Array
+  if (Array.isArray(obj)) {
+    return obj;
+  }
+
+  // Convert object to array of numbers
+  var array = [];
+  /* eslint-disable no-restricted-syntax */
+  var _iterator3 = _createForOfIteratorHelper(order.split('')),
+    _step3;
+  try {
+    for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
+      var component = _step3.value;
+      // Object with any missing components yields default
+      if (Number.isNaN(obj[component])) {
+        return Array(order.length).fill(0);
+      }
+      array.push(obj[component]);
+    }
+    /* eslint-enable no-restricted-syntax */
+  } catch (err) {
+    _iterator3.e(err);
+  } finally {
+    _iterator3.f();
+  }
+  return array;
+}
+
+/**
+ * arrayToObject
+ * returns array if already an object with fields x, y, and z
+ * default is { x: 0, y: 0, z: 0 }
+ * default is an object with all zero value components for custom order
+ */
+/* eslint-disable @typescript-eslint/no-explicit-any */
+function arrayToObject(array) {
+  var order = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'xyz';
+  var obj = {};
+  /* eslint-enable @typescript-eslint/no-explicit-any */
+
+  // Not an Array or does not have enough elements
+  if (!Array.isArray(array) || array.length < order.length) {
+    order.split('').map(function (component) {
+      obj[component] = 0;
+      return null;
+    });
+    return obj;
+  }
+
+  // Convert array to object
+  order.split('').map(function (component, index) {
+    obj[component] = array[index];
+    return null;
+  });
+  return obj;
+}
+
+/**
+ * arrayToQuaternion
+ * return THREE.Quaternion if already THREE.Quaternion
+ */
+function toQuaternion(obj) {
+  var order = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'xyzw';
+  var quaternion = {
+    x: 0,
+    y: 0,
+    z: 0,
+    w: 1
+  };
+  if (Array.isArray(obj) && obj.length === 4) {
+    // Array
+    order.split('').map(function (component, i) {
+      quaternion[component] = obj[i];
+      return null;
+    });
+  } else {
+    // Object
+    order.split('').map(function (component) {
+      if (obj[component] == null) {
+        console.warn("[toQuaternion] argument does not have component: ".concat(component, ". Default Quaternion(0, 0, 0, 1) returned."));
+        return new THREE.Quaternion();
+      }
+      quaternion[component] = obj[component];
+      return null;
+    });
+  }
+  return new THREE.Quaternion(quaternion.x, quaternion.y, quaternion.z, quaternion.w);
+}
+
+/**
+ * filterArrayLength
+ */
+function filterArrayLength(array) {
+  var length = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 3;
+  var defaultArray = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [0, 0, 0];
+  return Array.isArray(array) && array.length === length ? array : defaultArray;
+}
+
+/**
+ * billboard
+ */
+function billboard(_ref) {
+  var mesh = _ref.mesh,
+    camera = _ref.camera;
+  mesh.current.lookAt(camera.position);
+  /* eslint-disable-next-line no-param-reassign */
+  mesh.current.up = camera.up;
+}

package/lib/views/ContextBridge.d.ts

@@ -0,0 +1,23 @@
+import * as React from "react";
+/**
+ * GeneraterContextListeners
+ *
+ * Create a ContextListener for each context in the given contexts array.
+ * Each ContextListener must be a outside the @react-three/fiber's Canvas
+ * component to detect the context values ContextListener and changes
+ * the value in the values array.
+ * the useContext hook in each ContextListener.
+ * This allows the context changes to be captured and passed into the
+ * ContextBridge.
+ */
+export declare function GenerateContextListeners(contexts: Array<React.Context<any>>, values: Array<any>): Array<React.ReactNode>;
+type ContextBridgeProps = {
+    contexts?: Array<React.Context<any>>;
+    values?: Array<any>;
+    children?: any;
+};
+/**
+ * ContextBridge
+ */
+export declare const ContextBridge: React.NamedExoticComponent<ContextBridgeProps>;
+export {};

package/lib/views/ContextBridge.js

@@ -0,0 +1,98 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ContextBridge = void 0;
+exports.GenerateContextListeners = GenerateContextListeners;
+var React = _interopRequireWildcard(require("react"));
+var _fiber = require("@react-three/fiber");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+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) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; } // ContextBridge.tsx
+var useState = React.useState,
+  useContext = React.useContext,
+  memo = React.memo;
+/**
+ * ContextListener
+ */
+function ContextListener(_ref) {
+  var context = _ref.context,
+    values = _ref.values,
+    index = _ref.index;
+  // Safety checks
+  if (!context || !values || !Array.isArray(values) || typeof index !== 'number') {
+    return null;
+  }
+
+  /* eslint-disable no-param-reassign */
+  values[index] = useContext(context);
+  /* eslint-enable no-param-reassign */
+  return null;
+}
+
+/**
+ * GeneraterContextListeners
+ *
+ * Create a ContextListener for each context in the given contexts array.
+ * Each ContextListener must be a outside the @react-three/fiber's Canvas
+ * component to detect the context values ContextListener and changes
+ * the value in the values array.
+ * the useContext hook in each ContextListener.
+ * This allows the context changes to be captured and passed into the
+ * ContextBridge.
+ */
+function GenerateContextListeners(/* eslint-disable @typescript-eslint/no-explicit-any */
+contexts, values) {
+  // Safety checks
+  if (!contexts || !Array.isArray(contexts) || !values || !Array.isArray(values)) {
+    return [];
+  }
+
+  /* eslint-disable react/no-array-index-key */
+  var contextListeners = contexts.map(/* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+  function (context, index) {
+    return /*#__PURE__*/React.createElement(ContextListener, {
+      context: context,
+      values: values,
+      index: index,
+      key: index
+    });
+  });
+  /* eslint-enable react/no-array-index-key */
+  return contextListeners;
+}
+/**
+ * ContextBridge
+ */
+var ContextBridge = exports.ContextBridge = memo(function ContextBridge(_ref2) {
+  var contexts = _ref2.contexts,
+    values = _ref2.values,
+    children = _ref2.children;
+  var _useState = useState(0),
+    _useState2 = _slicedToArray(_useState, 2),
+    update = _useState2[1];
+  // Context Updater
+  // Always trigger a rerender here and trust that
+  // Context.Provider will only rerender when value
+  // has changed
+  (0, _fiber.useFrame)(function () {
+    return update(function (prev) {
+      return prev + 1;
+    });
+  });
+  if (!contexts || !values) {
+    return /*#__PURE__*/React.createElement(React.Fragment, null, children);
+  }
+  return contexts.reduce(function (child, Context, index) {
+    return /*#__PURE__*/React.createElement(Context.Provider, {
+      value: values[index]
+    }, child);
+  }, children);
+});
+ContextBridge.displayName = "ContextBridge";

package/lib/views/SceneCamera.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+interface SceneCameraProps {
+    camera?: any;
+    orthographic?: boolean;
+}
+declare const SceneCameraMemo: React.NamedExoticComponent<SceneCameraProps>;
+export default SceneCameraMemo;

package/lib/views/SceneCamera.js

@@ -0,0 +1,52 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _drei = require("@react-three/drei");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } // SetControls.tsx
+var useEffect = React.useEffect,
+  useState = React.useState,
+  useMemo = React.useMemo,
+  memo = React.memo;
+/**
+ * SceneCamera
+ *
+ * @param {SceneCameraProps} props
+ */
+var SceneCamera = function SceneCamera(_ref) {
+  var camera = _ref.camera,
+    orthographic = _ref.orthographic;
+  var useCustomCamera = useMemo(function updateUpdateDefaultCamera() {
+    // No Camera Props
+    if (camera == null) {
+      return true;
+    }
+    if (camera.updateDefaultCamera != null) {
+      return camera.updateDefaultCamera;
+    } else if (
+    // Fixed orthographic left, right, top, bottom
+    orthographic && (camera.left != null || camera.right != null || camera.top != null || camera.bottom != null)) {
+      return false;
+    } else if (!orthographic && camera.aspect != null) {
+      // Fixed aspect
+      return false;
+    } else {
+      return true;
+    }
+  }, [camera, orthographic]);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, useCustomCamera && orthographic ? /*#__PURE__*/React.createElement(React.Fragment, null, "Orthographics", /*#__PURE__*/React.createElement(_drei.OrthographicCamera, _extends({
+    makeDefault: true,
+    position: camera.position
+  }, camera))) : /*#__PURE__*/React.createElement(React.Fragment, null, "Perspective", /*#__PURE__*/React.createElement(_drei.PerspectiveCamera, _extends({
+    makeDefault: true,
+    position: camera.position
+  }, camera))));
+};
+var SceneCameraMemo = memo(SceneCamera);
+SceneCameraMemo.displayName = 'SceneCamera';
+var _default = exports["default"] = SceneCameraMemo;