import React , { Suspense , lazy } from 'react' ; import { render , unmountComponentAtNode } from 'react-dom' ; import { EventEmitter } from 'events' ; import { EuiErrorBoundary , EuiLoadingChart } from '@elastic/eui' ; import { EditorRenderProps } from 'src/plugins/visualize/public' ; import { Vis , VisualizeEmbeddableContract } from 'src/plugins/visualizations/public' ; const DefaultEditor = lazy ( ( ) => import ( './default_editor' ) ) ; class DefaultEditorController { constructor ( private el , private vis , private eventEmitter , private embeddableHandler ) { } render ( props ) { render ( < EuiErrorBoundary > < Suspense fallback = { < div style = { { display : 'flex' , flex : '1 1 auto' , justifyContent : 'center' , alignItems : 'center' , } } > < EuiLoadingChart size = "xl" mono / > < /div>}> < DefaultEditor eventEmitter = { this . eventEmitter } embeddableHandler = { this . embeddableHandler } vis = { this . vis } { ... props } /> < /Suspense> < /EuiErrorBoundary>, this.el); } destroy ( ) { unmountComponentAtNode ( this . el ) ; } } export { DefaultEditorController } ;