fix(View): support user-provided interactor styles

Author: floryst

src/core/View.js

@@ -135,7 +135,8 @@ export default class View extends Component {
 
     if (props.interactive) {
       this.interactor = props.interactor;
-      this.style = vtkInteractorStyleManipulator.newInstance();
+      this.defaultStyle = vtkInteractorStyleManipulator.newInstance();
+      this.style = this.defaultStyle;
     }
 
     // Create orientation widget
@@ -192,6 +193,11 @@ export default class View extends Component {
     };
     this.debouncedCubeBounds = debounce(this.updateCubeBounds, 50);
 
+    this.setInteractorStyle = (style) => {
+      this.style = style;
+      this.interactor.setInteractorStyle(style);
+    };
+
     // Internal functions
     this.hasFocus = false;
     this.handleKey = (e) => {
@@ -413,7 +419,10 @@ export default class View extends Component {
 
     this.selector.delete();
     this.orientationWidget.delete();
+    this.defaultStyle.delete();
 
+    this.defaultStyle = null;
+    this.style = null;
     this.renderer = null;
     this.selector = null;
     this.orientationWidget = null;

src/core/ViewContainer.js

@@ -22,23 +22,24 @@ class ViewController extends Component {
     } else {
       this.renderWindow = vtkRenderWindow.newInstance();
       this.openglRenderWindow = vtkOpenGLRenderWindow.newInstance();
+    }
+
+    this.onEnter = this.onEnter.bind(this);
+    this.onResize = this.onResize.bind(this);
+  }
+
+  componentDidMount() {
+    if (!this.props.root) {
       this.renderWindow.addView(this.openglRenderWindow);
 
       this.interactor = vtkRenderWindowInteractor.newInstance();
-      if (props.interactive) {
+      if (this.props.interactive) {
         this.interactor.setView(this.openglRenderWindow);
         this.interactor.initialize();
       }
-      // this.interactor.setInteractorStyle(this.style);
     }
-
     this.renderWindow.addRenderer(this.renderer);
 
-    this.onEnter = this.onEnter.bind(this);
-    this.onResize = this.onResize.bind(this);
-  }
-
-  componentDidMount() {
     const view = this.viewRef.current;
     const container = view.containerRef.current;
     container.addEventListener('pointerenter', this.onEnter);