import React from 'react' ; import { render , unmountComponentAtNode } from 'react-dom' ; import Snackbar from '@material-ui/core/Snackbar' ; import Alert from '@material-ui/lab/Alert' ; interface Props { intent : 'success' | 'info' | 'warning' | 'error' ; text : string ; } export function toast ( props ) { const root = document . createElement ( 'div' ) ; document . body . appendChild ( root ) ; const onClose = ( ) => { unmountComponentAtNode ( root ) ; document . body . removeChild ( root ) ; } ; render ( < Snackbar open = { true } autoHideDuration = { 3000 } onClose = { onClose } anchorOrigin = { { vertical : 'top' , horizontal : 'right' } } > < Alert severity = { props . intent } elevation = { 6 } variant = "filled" onClose = { onClose } > { props . text } < /Alert> < /Snackbar>, root); }