Updating Toast label definition to be string (#5389)

Author: ktabors

packages/@react-spectrum/toast/src/Toast.tsx

@@ -19,7 +19,7 @@ import InfoMedium from '@spectrum-icons/ui/InfoMedium';
 // @ts-ignore
 import intlMessages from '../intl/*.json';
 import {QueuedToast, ToastState} from '@react-stately/toast';
-import React, {ReactNode, useContext} from 'react';
+import React, {useContext} from 'react';
 import styles from '@adobe/spectrum-css-temp/components/toast/vars.css';
 import SuccessMedium from '@spectrum-icons/ui/SuccessMedium';
 import toastContainerStyles from './toastContainer.css';
@@ -28,9 +28,9 @@ import {useLocalizedStringFormatter} from '@react-aria/i18n';
 import {useToast} from '@react-aria/toast';
 
 export interface SpectrumToastValue {
-  children: ReactNode,
+  children: string,
   variant: 'positive' | 'negative' | 'info' | 'neutral',
-  actionLabel?: ReactNode,
+  actionLabel?: string,
   onAction?: () => void,
   shouldCloseOnAction?: boolean
 }

packages/@react-spectrum/toast/src/ToastContainer.tsx

@@ -11,7 +11,7 @@
  */
 
 import {AriaToastRegionProps} from '@react-aria/toast';
-import React, {ReactElement, ReactNode, useEffect, useRef} from 'react';
+import React, {ReactElement, useEffect, useRef} from 'react';
 import {SpectrumToastValue, Toast} from './Toast';
 import {Toaster} from './Toaster';
 import {ToastOptions, ToastQueue, useToastQueue} from '@react-stately/toast';
@@ -21,7 +21,7 @@ export interface SpectrumToastContainerProps extends AriaToastRegionProps {}
 
 export interface SpectrumToastOptions extends Omit<ToastOptions, 'priority'> {
   /** A label for the action button within the toast. */
-  actionLabel?: ReactNode,
+  actionLabel?: string,
   /** Handler that is called when the action button is pressed. */
   onAction?: () => void,
   /** Whether the toast should automatically close when an action is performed. */
@@ -119,7 +119,7 @@ export function ToastContainer(props: SpectrumToastContainerProps): ReactElement
   return null;
 }
 
-function addToast(children: ReactNode, variant: SpectrumToastValue['variant'], options: SpectrumToastOptions = {}) {
+function addToast(children: string, variant: SpectrumToastValue['variant'], options: SpectrumToastOptions = {}) {
   // Dispatch a custom event so that toasts can be intercepted and re-targeted, e.g. when inside an iframe.
   if (typeof CustomEvent !== 'undefined' && typeof window !== 'undefined') {
     let event = new CustomEvent('react-spectrum-toast', {
@@ -157,19 +157,19 @@ function addToast(children: ReactNode, variant: SpectrumToastValue['variant'], o
 
 const SpectrumToastQueue = {
   /** Queues a neutral toast. */
-  neutral(children: ReactNode, options: SpectrumToastOptions = {}): CloseFunction {
+  neutral(children: string, options: SpectrumToastOptions = {}): CloseFunction {
     return addToast(children, 'neutral', options);
   },
   /** Queues a positive toast. */
-  positive(children: ReactNode, options: SpectrumToastOptions = {}): CloseFunction {
+  positive(children: string, options: SpectrumToastOptions = {}): CloseFunction {
     return addToast(children, 'positive', options);
   },
   /** Queues a negative toast. */
-  negative(children: ReactNode, options: SpectrumToastOptions = {}): CloseFunction {
+  negative(children: string, options: SpectrumToastOptions = {}): CloseFunction {
     return addToast(children, 'negative', options);
   },
   /** Queues an informational toast. */
-  info(children: ReactNode, options: SpectrumToastOptions = {}): CloseFunction {
+  info(children: string, options: SpectrumToastOptions = {}): CloseFunction {
     return addToast(children, 'info', options);
   }
 };