@ifiwas/standard-view 2.0.0

package/lib/groups/FBX.js

@@ -0,0 +1,213 @@
+"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 THREE = _interopRequireWildcard(require("three"));
+var _FBXLoader = require("three/examples/jsm/loaders/FBXLoader");
+var _hooks = require("../utils/hooks");
+var _Group = _interopRequireDefault(require("./Group"));
+var _primitives = require("../primitives");
+var _excluded = ["color"],
+  _excluded2 = ["fbxPath", "fbxURL", "actionIndex", "view3DEnvMap", "castShadow", "receiveShadow"];
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+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); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return 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; } // FBX.tsx
+function updateAllMaterials(color, /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+children, /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+materialProps) {
+  if (children == null) {
+    return;
+  }
+  var _children = Array.isArray(children) ? children : [children];
+  _children.map(function (object) {
+    // Recurse into Groups
+    if (object.constructor.name === "Group" && object.children) {
+      updateAllMaterials(color, object.children, materialProps);
+    }
+
+    // @ts-ignore:TS2339 material does not exist on Object3D
+    if (object.material) {
+      if (color) {
+        // @ts-ignore:TS2339 material does not exist on Object3D
+        object.material.color.set(color);
+      }
+      Object.entries(materialProps).map(function (_ref) {
+        var _ref2 = _slicedToArray(_ref, 2),
+          propName = _ref2[0],
+          value = _ref2[1];
+        /* eslint-disable no-param-reassign */
+        // @ts-ignore:TS2339 material does not exist on Object3D
+        object.material[propName] = value;
+        /* eslint-enable no-param-reassign */
+        return null;
+      });
+    }
+    return null;
+  });
+}
+function loadFBX(_ref3) {
+  var group = _ref3.group,
+    fbxPath = _ref3.fbxPath,
+    fbxURL = _ref3.fbxURL,
+    mixer = _ref3.mixer,
+    envMap = _ref3.envMap,
+    castShadow = _ref3.castShadow,
+    receiveShadow = _ref3.receiveShadow,
+    materialProps = _ref3.materialProps,
+    _ref3$actionIndex = _ref3.actionIndex,
+    actionIndex = _ref3$actionIndex === void 0 ? 0 : _ref3$actionIndex;
+  // No FBX
+  if (fbxURL == null) {
+    /* eslint-disable no-console */
+    console.warn("[FBX] No fbxURL");
+    /* eslint-enable no-console */
+    return;
+  }
+
+  // FBX
+  var fbxLoader = new _FBXLoader.FBXLoader();
+  fbxLoader.setPath(fbxPath);
+  /* eslint-disable-next-line @typescript-eslint/no-explicit-any */
+  fbxLoader.load(fbxURL, function (fbx) {
+    if (group.current && fbx) {
+      // Remove Loading Label or Previous OBJ
+      if (group.current.children) {
+        group.current.children.map(function (child) {
+          return group.current.remove(child);
+        });
+      }
+
+      // Material Props
+      if (materialProps) {
+        var color = materialProps.color,
+          otherMaterialProps = _objectWithoutProperties(materialProps, _excluded);
+        updateAllMaterials(color, fbx.scene.children, otherMaterialProps);
+      }
+
+      // Animation
+      /* eslint-disable-next-line no-param-reassign */
+      mixer.current = new THREE.AnimationMixer(fbx);
+      if (fbx.animations && fbx.animations.length > 0) {
+        var action = mixer.current.clipAction(fbx.animations[actionIndex]);
+        action.play();
+      }
+
+      // Env Map + Shadows
+      fbx.traverse(function (mesh) {
+        /* eslint-disable no-param-reassign */
+        // @ts-ignore
+        if (mesh.isMesh) {
+          if (envMap) {
+            // @ts-ignore
+            mesh.material.envMap = envMap;
+          }
+          mesh.castShadow = castShadow;
+          mesh.receiveShadow = receiveShadow;
+        }
+        /* eslint-enable no-param-reassign */
+      });
+
+      // Add FBX
+      group.current.add(fbx);
+    }
+  });
+}
+var FBX = function FBX(_ref4) {
+  var _ref4$fbxPath = _ref4.fbxPath,
+    fbxPath = _ref4$fbxPath === void 0 ? "" : _ref4$fbxPath,
+    fbxURL = _ref4.fbxURL,
+    _ref4$actionIndex = _ref4.actionIndex,
+    actionIndex = _ref4$actionIndex === void 0 ? 0 : _ref4$actionIndex,
+    _ref4$view3DEnvMap = _ref4.view3DEnvMap,
+    view3DEnvMap = _ref4$view3DEnvMap === void 0 ? false : _ref4$view3DEnvMap,
+    _ref4$castShadow = _ref4.castShadow,
+    castShadow = _ref4$castShadow === void 0 ? false : _ref4$castShadow,
+    _ref4$receiveShadow = _ref4.receiveShadow,
+    receiveShadow = _ref4$receiveShadow === void 0 ? false : _ref4$receiveShadow,
+    otherProps = _objectWithoutProperties(_ref4, _excluded2);
+  var group = (0, _react.useRef)(null);
+  var mixer = (0, _react.useRef)(null);
+  var _useViewContext = (0, _hooks.useViewContext)(),
+    envMap = _useViewContext.envMap;
+
+  // Material Props
+  var materialProps = (0, _react.useMemo)(function updateMaterialProps() {
+    // No Material Props
+    if (!otherProps || Object.keys(otherProps).length === 0) {
+      return undefined;
+    }
+
+    // Acceptable Material Props
+    var materialPropsKeys = ["color", "wireframe", "opacity", "transparent", "side", "depthWrite", "depthTest"];
+
+    // Extract Acceptable Props
+    var props = {};
+    materialPropsKeys.map(function (propName) {
+      if (otherProps[propName]) {
+        props[propName] = otherProps[propName];
+      }
+      return null;
+    });
+    return Object.keys(props).length > 0 ? props : undefined;
+  }, [otherProps]);
+
+  // Environment Map
+  var _envMap = (0, _react.useMemo)(function updateEnvMap() {
+    if (view3DEnvMap) {
+      return envMap;
+    }
+    return null;
+  }, [view3DEnvMap, envMap]);
+
+  // Loading Text
+  var loadingText = (0, _react.useMemo)(function updateLoadText() {
+    return fbxURL || "No fbxURL";
+  }, [fbxURL]);
+
+  // Load FBX and Animation Mixer
+  (0, _react.useEffect)(function updateFBXandMixer() {
+    if (group) {
+      loadFBX({
+        group: group,
+        fbxPath: fbxPath,
+        fbxURL: fbxURL,
+        mixer: mixer,
+        envMap: _envMap,
+        castShadow: castShadow,
+        receiveShadow: receiveShadow,
+        materialProps: materialProps,
+        actionIndex: actionIndex
+      });
+    }
+  }, [group, fbxPath, fbxURL, actionIndex, _envMap, castShadow, receiveShadow, materialProps]);
+
+  // Animation Mixer Update
+  var clock = new THREE.Clock();
+  (0, _hooks.useFrame)(function updateMixer() {
+    var delta = clock.getDelta();
+    if (mixer.current) {
+      mixer.current.update(delta);
+    }
+  });
+  return /*#__PURE__*/_react["default"].createElement(_Group["default"], _extends({
+    ref: group
+  }, otherProps), /*#__PURE__*/_react["default"].createElement(_primitives.Label, {
+    text: loadingText,
+    textColor: "red"
+  }));
+};
+var FBXMemo = /*#__PURE__*/(0, _react.memo)(FBX);
+FBXMemo.displayName = "FBX";
+var _default = exports["default"] = FBXMemo;

