import React from 'react' ; import { render , unmountComponentAtNode } from 'react-dom' ; import { ExprVis } from './vis' ; import { Visualization } from '../components' ; import { VisParams } from '../types' ; export const visualization = ( ) => ( { name : 'visualization' , displayName : 'visualization' , reuseDomNode : true , render : async ( domNode , config , handlers ) => { const { visData , visConfig , params } = config ; const visType = config . visType || visConfig . type ; const vis = new ExprVis ( { title : config . title , type : visType as string , params : visConfig as VisParams , } ) ; vis . eventsSubject = { next : handlers . event } ; const uiState = handlers . uiState || vis . getUiState ( ) ; handlers . onDestroy ( ( ) => { unmountComponentAtNode ( domNode ) ; } ) ; const listenOnChange = params ? params . listenOnChange : false ; render ( < Visualization vis = { vis } visData = { visData } visParams = { vis . params } uiState = { uiState } listenOnChange = { listenOnChange } onInit = { handlers . done } / > , domNode ) ; } , } ) ;