fix: Toast intent should always be present in the context

packages/react-components/react-toast/src/components/ToastContainer/ToastContainer.test.tsx

@@ -14,6 +14,7 @@ const defaultToastContainerProps: ToastContainerProps = {
   politeness: 'polite',
   remove: () => null,
   timeout: -1,
+  intent: undefined,
   updateId: 0,
   visible: true,
 };

packages/react-components/react-toast/src/components/ToastContainer/ToastContainer.types.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
 import { Announce } from '../AriaLive/AriaLive.types';
-import { Toast } from '../../state';
+import { Toast, ToastIntent } from '../../state';
 import { ToastContextValue } from '../../contexts/toastContext';
 import { TimerProps } from '../Timer/Timer';
 
@@ -20,25 +20,18 @@ export type ToastContainerSlots = {
 export type ToastContainerProps = ComponentProps<Partial<ToastContainerSlots>> &
   Pick<
     Toast,
-    | 'close'
-    | 'remove'
-    | 'updateId'
-    | 'data'
-    | 'timeout'
-    | 'politeness'
-    | 'pauseOnHover'
-    | 'pauseOnWindowBlur'
-    | 'intent'
+    'close' | 'remove' | 'updateId' | 'data' | 'timeout' | 'politeness' | 'pauseOnHover' | 'pauseOnWindowBlur'
   > & {
     visible: boolean;
     announce: Announce;
+    intent: ToastIntent | undefined;
   };
 
 /**
  * State used in rendering ToastContainer
  */
 export type ToastContainerState = ComponentState<ToastContainerSlots> &
-  Pick<ToastContainerProps, 'remove' | 'close' | 'updateId' | 'visible'> & {
+  Pick<ToastContainerProps, 'remove' | 'close' | 'updateId' | 'visible' | 'intent'> & {
     transitionTimeout: number;
     timerTimeout: number;
     running: boolean;

packages/react-components/react-toast/src/components/ToastContainer/useToastContainer.ts

@@ -101,5 +101,6 @@ export const useToastContainer_unstable = (
     onTransitionEntering,
     updateId,
     nodeRef: toastRef,
+    intent,
   };
 };

packages/react-components/react-toast/src/components/ToastContainer/useToastContainerContextValues.ts

@@ -2,13 +2,14 @@ import * as React from 'react';
 import { ToastContainerContextValues, ToastContainerState } from './ToastContainer.types';
 
 export function useToastContainerContextValues_unstable(state: ToastContainerState): ToastContainerContextValues {
-  const { close } = state;
+  const { close, intent } = state;
 
   const toastContext = React.useMemo(
     () => ({
       close,
+      intent,
     }),
-    [close],
+    [close, intent],
   );
 
   return {

packages/react-components/react-toast/src/components/ToastTitle/ToastTitle.types.ts

@@ -7,8 +7,6 @@ export type ToastTitleSlots = {
   action?: Slot<'div'>;
 };
 
-export type ToastIntent = 'info' | 'success' | 'error' | 'warning';
-
 /**
  * ToastTitle Props
  */

packages/react-components/react-toast/src/components/Toaster/useToaster.tsx

@@ -24,7 +24,13 @@ export const useToaster_unstable = (props: ToasterProps): ToasterState => {
     resolveShorthand(toastsToRender.has(toastPosition) ? rootProps : null, {
       defaultProps: {
         children: toastsToRender.get(toastPosition)?.map(toast => (
-          <ToastContainer {...toast} announce={announce} key={toast.toastId} visible={isToastVisible(toast.toastId)}>
+          <ToastContainer
+            {...toast}
+            intent={toast.intent}
+            announce={announce}
+            key={toast.toastId}
+            visible={isToastVisible(toast.toastId)}
+          >
             {toast.content as React.ReactNode}
           </ToastContainer>
         )),

packages/react-components/react-toast/src/contexts/toastContext.tsx

@@ -1,12 +1,14 @@
 import * as React from 'react';
-import { ToastOptions } from '../state/types';
+import { ToastIntent } from '../state/types';
 
 export type ToastContextValue = {
   close: () => void;
-} & Pick<ToastOptions, 'intent'>;
+  intent: ToastIntent | undefined;
+};
 
 const toastContextDefaultValue: ToastContextValue = {
   close: () => null,
+  intent: undefined,
 };
 
 const toastContext = React.createContext<ToastContextValue | undefined>(undefined);

packages/react-components/react-toast/src/index.ts

@@ -1,5 +1,5 @@
 export { useToastController } from './state';
-export type { ToastPosition, ToastId, ToastOffset, ToastPoliteness, ToastStatus } from './state';
+export type { ToastPosition, ToastId, ToastOffset, ToastPoliteness, ToastStatus, ToastIntent } from './state';
 
 export { ToastTrigger } from './ToastTrigger';
 export type { ToastTriggerChildProps, ToastTriggerProps, ToastTriggerState } from './ToastTrigger';
@@ -21,7 +21,7 @@ export {
   renderToastTitle_unstable,
   toastTitleClassNames,
 } from './ToastTitle';
-export type { ToastTitleProps, ToastTitleState, ToastTitleSlots, ToastIntent } from './ToastTitle';
+export type { ToastTitleProps, ToastTitleState, ToastTitleSlots } from './ToastTitle';
 
 export {
   ToastBody,