package/lib/groups/GLTF.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { GroupProps } from './Group';
+interface GLTFProps extends GroupProps {
+    gltfPath?: string;
+    gltfURL: string;
+    dracoDecoderPath?: string;
+}
+declare const GLTFMemo: React.NamedExoticComponent<GLTFProps>;
+export default GLTFMemo;

package/lib/groups/GLTF.js

@@ -0,0 +1,198 @@
+"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 _GLTFLoader = require("three/examples/jsm/loaders/GLTFLoader");
+var _DRACOLoader = require("three/examples/jsm/loaders/DRACOLoader");
+var _Label = _interopRequireDefault(require("../primitives/Label"));
+var _Group = _interopRequireDefault(require("./Group"));
+var _hooks = require("../utils/hooks");
+var _excluded = ["color"],
+  _excluded2 = ["gltfPath", "gltfURL", "dracoDecoderPath", "view3DEnvMap", "castShadow", "receiveShadow"];
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+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); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return 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; } // GLTF.tsx
+var useEffect = React.useEffect,
+  useMemo = React.useMemo,
+  useRef = React.useRef,
+  memo = React.memo;
+var DRACO_DECODER_SOURCE = 'https://raw.githubusercontent.com/mrdoob/three.js/master/examples/jsm/libs/draco/';
+function updateAllMaterials(color, /* eslint-disable @typescript-eslint/no-explicit-any */
+children, materialProps) {
+  if (children == null) {
+    return;
+  }
+  var _children = Array.isArray(children) ? children : [children];
+  _children.map(function (object) {
+    // Recurse into Groups
+    if (object.constructor.name === 'Group' && object.children) {
+      updateAllMaterials(color, object.children, materialProps);
+    }
+
+    // @ts-ignore:TS2339 material does not exist on Object3D
+    if (object.material) {
+      if (color) {
+        // @ts-ignore:TS2339 material does not exist on Object3D
+        object.material.color.set(color);
+      }
+      Object.entries(materialProps).map(function (_ref) {
+        var _ref2 = _slicedToArray(_ref, 2),
+          propName = _ref2[0],
+          value = _ref2[1];
+        /* eslint-disable no-param-reassign */
+        // @ts-ignore:TS2339 material does not exist on Object3D
+        object.material[propName] = value;
+        /* eslint-enable no-param-reassign */
+        return null;
+      });
+    }
+    return null;
+  });
+}
+function loadGLTF(_ref3) {
+  var group = _ref3.group,
+    gltfPath = _ref3.gltfPath,
+    gltfURL = _ref3.gltfURL,
+    dracoDecoderPath = _ref3.dracoDecoderPath,
+    envMap = _ref3.envMap,
+    castShadow = _ref3.castShadow,
+    receiveShadow = _ref3.receiveShadow,
+    materialProps = _ref3.materialProps;
+  // No GLTF
+  if (gltfURL == null) {
+    /* eslint-disable no-console */
+    console.warn('[GLTF] No gltfURL');
+    /* eslint-enable no-console */
+    return;
+  }
+
+  // GLTF
+  var gltfLoader = new _GLTFLoader.GLTFLoader();
+  var dracoLoader = new _DRACOLoader.DRACOLoader();
+  dracoLoader.setDecoderPath(dracoDecoderPath);
+  gltfLoader.setDRACOLoader(dracoLoader);
+  gltfLoader.setPath(gltfPath);
+  gltfLoader.load(gltfURL, function (gltf) {
+    if (group.current && gltf.scene && gltf.scene.children) {
+      // Remove Loading Label or Previous OBJ
+      if (group.current.children) {
+        group.current.children.map(function (child) {
+          return group.current.remove(child);
+        });
+      }
+
+      // Material Props
+      if (materialProps) {
+        var color = materialProps.color,
+          otherMaterialProps = _objectWithoutProperties(materialProps, _excluded);
+        updateAllMaterials(color, gltf.scene.children, otherMaterialProps);
+      }
+
+      // Env Map + Shadows
+      gltf.scene.traverse(function (mesh) {
+        /* eslint-disable no-param-reassign */
+        // @ts-ignore
+        if (mesh.isMesh) {
+          if (envMap) {
+            // @ts-ignore
+            mesh.material.envMap = envMap;
+          }
+          mesh.castShadow = castShadow;
+          mesh.receiveShadow = receiveShadow;
+        }
+        /* eslint-enable no-param-reassign */
+      });
+
+      // Add GLTF
+      group.current.add(gltf.scene);
+    }
+  });
+}
+var GLTF = function GLTF(_ref4) {
+  var _ref4$gltfPath = _ref4.gltfPath,
+    gltfPath = _ref4$gltfPath === void 0 ? '' : _ref4$gltfPath,
+    gltfURL = _ref4.gltfURL,
+    _ref4$dracoDecoderPat = _ref4.dracoDecoderPath,
+    dracoDecoderPath = _ref4$dracoDecoderPat === void 0 ? DRACO_DECODER_SOURCE : _ref4$dracoDecoderPat,
+    _ref4$view3DEnvMap = _ref4.view3DEnvMap,
+    view3DEnvMap = _ref4$view3DEnvMap === void 0 ? false : _ref4$view3DEnvMap,
+    _ref4$castShadow = _ref4.castShadow,
+    castShadow = _ref4$castShadow === void 0 ? false : _ref4$castShadow,
+    _ref4$receiveShadow = _ref4.receiveShadow,
+    receiveShadow = _ref4$receiveShadow === void 0 ? false : _ref4$receiveShadow,
+    otherProps = _objectWithoutProperties(_ref4, _excluded2);
+  var group = useRef(null);
+  var _useViewContext = (0, _hooks.useViewContext)(),
+    envMap = _useViewContext.envMap;
+
+  // Material Props
+  var materialProps = useMemo(function updateMaterialProps() {
+    // No Material Props
+    if (!otherProps || Object.keys(otherProps).length === 0) {
+      return undefined;
+    }
+
+    // Acceptable Material Props
+    var materialPropsKeys = ['color', 'wireframe', 'opacity', 'transparent', 'side', 'depthWrite', 'depthTest'];
+
+    // Extract Acceptable Props
+    var props = {};
+    materialPropsKeys.map(function (propName) {
+      if (otherProps[propName]) {
+        props[propName] = otherProps[propName];
+      }
+      return null;
+    });
+    return Object.keys(props).length > 0 ? props : undefined;
+  }, [otherProps]);
+
+  // Environment Map
+  var _envMap = useMemo(function updateEnvMap() {
+    if (view3DEnvMap) {
+      return envMap;
+    }
+    return null;
+  }, [view3DEnvMap, envMap]);
+
+  // Loading Text
+  var loadingText = useMemo(function updateLoadText() {
+    return gltfURL || 'No gltfURL';
+  }, [gltfURL]);
+
+  // Load GLTF
+  useEffect(function updateGLTF() {
+    if (group) {
+      loadGLTF({
+        group: group,
+        gltfPath: gltfPath,
+        gltfURL: gltfURL,
+        dracoDecoderPath: dracoDecoderPath,
+        envMap: _envMap,
+        castShadow: castShadow,
+        receiveShadow: receiveShadow,
+        materialProps: materialProps
+      });
+    }
+  }, [group, gltfPath, gltfURL, dracoDecoderPath, _envMap, castShadow, receiveShadow, materialProps]);
+  return /*#__PURE__*/React.createElement(_Group["default"], _extends({
+    ref: group
+  }, otherProps), /*#__PURE__*/React.createElement(_Label["default"], {
+    text: loadingText,
+    textColor: "red"
+  }));
+};
+var GLTFMemo = memo(GLTF);
+GLTFMemo.displayName = 'GLTF';
+var _default = exports["default"] = GLTFMemo;

