Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
react-three-renderer
Advanced tools
react-three-renderer - npm Package Compare versions
Comparing version 0.0.9-alpha to 0.0.10-alpha
@@ -39,2 +39,6 @@ 'use strict'; | ||
| var _fbjsLibInvariant = require('fbjs/lib/invariant'); | ||
| var _fbjsLibInvariant2 = _interopRequireDefault(_fbjsLibInvariant); | ||
| var propProxy = { | ||
@@ -60,5 +64,2 @@ gammaInput: { | ||
| }, | ||
| canvas: { | ||
| type: _reactLibReactPropTypes2['default'].instanceOf(HTMLCanvasElement).isRequired | ||
| }, | ||
| onAnimate: { | ||
@@ -144,2 +145,11 @@ type: _reactLibReactPropTypes2['default'].func, | ||
| _createClass(React3Descriptor, [{ | ||
| key: 'setParent', | ||
| value: function setParent(threeObject, parentObject3D) { | ||
| (0, _fbjsLibInvariant2['default'])(parentObject3D instanceof HTMLCanvasElement, 'The `react3` element can only be rendered into a canvas.'); | ||
| _get(Object.getPrototypeOf(React3Descriptor.prototype), 'setParent', this).call(this, threeObject, parentObject3D); | ||
| threeObject.updateCanvas(parentObject3D); | ||
| } | ||
| }, { | ||
| key: 'construct', | ||
@@ -185,7 +195,2 @@ value: function construct(props) { | ||
| }, { | ||
| key: '_updateCanvas', | ||
| value: function _updateCanvas(threeObject, canvas) { | ||
| threeObject.updateCanvas(canvas); | ||
| } | ||
| }, { | ||
| key: '_updateHeight', | ||
@@ -192,0 +197,0 @@ value: function _updateHeight(threeObject, newHeight) { |
@@ -23,6 +23,2 @@ 'use strict'; | ||
| var _reactLibDOMProperty = require('react/lib/DOMProperty'); | ||
| var _reactLibDOMProperty2 = _interopRequireDefault(_reactLibDOMProperty); | ||
| var _reactLibReactMultiChild = require('react/lib/ReactMultiChild'); | ||
@@ -44,2 +40,6 @@ | ||
| var _utilsIdPropertyName = require('./utils/idPropertyName'); | ||
| var _utilsIdPropertyName2 = _interopRequireDefault(_utilsIdPropertyName); | ||
| var _React3CompositeComponentWrapper = require('./React3CompositeComponentWrapper'); | ||
@@ -49,4 +49,2 @@ | ||
| var ID_ATTR_NAME = _reactLibDOMProperty2['default'].ID_ATTRIBUTE_NAME; | ||
| function processChildContext(context) { | ||
@@ -188,3 +186,3 @@ // if (process.env.NODE_ENV !== 'production') { | ||
| var markup = (_markup = {}, _defineProperty(_markup, ID_ATTR_NAME, rootID), _defineProperty(_markup, '_rootInstance', null), _defineProperty(_markup, 'elementType', element.type), _defineProperty(_markup, 'threeObject', this._threeObject), _defineProperty(_markup, 'parentMarkup', null), _defineProperty(_markup, 'childrenMarkup', mountImages), _defineProperty(_markup, 'toJSON', function toJSON() { | ||
| var markup = (_markup = {}, _defineProperty(_markup, _utilsIdPropertyName2['default'], rootID), _defineProperty(_markup, '_rootInstance', null), _defineProperty(_markup, 'elementType', element.type), _defineProperty(_markup, 'threeObject', this._threeObject), _defineProperty(_markup, 'parentMarkup', null), _defineProperty(_markup, 'childrenMarkup', mountImages), _defineProperty(_markup, 'toJSON', function toJSON() { | ||
| return '---MARKUP---'; | ||
@@ -191,0 +189,0 @@ }), _markup); |
@@ -94,6 +94,4 @@ 'use strict'; | ||
| value: function componentDidMount() { | ||
| var canvas = this.refs.canvas; | ||
| this.react3Renderer = new _React3Renderer2['default'](); | ||
| this.react3Renderer = new _React3Renderer2['default'](canvas); | ||
| this._render(); | ||
@@ -124,4 +122,3 @@ } | ||
| _extends({}, propsToClone, { | ||
| onRecreateCanvas: this._onRecreateCanvas, | ||
| canvas: canvas }), | ||
| onRecreateCanvas: this._onRecreateCanvas }), | ||
| this.props.children | ||
@@ -128,0 +125,0 @@ ), canvas); |
@@ -121,2 +121,4 @@ 'use strict'; | ||
| } | ||
| // See ReactCompositeComponent.mountComponent | ||
| }, { | ||
@@ -123,0 +125,0 @@ key: 'mountComponent', |
@@ -171,4 +171,6 @@ 'use strict'; | ||
| this._createRenderer(); | ||
| this._canvas = null; | ||
| //this._createRenderer(); | ||
| this._onAnimate = onAnimate; | ||
@@ -231,5 +233,9 @@ this._objectsByUUID = {}; | ||
| value: function _createRenderer() { | ||
| if (!this._canvas) { | ||
| return; | ||
| } | ||
| var parameters = this._parameters; | ||
| this._renderer = new _threeJs2['default'].WebGLRenderer({ canvas: parameters.canvas, antialias: parameters.antialias }); | ||
| this._renderer = new _threeJs2['default'].WebGLRenderer({ canvas: this._canvas, antialias: parameters.antialias }); | ||
@@ -563,3 +569,3 @@ var renderer = this._renderer; | ||
| value: function updateCanvas(canvas) { | ||
| this._parameters.canvas = canvas; | ||
| this._canvas = canvas; | ||
@@ -576,3 +582,3 @@ if (this._renderer) { | ||
| this._createRenderer(this._parameters); | ||
| this._createRenderer(); | ||
| } | ||
@@ -644,4 +650,4 @@ }, { | ||
| if (contextLossExtension) { | ||
| this._parameters.canvas.addEventListener('webglcontextlost', function () { | ||
| if (contextLossExtension && this._canvas) { | ||
| this._canvas.addEventListener('webglcontextlost', function () { | ||
| // this should recreate the canvas | ||
@@ -648,0 +654,0 @@ _this2._recreateCanvasCallback(); |
@@ -23,5 +23,5 @@ 'use strict'; | ||
| var _reactLibDOMProperty = require('react/lib/DOMProperty'); | ||
| var _threeJs = require('three.js'); | ||
| var _reactLibDOMProperty2 = _interopRequireDefault(_reactLibDOMProperty); | ||
| var _threeJs2 = _interopRequireDefault(_threeJs); | ||
@@ -80,2 +80,10 @@ var _reactLibReactEmptyComponent = require('react/lib/ReactEmptyComponent'); | ||
| var _reactLibTraverseAllChildren = require('react/lib/traverseAllChildren'); | ||
| var _reactLibTraverseAllChildren2 = _interopRequireDefault(_reactLibTraverseAllChildren); | ||
| var _reactLibShouldUpdateReactComponent = require('react/lib/shouldUpdateReactComponent'); | ||
| var _reactLibShouldUpdateReactComponent2 = _interopRequireDefault(_reactLibShouldUpdateReactComponent); | ||
| var _fbjsLibEmptyObject = require('fbjs/lib/emptyObject'); | ||
@@ -93,10 +101,2 @@ | ||
| var _reactLibTraverseAllChildren = require('react/lib/traverseAllChildren'); | ||
| var _reactLibTraverseAllChildren2 = _interopRequireDefault(_reactLibTraverseAllChildren); | ||
| var _reactLibShouldUpdateReactComponent = require('react/lib/shouldUpdateReactComponent'); | ||
| var _reactLibShouldUpdateReactComponent2 = _interopRequireDefault(_reactLibShouldUpdateReactComponent); | ||
| var _React3Instance = require('./React3Instance'); | ||
@@ -122,5 +122,5 @@ | ||
| var _threeJs = require('three.js'); | ||
| var _utilsIdPropertyName = require('./utils/idPropertyName'); | ||
| var _threeJs2 = _interopRequireDefault(_threeJs); | ||
| var _utilsIdPropertyName2 = _interopRequireDefault(_utilsIdPropertyName); | ||
@@ -133,2 +133,6 @@ var SEPARATOR = _reactLibReactInstanceHandles2['default'].SEPARATOR; | ||
| // prop type helpers | ||
| // the warnings for propTypes will not say <anonymous>. | ||
| // Some performance is sacrificed for this. | ||
| // TODO: could have an env variable to disable this? | ||
| if (!_threeJs2['default']._renamed) { | ||
@@ -261,10 +265,4 @@ _threeJs2['default']._renamed = true; | ||
| var ID_ATTR_NAME = _reactLibDOMProperty2['default'].ID_ATTRIBUTE_NAME; | ||
| function internalGetID(markup) { | ||
| return markup && markup[ID_ATTR_NAME] || ''; | ||
| // If markup is something like a window, document, or text markup, none of | ||
| // which support attributes or a .getAttribute method, gracefully return | ||
| // the empty string, as if the attribute were missing. | ||
| // return markup && markup.getAttribute && markup.getAttribute(ID_ATTR_NAME) || ''; | ||
| return markup && markup[_utilsIdPropertyName2['default']] || ''; | ||
| } | ||
@@ -282,2 +280,4 @@ | ||
| // in ReactMount this is container.firstChild. | ||
| return container.userData && container.userData.markup && container.userData.markup.childrenMarkup[0] || null; | ||
@@ -318,3 +318,3 @@ } | ||
| // TODO: If nothing has changed, return the prevChildren object so that we | ||
| // can quickly bailout if nothing has changed. | ||
| // can quickly bailout. | ||
| if (!nextChildren && !prevChildren) { | ||
@@ -366,2 +366,7 @@ return null; | ||
| } | ||
| /** | ||
| * @param instance | ||
| * @returns {*} Markup | ||
| */ | ||
| }, { | ||
@@ -393,3 +398,3 @@ key: 'getMarkupFromInstance', | ||
| * | ||
| * @param {React.Component|THREE.Object3D} componentOrElement | ||
| * @param {React.Component|THREE.Object3D|HTMLCanvasElement} componentOrElement | ||
| * @return {?THREE.Object3D} The root node of this element. | ||
@@ -402,3 +407,3 @@ */ | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| (0, _fbjsLibWarning2['default'])(owner._warnedAboutRefsInRender, '%s is accessing getDOMNode or findDOMNode inside its render(). ' + 'render() should be a pure function of props and state. It should ' + 'never access something that requires stale data from the previous ' + 'render, such as refs. Move this logic to componentDidMount and ' + 'componentDidUpdate instead.', owner.getName() || 'A component'); | ||
| (0, _fbjsLibWarning2['default'])(owner._warnedAboutRefsInRender, '%s is accessing findTHREEObject inside its render(). ' + 'render() should be a pure function of props and state. It should ' + 'never access something that requires stale data from the previous ' + 'render, such as refs. Move this logic to componentDidMount and ' + 'componentDidUpdate instead.', owner.getName() || 'A component'); | ||
| } | ||
@@ -413,3 +418,3 @@ owner._warnedAboutRefsInRender = true; | ||
| if (componentOrElement instanceof _threeJs2['default'].Object3D) { | ||
| if (componentOrElement instanceof _threeJs2['default'].Object3D || componentOrElement instanceof HTMLCanvasElement) { | ||
| return componentOrElement; | ||
@@ -426,3 +431,3 @@ } | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| (0, _fbjsLibInvariant2['default'])(false, 'Component (with keys: %s) contains `render` method ' + 'but is not mounted in the DOM', _Object$keys(componentOrElement)); | ||
| (0, _fbjsLibInvariant2['default'])(false, 'Component (with keys: %s) contains `render` method ' + 'but is not mounted', _Object$keys(componentOrElement)); | ||
| } else { | ||
@@ -434,3 +439,3 @@ (0, _fbjsLibInvariant2['default'])(false); | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| (0, _fbjsLibInvariant2['default'])(false, 'Element appears to be neither ReactComponent nor DOMNode (keys: %s)', _Object$keys(componentOrElement)); | ||
| (0, _fbjsLibInvariant2['default'])(false, 'Element appears to be neither ReactComponent, a THREE.js object, nor a HTMLCanvasElement (keys: %s)', _Object$keys(componentOrElement)); | ||
| } else { | ||
@@ -442,2 +447,4 @@ (0, _fbjsLibInvariant2['default'])(false); | ||
| key: 'eventDispatcher', | ||
| // to be used by modules e.g. mouse input ( see examples ) | ||
| value: new _utilsEventDispatcher2['default'](), | ||
@@ -649,3 +656,3 @@ enumerable: true | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| (0, _fbjsLibInvariant2['default'])(false, 'React3Renderer: Unexpected modification of `%s`', ID_ATTR_NAME); | ||
| (0, _fbjsLibInvariant2['default'])(false, 'React3Renderer: Unexpected modification of `%s`', _utilsIdPropertyName2['default']); | ||
| } else { | ||
@@ -672,6 +679,6 @@ (0, _fbjsLibInvariant2['default'])(false); | ||
| * Finds the container that contains React component to which the | ||
| * supplied DOM `id` belongs. | ||
| * supplied `id` belongs. | ||
| * | ||
| * @param {string} id The ID of an element rendered by a React component. | ||
| * @return {?THREE.Object3D} The 3d object that contains the `id`. | ||
| * @return {?THREE.Object3D|HTMLCanvasElement} The container that contains the `id`. | ||
| */ | ||
@@ -730,3 +737,3 @@ }, { | ||
| * | ||
| * @param {string} id ID of a DOM node in the React component. | ||
| * @param {string} id ID of a markup in the React component. | ||
| * @return {THREE.Object3D} Root THREE.Object3D of the React component. | ||
@@ -816,3 +823,3 @@ */ | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| (0, _fbjsLibInvariant2['default'])(false, 'findComponentRoot(..., %s): Unable to find element. This probably ' + 'means the DOM was unexpectedly mutated (e.g., by the browser), ' + 'usually due to forgetting a <tbody> when using tables, nesting tags ' + 'like <form>, <p>, or <a>, or using non-SVG elements in an <svg> ' + 'parent. ' + 'Try inspecting the child nodes of the element with React ID `%s`.', targetID, this.getID(ancestorContainer.userData.markup)); | ||
| (0, _fbjsLibInvariant2['default'])(false, 'findComponentRoot(..., %s): Unable to find element. This probably ' + 'means the THREE.js environment was unexpectedly mutated (e.g., by a plugin). ' + 'Try inspecting the child nodes of the element with React ID `%s`.', targetID, this.getID(ancestorContainer.userData.markup)); | ||
| } else { | ||
@@ -824,7 +831,7 @@ (0, _fbjsLibInvariant2['default'])(false); | ||
| /** | ||
| * Mounts this component and inserts it into the DOM. | ||
| * Mounts this component and inserts it into the THREE.js environment. | ||
| * | ||
| * @param {ReactComponent} componentInstance The instance to mount. | ||
| * @param {string} rootID DOM ID of the root node. | ||
| * @param {THREE.Object3D|HTMLCanvasElement} container DOM element to mount into. | ||
| * @param {string} rootID markup ID of the root node. | ||
| * @param {THREE.Object3D|HTMLCanvasElement} container to mount into. | ||
| * @param {ReactReconcileTransaction} transaction | ||
@@ -905,2 +912,5 @@ * @param {boolean} shouldReuseMarkup If true, do not insert markup | ||
| var descriptorForChild = this.threeElementDescriptors[rootImage.elementType]; | ||
| descriptorForChild.setParent(rootImage.threeObject, rootMarkup.threeObject); | ||
| // all objects now added can be marked as added to scene now! | ||
@@ -919,3 +929,3 @@ | ||
| * @param {ReactComponent} componentInstance The instance to mount. | ||
| * @param {string} rootID DOM ID of the root node. | ||
| * @param {string} rootID markup ID of the root node. | ||
| * @param {THREE.Object3D|HTMLCanvasElement} container THREE Object or HTMLCanvasElement to mount into. | ||
@@ -1273,3 +1283,3 @@ * @param {boolean} shouldReuseMarkup If true, do not insert markup | ||
| * | ||
| * @param {THREE.Object3D} container DOM element to register as a container. | ||
| * @param {THREE.Object3D|HTMLCanvasElement} container to register as a container. | ||
| * @return {string} The "reactRoot" ID of elements rendered within. | ||
@@ -1307,3 +1317,3 @@ */ | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| (0, _fbjsLibInvariant2['default'])(false, 'React3Renderer: Two valid but unequal nodes with the same `%s`: %s', ID_ATTR_NAME, id); | ||
| (0, _fbjsLibInvariant2['default'])(false, 'React3Renderer: Two valid but unequal nodes with the same `%s`: %s', _utilsIdPropertyName2['default'], id); | ||
| } else { | ||
@@ -1329,2 +1339,4 @@ (0, _fbjsLibInvariant2['default'])(false); | ||
| exports['default'] = React3Renderer; | ||
| module.exports = exports['default']; | ||
| module.exports = exports['default']; | ||
| // used by react devtools |
| { | ||
| "name": "react-three-renderer", | ||
| "version": "0.0.9-alpha", | ||
| "version": "0.0.10-alpha", | ||
| "description": "Render into a three.js canvas using React.", | ||
@@ -5,0 +5,0 @@ "main": "./lib/React3.js", |
@@ -10,2 +10,3 @@ import React3DInstance from '../React3Instance'; | ||
| import warning from 'fbjs/lib/warning'; | ||
| import invariant from 'fbjs/lib/invariant'; | ||
@@ -35,5 +36,2 @@ const propProxy = { | ||
| }, | ||
| canvas: { | ||
| type: PropTypes.instanceOf(HTMLCanvasElement).isRequired, | ||
| }, | ||
| onAnimate: { | ||
@@ -128,2 +126,10 @@ type: PropTypes.func, | ||
| setParent(threeObject, parentObject3D) { | ||
| invariant(parentObject3D instanceof HTMLCanvasElement, 'The `react3` element can only be rendered into a canvas.'); | ||
| super.setParent(threeObject, parentObject3D); | ||
| threeObject.updateCanvas(parentObject3D); | ||
| } | ||
| construct(props) { | ||
@@ -161,6 +167,2 @@ return new React3DInstance(props, this.react3RendererInstance); | ||
| _updateCanvas(threeObject, canvas) { | ||
| threeObject.updateCanvas(canvas); | ||
| } | ||
| _updateHeight(threeObject, newHeight) { | ||
@@ -167,0 +169,0 @@ threeObject.updateHeight(newHeight); |
| import ReactReconciler from 'react/lib/ReactReconciler'; | ||
| import DOMProperty from 'react/lib/DOMProperty'; | ||
| import ReactMultiChild from 'react/lib/ReactMultiChild'; | ||
@@ -10,3 +9,3 @@ | ||
| const ID_ATTR_NAME = DOMProperty.ID_ATTRIBUTE_NAME; | ||
| import ID_PROPERTY_NAME from './utils/idPropertyName'; | ||
@@ -131,3 +130,3 @@ import React3CompositeComponentWrapper from './React3CompositeComponentWrapper'; | ||
| const markup = { | ||
| [ID_ATTR_NAME]: rootID, | ||
| [ID_PROPERTY_NAME]: rootID, | ||
| _rootInstance: null, | ||
@@ -134,0 +133,0 @@ elementType: element.type, |
@@ -59,6 +59,4 @@ import React from 'react'; | ||
| componentDidMount() { | ||
| const canvas = this.refs.canvas; | ||
| this.react3Renderer = new React3Renderer(); | ||
| this.react3Renderer = new React3Renderer(canvas); | ||
| this._render(); | ||
@@ -94,4 +92,3 @@ } | ||
| {...propsToClone} | ||
| onRecreateCanvas={this._onRecreateCanvas} | ||
| canvas={canvas}> | ||
| onRecreateCanvas={this._onRecreateCanvas}> | ||
| {this.props.children} | ||
@@ -98,0 +95,0 @@ </react3>, canvas); |
@@ -55,2 +55,3 @@ import ReactCompositeComponent from 'react/lib/ReactCompositeComponent'; | ||
| // See ReactCompositeComponent.mountComponent | ||
| mountComponent(rootID, transaction, context) { | ||
@@ -57,0 +58,0 @@ this._context = context; |
@@ -44,4 +44,6 @@ import THREE from 'three.js'; | ||
| this._createRenderer(); | ||
| this._canvas = null; | ||
| //this._createRenderer(); | ||
| this._onAnimate = onAnimate; | ||
@@ -101,5 +103,9 @@ this._objectsByUUID = {}; | ||
| _createRenderer() { | ||
| if (!this._canvas) { | ||
| return; | ||
| } | ||
| const parameters = this._parameters; | ||
| this._renderer = new THREE.WebGLRenderer({canvas: parameters.canvas, antialias: parameters.antialias}); | ||
| this._renderer = new THREE.WebGLRenderer({canvas: this._canvas, antialias: parameters.antialias}); | ||
@@ -492,3 +498,3 @@ const renderer = this._renderer; | ||
| updateCanvas(canvas) { | ||
| this._parameters.canvas = canvas; | ||
| this._canvas = canvas; | ||
@@ -505,3 +511,3 @@ if (this._renderer) { | ||
| this._createRenderer(this._parameters); | ||
| this._createRenderer(); | ||
| } | ||
@@ -564,4 +570,4 @@ | ||
| if (contextLossExtension) { | ||
| this._parameters.canvas.addEventListener('webglcontextlost', () => { | ||
| if (contextLossExtension && this._canvas) { | ||
| this._canvas.addEventListener('webglcontextlost', () => { | ||
| // this should recreate the canvas | ||
@@ -568,0 +574,0 @@ this._recreateCanvasCallback(); |
@@ -1,2 +0,3 @@ | ||
| import DOMProperty from 'react/lib/DOMProperty'; | ||
| import THREE from 'three.js'; | ||
| import ReactEmptyComponent from 'react/lib/ReactEmptyComponent'; | ||
@@ -15,2 +16,4 @@ import ReactElement from 'react/lib/ReactElement'; | ||
| import ReactDefaultBatchingStrategy from 'react/lib/ReactDefaultBatchingStrategy'; | ||
| import traverseAllChildren from 'react/lib/traverseAllChildren'; | ||
| import shouldUpdateReactComponent from 'react/lib/shouldUpdateReactComponent'; | ||
@@ -20,13 +23,10 @@ import emptyObject from 'fbjs/lib/emptyObject'; | ||
| import warning from 'fbjs/lib/warning'; | ||
| import traverseAllChildren from 'react/lib/traverseAllChildren'; | ||
| import shouldUpdateReactComponent from 'react/lib/shouldUpdateReactComponent'; | ||
| import React3DInstance from './React3Instance'; | ||
| import EventDispatcher from './utils/EventDispatcher'; | ||
| import InternalComponent from './InternalComponent'; | ||
| import ElementDescriptorContainer from './ElementDescriptorContainer'; | ||
| import React3CompositeComponentWrapper from './React3CompositeComponentWrapper'; | ||
| import THREE from 'three.js'; | ||
| import ID_PROPERTY_NAME from './utils/idPropertyName'; | ||
@@ -39,2 +39,6 @@ const SEPARATOR = ReactInstanceHandles.SEPARATOR; | ||
| // prop type helpers | ||
| // the warnings for propTypes will not say <anonymous>. | ||
| // Some performance is sacrificed for this. | ||
| // TODO: could have an env variable to disable this? | ||
| if (!THREE._renamed) { | ||
@@ -89,10 +93,5 @@ THREE._renamed = true; | ||
| const ID_ATTR_NAME = DOMProperty.ID_ATTRIBUTE_NAME; | ||
| function internalGetID(markup) { | ||
| return markup && markup[ID_ATTR_NAME] || ''; | ||
| // If markup is something like a window, document, or text markup, none of | ||
| // which support attributes or a .getAttribute method, gracefully return | ||
| // the empty string, as if the attribute were missing. | ||
| // return markup && markup.getAttribute && markup.getAttribute(ID_ATTR_NAME) || ''; | ||
| return markup && markup[ID_PROPERTY_NAME] || ''; | ||
| } | ||
@@ -111,2 +110,4 @@ | ||
| // in ReactMount this is container.firstChild. | ||
| return container.userData && container.userData.markup && container.userData.markup.childrenMarkup[0] || null; | ||
@@ -130,2 +131,3 @@ } | ||
| class React3Renderer { | ||
| // to be used by modules e.g. mouse input ( see examples ) | ||
| static eventDispatcher = new EventDispatcher(); | ||
@@ -136,3 +138,3 @@ | ||
| * | ||
| * @param {React.Component|THREE.Object3D} componentOrElement | ||
| * @param {React.Component|THREE.Object3D|HTMLCanvasElement} componentOrElement | ||
| * @return {?THREE.Object3D} The root node of this element. | ||
@@ -145,3 +147,7 @@ */ | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| warning(owner._warnedAboutRefsInRender, '%s is accessing getDOMNode or findDOMNode inside its render(). ' + 'render() should be a pure function of props and state. It should ' + 'never access something that requires stale data from the previous ' + 'render, such as refs. Move this logic to componentDidMount and ' + 'componentDidUpdate instead.', owner.getName() || 'A component'); | ||
| warning(owner._warnedAboutRefsInRender, '%s is accessing findTHREEObject inside its render(). ' + | ||
| 'render() should be a pure function of props and state. It should ' + | ||
| 'never access something that requires stale data from the previous ' + | ||
| 'render, such as refs. Move this logic to componentDidMount and ' + | ||
| 'componentDidUpdate instead.', owner.getName() || 'A component'); | ||
| } | ||
@@ -156,3 +162,4 @@ owner._warnedAboutRefsInRender = true; | ||
| if (componentOrElement instanceof THREE.Object3D) { | ||
| if (componentOrElement instanceof THREE.Object3D || | ||
| componentOrElement instanceof HTMLCanvasElement) { | ||
| return componentOrElement; | ||
@@ -169,3 +176,4 @@ } | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| invariant(false, 'Component (with keys: %s) contains `render` method ' + 'but is not mounted in the DOM', Object.keys(componentOrElement)); | ||
| invariant(false, 'Component (with keys: %s) contains `render` method ' + | ||
| 'but is not mounted', Object.keys(componentOrElement)); | ||
| } else { | ||
@@ -177,3 +185,4 @@ invariant(false); | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| invariant(false, 'Element appears to be neither ReactComponent nor DOMNode (keys: %s)', Object.keys(componentOrElement)); | ||
| invariant(false, 'Element appears to be neither ReactComponent, a THREE.js object, nor a HTMLCanvasElement (keys: %s)', | ||
| Object.keys(componentOrElement)); | ||
| } else { | ||
@@ -202,3 +211,3 @@ invariant(false); | ||
| // TODO: If nothing has changed, return the prevChildren object so that we | ||
| // can quickly bailout if nothing has changed. | ||
| // can quickly bailout. | ||
| if (!nextChildren && !prevChildren) { | ||
@@ -251,2 +260,6 @@ return null; | ||
| /** | ||
| * @param instance | ||
| * @returns {*} Markup | ||
| */ | ||
| getMarkupFromInstance(instance) { | ||
@@ -367,3 +380,2 @@ const id = ReactInstanceMap.get(instance)._rootNodeID; | ||
| findDeepestCachedAncestorImpl = (ancestorID) => { | ||
@@ -431,3 +443,3 @@ const ancestorMarkup = this.markupCache[ancestorID]; | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| invariant(false, 'React3Renderer: Unexpected modification of `%s`', ID_ATTR_NAME); | ||
| invariant(false, 'React3Renderer: Unexpected modification of `%s`', ID_PROPERTY_NAME); | ||
| } else { | ||
@@ -455,6 +467,6 @@ invariant(false); | ||
| * Finds the container that contains React component to which the | ||
| * supplied DOM `id` belongs. | ||
| * supplied `id` belongs. | ||
| * | ||
| * @param {string} id The ID of an element rendered by a React component. | ||
| * @return {?THREE.Object3D} The 3d object that contains the `id`. | ||
| * @return {?THREE.Object3D|HTMLCanvasElement} The container that contains the `id`. | ||
| */ | ||
@@ -511,2 +523,3 @@ findContainerForID(id) { | ||
| // used by react devtools | ||
| nativeTagToRootNodeID = () => { | ||
@@ -522,3 +535,3 @@ // console.log('wat'); | ||
| * | ||
| * @param {string} id ID of a DOM node in the React component. | ||
| * @param {string} id ID of a markup in the React component. | ||
| * @return {THREE.Object3D} Root THREE.Object3D of the React component. | ||
@@ -608,6 +621,3 @@ */ | ||
| invariant(false, 'findComponentRoot(..., %s): Unable to find element. This probably ' + | ||
| 'means the DOM was unexpectedly mutated (e.g., by the browser), ' + | ||
| 'usually due to forgetting a <tbody> when using tables, nesting tags ' + | ||
| 'like <form>, <p>, or <a>, or using non-SVG elements in an <svg> ' + | ||
| 'parent. ' + | ||
| 'means the THREE.js environment was unexpectedly mutated (e.g., by a plugin). ' + | ||
| 'Try inspecting the child nodes of the element with React ID `%s`.', targetID, | ||
@@ -622,7 +632,7 @@ this.getID(ancestorContainer.userData.markup)); | ||
| /** | ||
| * Mounts this component and inserts it into the DOM. | ||
| * Mounts this component and inserts it into the THREE.js environment. | ||
| * | ||
| * @param {ReactComponent} componentInstance The instance to mount. | ||
| * @param {string} rootID DOM ID of the root node. | ||
| * @param {THREE.Object3D|HTMLCanvasElement} container DOM element to mount into. | ||
| * @param {string} rootID markup ID of the root node. | ||
| * @param {THREE.Object3D|HTMLCanvasElement} container to mount into. | ||
| * @param {ReactReconcileTransaction} transaction | ||
@@ -715,2 +725,5 @@ * @param {boolean} shouldReuseMarkup If true, do not insert markup | ||
| const descriptorForChild = this.threeElementDescriptors[rootImage.elementType]; | ||
| descriptorForChild.setParent(rootImage.threeObject, rootMarkup.threeObject); | ||
| // all objects now added can be marked as added to scene now! | ||
@@ -729,3 +742,3 @@ | ||
| * @param {ReactComponent} componentInstance The instance to mount. | ||
| * @param {string} rootID DOM ID of the root node. | ||
| * @param {string} rootID markup ID of the root node. | ||
| * @param {THREE.Object3D|HTMLCanvasElement} container THREE Object or HTMLCanvasElement to mount into. | ||
@@ -1096,3 +1109,3 @@ * @param {boolean} shouldReuseMarkup If true, do not insert markup | ||
| * | ||
| * @param {THREE.Object3D} container DOM element to register as a container. | ||
| * @param {THREE.Object3D|HTMLCanvasElement} container to register as a container. | ||
| * @return {string} The "reactRoot" ID of elements rendered within. | ||
@@ -1126,3 +1139,3 @@ */ | ||
| if (process.env.NODE_ENV !== 'production') { | ||
| invariant(false, 'React3Renderer: Two valid but unequal nodes with the same `%s`: %s', ID_ATTR_NAME, id); | ||
| invariant(false, 'React3Renderer: Two valid but unequal nodes with the same `%s`: %s', ID_PROPERTY_NAME, id); | ||
| } else { | ||
@@ -1129,0 +1142,0 @@ invariant(false); |
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by0.15%
651015
- Number of package files
- increased by0.98%
206
- Lines of code
- increased by0.19%
15099
No dependency changes