import React , { lazy , Suspense } from 'react' ; import ReactDOM from 'react-dom' ; import { EuiPortal , EuiProgress } from '@elastic/eui' ; import { I18nProvider } from '@kbn/i18n-react' ; import { KibanaThemeProvider } from '../../../kibana_react/public' ; import { getHttp , getSavedObjects , getTypes , getUISettings , getUsageCollector , getApplication , getEmbeddable , getDocLinks , getTheme , } from '../services' ; import type { BaseVisType } from '../vis_types' ; const NewVisModal = lazy ( ( ) => import ( './new_vis_modal' ) ) ; export interface ShowNewVisModalParams { editorParams ? : string [ ] ; onClose ? : ( ) => void ; originatingApp ? : string ; outsideVisualizeApp ? : boolean ; createByValue ? : boolean ; showAggsSelection ? : boolean ; selectedVisType ? : BaseVisType ; } param { string [ ] } editorParams param { function } onClose export function showNewVisModal ( { editorParams = [ ] , onClose , originatingApp , outsideVisualizeApp , showAggsSelection , selectedVisType , } = { } ) { const container = document . createElement ( 'div' ) ; let isClosed = false ; const handleClose = ( ) => { if ( isClosed ) return ; ReactDOM . unmountComponentAtNode ( container ) ; document . body . removeChild ( container ) ; if ( onClose ) { onClose ( ) ; } isClosed = true ; } ; document . body . appendChild ( container ) ; const element = ( < KibanaThemeProvider theme$ = { getTheme ( ) . theme$ } > < I18nProvider > < Suspense fallback = { < EuiPortal > < EuiProgress size = "xs" position = "fixed" / > < /EuiPortal>}> < NewVisModal isOpen = { true } onClose = { handleClose } originatingApp = { originatingApp } stateTransfer = { getEmbeddable ( ) . getStateTransfer ( ) } outsideVisualizeApp = { outsideVisualizeApp } editorParams = { editorParams } visTypesRegistry = { getTypes ( ) } addBasePath = { getHttp ( ) . basePath . prepend } uiSettings = { getUISettings ( ) } savedObjects = { getSavedObjects ( ) } usageCollection = { getUsageCollector ( ) } application = { getApplication ( ) } docLinks = { getDocLinks ( ) } showAggsSelection = { showAggsSelection } selectedVisType = { selectedVisType } / > < /Suspense> < /I18nProvider> < /KibanaThemeProvider>); ReactDOM . render ( element , container ) ; return ( ) => handleClose ( ) ; }