package/lib/groups/Group.d.ts

@@ -0,0 +1,63 @@
+import * as React from "react";
+import * as THREE from "three";
+export interface GroupProps {
+    position?: Array<number>;
+    scale?: Array<number>;
+    rotation?: Array<number>;
+    eulerOrder?: string;
+    normal?: Array<number>;
+    roll?: number;
+    up?: Array<number>;
+    quaternion?: Array<number> | THREE.Quaternion;
+    materialType?: string;
+    edges?: boolean;
+    edgeColor?: string;
+    edgeThresholdAngle?: number;
+    view3DEnvMap?: boolean;
+    color?: string | THREE.Color;
+    hoverColor?: string;
+    opacity?: number;
+    transparent?: boolean;
+    wireframe?: boolean;
+    visible?: boolean;
+    side?: string | THREE.Side;
+    castShadow?: boolean;
+    receiveShadow?: boolean;
+    groupMember?: boolean;
+    animation?: Function;
+    state?: object;
+    ref?: React.Ref<any>;
+    onClick?: Function;
+    onDoubleClick?: Function;
+    onWheel?: Function;
+    onPointerUp?: Function;
+    onPointerDown?: Function;
+    onPointerOver?: Function;
+    onPointerOut?: Function;
+    onPointerMove?: Function;
+    hoverable?: boolean;
+    mousePropagation?: boolean;
+    clickSensitivity?: number;
+    ignoreMouseEvents?: boolean;
+    children?: any;
+}
+declare const GroupMemo: React.NamedExoticComponent<GroupProps>;
+export default GroupMemo;
+/**
+ * Generate Group Props
+ *
+ * For shapes composed of multiple primitives, like the Capsule,
+ * the meshes are grouped together. In order to rotate, scale,
+ * translate, and animate the entire group rather than each individual primitive,
+ * the group properties are extracted out and nulled for the primitives.
+ *
+ * Other properties, such as material related properties are passed down
+ * so the appearance of the group is uniform.
+ *
+ * @param {any} props
+ * @returns {GroupProps}
+ */
+export declare function generateGroupProps(props: any): {
+    cleanedProps: any;
+    groupProps: any;
+};