From 86fe3e9204517c72d8c32f8538a4363cdbddf4af Mon Sep 17 00:00:00 2001
From: scarcoco <cooxacom@163.com>
Date: Tue, 29 Oct 2019 13:02:04 +0800
Subject: [PATCH] feat: support react node

---
 index.d.ts            |  2 +-
 lib/ToastContainer.js | 26 +++++++++++++++++++-------
 2 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/index.d.ts b/index.d.ts
index 88c2647..f49733f 100644
--- a/index.d.ts
+++ b/index.d.ts
@@ -41,7 +41,7 @@ declare module "react-native-root-toast"{
         CENTER:number,
     }
     export default class Toast extends React.Component<ToastProps>{
-        static show:(message:string,options?:ToastOptions)=>any;
+        static show:(message:React.ReactNode,options?:ToastOptions)=>any;
         static hide:(toast:any)=>void;
         static durations:Durations;
         static positions:Positions;
diff --git a/lib/ToastContainer.js b/lib/ToastContainer.js
index 88872a2..b7e6e3a 100644
--- a/lib/ToastContainer.js
+++ b/lib/ToastContainer.js
@@ -219,6 +219,24 @@ class ToastContainer extends Component {
             bottom: keyboardHeight
         };
 
+        // support element
+        const { children } = props
+
+        let child = children
+
+        // single element & not valid
+        if (React.Children.count(children) <= 1 && !React.isValidElement(children)) {
+            child = (
+                <Text style={[
+                    styles.textStyle,
+                    props.textStyle,
+                    props.textColor && {color: props.textColor}
+                ]}>
+                    {children || ''}
+                </Text>
+            )
+        }
+
         return (this.state.visible || this._animating) ? <View
             style={[
                 styles.defaultStyle,
@@ -247,13 +265,7 @@ class ToastContainer extends Component {
                     pointerEvents="none"
                     ref={ele => this._root = ele}
                 >
-                    <Text style={[
-                        styles.textStyle,
-                        props.textStyle,
-                        props.textColor && {color: props.textColor}
-                    ]}>
-                        {this.props.children}
-                    </Text>
+                    {child}
                 </Animated.View>
             </TouchableWithoutFeedback>
         </View> : null;