From 6f2baa89c020dbdc23f0ecd21f0720dcf51b8414 Mon Sep 17 00:00:00 2001
From: Gorka <gorka@aquigorka.com>
Date: Mon, 16 Sep 2019 16:33:29 +0200
Subject: [PATCH] ToastList: wrap in root portal

---
 src/components/ToastHub/ToastHub.js | 25 ++++++++++++++-----------
 1 file changed, 14 insertions(+), 11 deletions(-)

diff --git a/src/components/ToastHub/ToastHub.js b/src/components/ToastHub/ToastHub.js
index 47ab2f57e..53eaf5a11 100644
--- a/src/components/ToastHub/ToastHub.js
+++ b/src/components/ToastHub/ToastHub.js
@@ -2,6 +2,7 @@ import React, { useContext } from 'react'
 import PropTypes from 'prop-types'
 import styled from 'styled-components'
 import { animated, Transition } from 'react-spring'
+import RootPortal from '../RootPortal/RootPortal'
 import { stylingProps } from '../../utils'
 import { useTheme } from '../../theme'
 import { springs, textStyle, GU, RADIUS } from '../../style'
@@ -95,17 +96,19 @@ class ToastHubProvider extends React.PureComponent {
       <React.Fragment>
         <Provider value={this.add}>{children}</Provider>
         {showList && (
-          <ToastList
-            config={this.config}
-            items={this.state.items}
-            leave={this.leave}
-            position={position}
-            remove={this.remove}
-            showIndicator={showIndicator}
-            top={top}
-            {...stylingProps(this)}
-            shift={shift}
-          />
+          <RootPortal>
+            <ToastList
+              config={this.config}
+              items={this.state.items}
+              leave={this.leave}
+              position={position}
+              remove={this.remove}
+              showIndicator={showIndicator}
+              top={top}
+              {...stylingProps(this)}
+              shift={shift}
+            />
+          </RootPortal>
         )}
       </React.Fragment>
     )