1  import React from 'react'
 2  import ReactDOM from 'react-dom/client'
 3  
 4  import type { AdditionalGraphInfo } from 'evidently-ui-lib/api'
 5  import { Box, CssBaseline, ThemeProvider } from 'evidently-ui-lib/shared-dependencies/mui-material'
 6  import { theme } from 'evidently-ui-lib/theme/index'
 7  
 8  import type { DashboardInfoModel } from 'evidently-ui-lib/api/types'
 9  import { ThemeToggle } from 'evidently-ui-lib/components/Theme/ThemeToggle'
10  import { StandaloneSnapshotWidgets } from 'evidently-ui-lib/standalone/app'
11  
12  export function drawDashboard(
13    dashboard: DashboardInfoModel,
14    additionalGraphs: Map<string, AdditionalGraphInfo>,
15    tagId: string
16  ) {
17    const element = document.getElementById(tagId)
18    if (element) {
19      ReactDOM.createRoot(element).render(
20        <React.StrictMode>
21          <ThemeProvider theme={theme}>
22            <CssBaseline />
23            <Box display={'flex'} justifyContent={'flex-end'} p={1}>
24              <ThemeToggle />
25            </Box>
26            <StandaloneSnapshotWidgets dashboard={dashboard} additionalGraphs={additionalGraphs} />
27          </ThemeProvider>
28        </React.StrictMode>
29      )
30    }
31  }
32  
33  // @ts-ignore
34  window.drawDashboard = drawDashboard