@fluentui/react-toast 9.0.6 → 9.1.0

package/lib/state/useToaster.js

@@ -18,11 +18,6 @@ export function useToaster(options = {}) {
             return shortcuts.focus(e);
         }
     });
-    const tryRestoreFocus = React.useCallback(()=>{
-        var _lastActiveElementRef_current;
-        (_lastActiveElementRef_current = lastActiveElementRef.current) === null || _lastActiveElementRef_current === void 0 ? void 0 : _lastActiveElementRef_current.focus();
-        lastActiveElementRef.current = null;
-    }, []);
     const pauseAllToasts = React.useCallback(()=>{
         toaster.visibleToasts.forEach((toastId)=>{
             var _toast_imperativeRef_current;
@@ -58,6 +53,28 @@ export function useToaster(options = {}) {
     }, [
         toaster
     ]);
+    const tryRestoreFocus = React.useCallback(()=>{
+        const mostRecentToast = getMostRecentVisibleToast();
+        if (mostRecentToast === null || mostRecentToast === void 0 ? void 0 : mostRecentToast.imperativeRef.current) {
+            mostRecentToast.imperativeRef.current.focus();
+        } else {
+            var _lastActiveElementRef_current;
+            (_lastActiveElementRef_current = lastActiveElementRef.current) === null || _lastActiveElementRef_current === void 0 ? void 0 : _lastActiveElementRef_current.focus();
+            lastActiveElementRef.current = null;
+        }
+    }, [
+        getMostRecentVisibleToast
+    ]);
+    const closeAllToasts = React.useCallback(()=>{
+        toaster.visibleToasts.forEach((toastId)=>{
+            const toast = toaster.toasts.get(toastId);
+            toast === null || toast === void 0 ? void 0 : toast.close();
+        });
+        tryRestoreFocus();
+    }, [
+        toaster,
+        tryRestoreFocus
+    ]);
     React.useEffect(()=>{
         if (!targetDocument) {
             return;
@@ -157,6 +174,7 @@ export function useToaster(options = {}) {
         toastsToRender,
         pauseAllToasts,
         playAllToasts,
-        tryRestoreFocus
+        tryRestoreFocus,
+        closeAllToasts
     };
 }

package/lib/state/useToaster.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useToaster.ts"],"sourcesContent":["import * as React from 'react';\nimport { isHTMLElement, useEventCallback, useForceUpdate } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { createToaster } from './vanilla';\nimport type {\n  CommonToastDetail,\n  ShowToastEventDetail,\n  Toast,\n  ToastListenerMap,\n  ToastPosition,\n  ToasterId,\n  ToasterOptions,\n} from './types';\nimport { EVENTS } from './constants';\n\nexport function useToaster<TElement extends HTMLElement = HTMLDivElement>(options: Partial<ToasterOptions> = {}) {\n  const forceUpdate = useForceUpdate();\n  const { toasterId: userToasterId, shortcuts } = options;\n  // Currently the toaster options can never be changed at runtime\n  const [toaster] = React.useState(() => createToaster(options));\n  const { targetDocument } = useFluent();\n\n  const lastActiveElementRef = React.useRef<HTMLElement | null>(null);\n\n  const isCorrectToaster = useEventCallback((toasterId: ToasterId | undefined) => {\n    return toasterId === userToasterId;\n  });\n\n  const isFocusShortcut = useEventCallback((e: KeyboardEvent) => {\n    if (shortcuts?.focus) {\n      return shortcuts.focus(e);\n    }\n  });\n\n  const tryRestoreFocus = React.useCallback(() => {\n    lastActiveElementRef.current?.focus();\n    lastActiveElementRef.current = null;\n  }, []);\n\n  const pauseAllToasts = React.useCallback(() => {\n    toaster.visibleToasts.forEach(toastId => {\n      const toast = toaster.toasts.get(toastId);\n      toast?.imperativeRef.current?.pause();\n    });\n  }, [toaster]);\n\n  const playAllToasts = React.useCallback(() => {\n    toaster.visibleToasts.forEach(toastId => {\n      const toast = toaster.toasts.get(toastId);\n      toast?.imperativeRef.current?.play();\n    });\n  }, [toaster]);\n\n  const getMostRecentVisibleToast = React.useCallback(() => {\n    return Array.from(toaster.visibleToasts).reduce((cur, next) => {\n      const toast = toaster.toasts.get(next);\n      if (!toast) {\n        return cur;\n      }\n\n      if (!cur) {\n        return toast;\n      }\n\n      if (cur.order < toast?.order) {\n        return toast;\n      }\n\n      return cur;\n    }, undefined as Toast | undefined);\n  }, [toaster]);\n\n  React.useEffect(() => {\n    if (!targetDocument) {\n      return;\n    }\n\n    const addToastListener = <TType extends keyof ToastListenerMap>(\n      eventType: TType,\n      callback: ToastListenerMap[TType],\n    ) => {\n      const listener: ToastListenerMap[TType] = (e: CustomEvent<CommonToastDetail>) => {\n        if (!isCorrectToaster(e.detail.toasterId)) {\n          return;\n        }\n\n        callback(e as CustomEvent<ShowToastEventDetail>);\n        forceUpdate();\n      };\n\n      targetDocument.addEventListener(eventType, listener as () => void);\n      return () => targetDocument.removeEventListener(eventType, listener as () => void);\n    };\n\n    const buildToast: ToastListenerMap[typeof EVENTS.show] = e => {\n      toaster.buildToast(e.detail, forceUpdate);\n    };\n\n    const dismissToast: ToastListenerMap[typeof EVENTS.dismiss] = e => {\n      toaster.dismissToast(e.detail.toastId);\n    };\n\n    const updateToast: ToastListenerMap[typeof EVENTS.update] = e => {\n      toaster.updateToast(e.detail);\n    };\n\n    const dismissAllToasts: ToastListenerMap[typeof EVENTS.dismissAll] = e => {\n      toaster.dismissAllToasts();\n    };\n\n    const pauseToast: ToastListenerMap[typeof EVENTS.pause] = e => {\n      const toast = toaster.toasts.get(e.detail.toastId);\n      if (toast) {\n        toast.imperativeRef.current?.pause();\n      }\n    };\n\n    const playToast: ToastListenerMap[typeof EVENTS.play] = e => {\n      const toast = toaster.toasts.get(e.detail.toastId);\n      if (toast) {\n        toast.imperativeRef.current?.play();\n      }\n    };\n\n    const cleanupBuildListener = addToastListener(EVENTS.show, buildToast);\n    const cleanupUpdateListener = addToastListener(EVENTS.update, updateToast);\n    const cleanupDismissListener = addToastListener(EVENTS.dismiss, dismissToast);\n    const cleanupDismissAllListener = addToastListener(EVENTS.dismissAll, dismissAllToasts);\n    const cleanupPauseListener = addToastListener(EVENTS.pause, pauseToast);\n    const cleanupPlayListener = addToastListener(EVENTS.play, playToast);\n\n    const focusShortcutListener = (e: KeyboardEvent) => {\n      if (isFocusShortcut(e)) {\n        pauseAllToasts();\n        const mostRecentToast = getMostRecentVisibleToast();\n\n        if (mostRecentToast) {\n          lastActiveElementRef.current = isHTMLElement(targetDocument.activeElement)\n            ? targetDocument.activeElement\n            : null;\n          mostRecentToast.imperativeRef.current?.focus();\n        }\n      }\n    };\n\n    targetDocument.addEventListener('keydown', focusShortcutListener);\n\n    return () => {\n      cleanupBuildListener();\n      cleanupDismissAllListener();\n      cleanupUpdateListener();\n      cleanupDismissListener();\n      cleanupPauseListener();\n      cleanupPlayListener();\n\n      targetDocument.removeEventListener('keydown', focusShortcutListener);\n    };\n  }, [\n    toaster,\n    forceUpdate,\n    targetDocument,\n    isCorrectToaster,\n    pauseAllToasts,\n    getMostRecentVisibleToast,\n    isFocusShortcut,\n  ]);\n\n  const toastsToRender = (() => {\n    if (!toaster) {\n      return new Map<ToastPosition, Toast[]>();\n    }\n\n    const toRender = new Map<ToastPosition, Toast[]>();\n    const toasts = Array.from(toaster.toasts.values());\n\n    toasts.forEach(toast => {\n      const { position } = toast;\n      toRender.has(position) || toRender.set(position, []);\n      if (position.startsWith('bottom')) {\n        toRender.get(position)!.push(toast);\n      } else {\n        toRender.get(position)!.unshift(toast);\n      }\n    });\n\n    return toRender;\n  })();\n\n  return {\n    isToastVisible: toaster.isToastVisible,\n    toastsToRender,\n    pauseAllToasts,\n    playAllToasts,\n    tryRestoreFocus,\n  };\n}\n"],"names":["React","isHTMLElement","useEventCallback","useForceUpdate","useFluent_unstable","useFluent","createToaster","EVENTS","useToaster","options","forceUpdate","toasterId","userToasterId","shortcuts","toaster","useState","targetDocument","lastActiveElementRef","useRef","isCorrectToaster","isFocusShortcut","e","focus","tryRestoreFocus","useCallback","current","pauseAllToasts","visibleToasts","forEach","toastId","toast","toasts","get","imperativeRef","pause","playAllToasts","play","getMostRecentVisibleToast","Array","from","reduce","cur","next","order","undefined","useEffect","addToastListener","eventType","callback","listener","detail","addEventListener","removeEventListener","buildToast","dismissToast","updateToast","dismissAllToasts","pauseToast","playToast","cleanupBuildListener","show","cleanupUpdateListener","update","cleanupDismissListener","dismiss","cleanupDismissAllListener","dismissAll","cleanupPauseListener","cleanupPlayListener","focusShortcutListener","mostRecentToast","activeElement","toastsToRender","Map","toRender","values","position","has","set","startsWith","push","unshift","isToastVisible"],"mappings":"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"}
+{"version":3,"sources":["useToaster.ts"],"sourcesContent":["import * as React from 'react';\nimport { isHTMLElement, useEventCallback, useForceUpdate } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { createToaster } from './vanilla';\nimport type {\n  CommonToastDetail,\n  ShowToastEventDetail,\n  Toast,\n  ToastListenerMap,\n  ToastPosition,\n  ToasterId,\n  ToasterOptions,\n} from './types';\nimport { EVENTS } from './constants';\n\nexport function useToaster<TElement extends HTMLElement = HTMLDivElement>(options: Partial<ToasterOptions> = {}) {\n  const forceUpdate = useForceUpdate();\n  const { toasterId: userToasterId, shortcuts } = options;\n  // Currently the toaster options can never be changed at runtime\n  const [toaster] = React.useState(() => createToaster(options));\n  const { targetDocument } = useFluent();\n\n  const lastActiveElementRef = React.useRef<HTMLElement | null>(null);\n\n  const isCorrectToaster = useEventCallback((toasterId: ToasterId | undefined) => {\n    return toasterId === userToasterId;\n  });\n\n  const isFocusShortcut = useEventCallback((e: KeyboardEvent) => {\n    if (shortcuts?.focus) {\n      return shortcuts.focus(e);\n    }\n  });\n\n  const pauseAllToasts = React.useCallback(() => {\n    toaster.visibleToasts.forEach(toastId => {\n      const toast = toaster.toasts.get(toastId);\n      toast?.imperativeRef.current?.pause();\n    });\n  }, [toaster]);\n\n  const playAllToasts = React.useCallback(() => {\n    toaster.visibleToasts.forEach(toastId => {\n      const toast = toaster.toasts.get(toastId);\n      toast?.imperativeRef.current?.play();\n    });\n  }, [toaster]);\n\n  const getMostRecentVisibleToast = React.useCallback(() => {\n    return Array.from(toaster.visibleToasts).reduce((cur, next) => {\n      const toast = toaster.toasts.get(next);\n      if (!toast) {\n        return cur;\n      }\n\n      if (!cur) {\n        return toast;\n      }\n\n      if (cur.order < toast?.order) {\n        return toast;\n      }\n\n      return cur;\n    }, undefined as Toast | undefined);\n  }, [toaster]);\n\n  const tryRestoreFocus = React.useCallback(() => {\n    const mostRecentToast = getMostRecentVisibleToast();\n    if (mostRecentToast?.imperativeRef.current) {\n      mostRecentToast.imperativeRef.current.focus();\n    } else {\n      lastActiveElementRef.current?.focus();\n      lastActiveElementRef.current = null;\n    }\n  }, [getMostRecentVisibleToast]);\n\n  const closeAllToasts = React.useCallback(() => {\n    toaster.visibleToasts.forEach(toastId => {\n      const toast = toaster.toasts.get(toastId);\n      toast?.close();\n    });\n\n    tryRestoreFocus();\n  }, [toaster, tryRestoreFocus]);\n\n  React.useEffect(() => {\n    if (!targetDocument) {\n      return;\n    }\n\n    const addToastListener = <TType extends keyof ToastListenerMap>(\n      eventType: TType,\n      callback: ToastListenerMap[TType],\n    ) => {\n      const listener: ToastListenerMap[TType] = (e: CustomEvent<CommonToastDetail>) => {\n        if (!isCorrectToaster(e.detail.toasterId)) {\n          return;\n        }\n\n        callback(e as CustomEvent<ShowToastEventDetail>);\n        forceUpdate();\n      };\n\n      targetDocument.addEventListener(eventType, listener as () => void);\n      return () => targetDocument.removeEventListener(eventType, listener as () => void);\n    };\n\n    const buildToast: ToastListenerMap[typeof EVENTS.show] = e => {\n      toaster.buildToast(e.detail, forceUpdate);\n    };\n\n    const dismissToast: ToastListenerMap[typeof EVENTS.dismiss] = e => {\n      toaster.dismissToast(e.detail.toastId);\n    };\n\n    const updateToast: ToastListenerMap[typeof EVENTS.update] = e => {\n      toaster.updateToast(e.detail);\n    };\n\n    const dismissAllToasts: ToastListenerMap[typeof EVENTS.dismissAll] = e => {\n      toaster.dismissAllToasts();\n    };\n\n    const pauseToast: ToastListenerMap[typeof EVENTS.pause] = e => {\n      const toast = toaster.toasts.get(e.detail.toastId);\n      if (toast) {\n        toast.imperativeRef.current?.pause();\n      }\n    };\n\n    const playToast: ToastListenerMap[typeof EVENTS.play] = e => {\n      const toast = toaster.toasts.get(e.detail.toastId);\n      if (toast) {\n        toast.imperativeRef.current?.play();\n      }\n    };\n\n    const cleanupBuildListener = addToastListener(EVENTS.show, buildToast);\n    const cleanupUpdateListener = addToastListener(EVENTS.update, updateToast);\n    const cleanupDismissListener = addToastListener(EVENTS.dismiss, dismissToast);\n    const cleanupDismissAllListener = addToastListener(EVENTS.dismissAll, dismissAllToasts);\n    const cleanupPauseListener = addToastListener(EVENTS.pause, pauseToast);\n    const cleanupPlayListener = addToastListener(EVENTS.play, playToast);\n\n    const focusShortcutListener = (e: KeyboardEvent) => {\n      if (isFocusShortcut(e)) {\n        pauseAllToasts();\n        const mostRecentToast = getMostRecentVisibleToast();\n\n        if (mostRecentToast) {\n          lastActiveElementRef.current = isHTMLElement(targetDocument.activeElement)\n            ? targetDocument.activeElement\n            : null;\n          mostRecentToast.imperativeRef.current?.focus();\n        }\n      }\n    };\n\n    targetDocument.addEventListener('keydown', focusShortcutListener);\n\n    return () => {\n      cleanupBuildListener();\n      cleanupDismissAllListener();\n      cleanupUpdateListener();\n      cleanupDismissListener();\n      cleanupPauseListener();\n      cleanupPlayListener();\n\n      targetDocument.removeEventListener('keydown', focusShortcutListener);\n    };\n  }, [\n    toaster,\n    forceUpdate,\n    targetDocument,\n    isCorrectToaster,\n    pauseAllToasts,\n    getMostRecentVisibleToast,\n    isFocusShortcut,\n  ]);\n\n  const toastsToRender = (() => {\n    if (!toaster) {\n      return new Map<ToastPosition, Toast[]>();\n    }\n\n    const toRender = new Map<ToastPosition, Toast[]>();\n    const toasts = Array.from(toaster.toasts.values());\n\n    toasts.forEach(toast => {\n      const { position } = toast;\n      toRender.has(position) || toRender.set(position, []);\n      if (position.startsWith('bottom')) {\n        toRender.get(position)!.push(toast);\n      } else {\n        toRender.get(position)!.unshift(toast);\n      }\n    });\n\n    return toRender;\n  })();\n\n  return {\n    isToastVisible: toaster.isToastVisible,\n    toastsToRender,\n    pauseAllToasts,\n    playAllToasts,\n    tryRestoreFocus,\n    closeAllToasts,\n  };\n}\n"],"names":["React","isHTMLElement","useEventCallback","useForceUpdate","useFluent_unstable","useFluent","createToaster","EVENTS","useToaster","options","forceUpdate","toasterId","userToasterId","shortcuts","toaster","useState","targetDocument","lastActiveElementRef","useRef","isCorrectToaster","isFocusShortcut","e","focus","pauseAllToasts","useCallback","visibleToasts","forEach","toastId","toast","toasts","get","imperativeRef","current","pause","playAllToasts","play","getMostRecentVisibleToast","Array","from","reduce","cur","next","order","undefined","tryRestoreFocus","mostRecentToast","closeAllToasts","close","useEffect","addToastListener","eventType","callback","listener","detail","addEventListener","removeEventListener","buildToast","dismissToast","updateToast","dismissAllToasts","pauseToast","playToast","cleanupBuildListener","show","cleanupUpdateListener","update","cleanupDismissListener","dismiss","cleanupDismissAllListener","dismissAll","cleanupPauseListener","cleanupPlayListener","focusShortcutListener","activeElement","toastsToRender","Map","toRender","values","position","has","set","startsWith","push","unshift","isToastVisible"],"mappings":"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"}

package/lib-commonjs/components/ToastContainer/useToastContainer.js

@@ -10,8 +10,9 @@ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildc
 const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 const _reactUtilities = require("@fluentui/react-utilities");
 const _reactSharedContexts = require("@fluentui/react-shared-contexts");
-const _timer = require("../Timer/Timer");
+const _keyboardKeys = require("@fluentui/keyboard-keys");
 const _reactTabster = require("@fluentui/react-tabster");
+const _timer = require("../Timer/Timer");
 const intentPolitenessMap = {
     success: 'assertive',
     warning: 'assertive',
@@ -27,6 +28,16 @@ const useToastContainer_unstable = (props, ref)=>{
     const [running, setRunning] = _react.useState(false);
     const imperativePauseRef = _react.useRef(false);
     const focusedToastBeforeClose = _react.useRef(false);
+    const focusableGroupAttribute = (0, _reactTabster.useFocusableGroup)({
+        tabBehavior: 'limited-trap-focus',
+        // Users should only use Tab to focus into the toast
+        // Escape is already reserved to dismiss all toasts
+        ignoreDefaultKeydown: {
+            Tab: true,
+            Escape: true,
+            Enter: true
+        }
+    });
     const close = (0, _reactUtilities.useEventCallback)(()=>{
         var _toastRef_current;
         const activeElement = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement;
@@ -58,18 +69,12 @@ const useToastContainer_unstable = (props, ref)=>{
             setRunning(true);
         }
     });
-    const { findFirstFocusable  } = (0, _reactTabster.useFocusFinders)();
     _react.useImperativeHandle(imperativeRef, ()=>({
             focus: ()=>{
                 if (!toastRef.current) {
                     return;
                 }
-                const firstFocusable = findFirstFocusable(toastRef.current);
-                if (firstFocusable) {
-                    firstFocusable.focus();
-                } else {
-                    toastRef.current.focus();
-                }
+                toastRef.current.focus();
             },
             play: ()=>{
                 imperativePauseRef.current = false;
@@ -142,12 +147,23 @@ const useToastContainer_unstable = (props, ref)=>{
         play();
         userRootSlot === null || userRootSlot === void 0 ? void 0 : (_userRootSlot_onMouseEnter = userRootSlot.onMouseEnter) === null || _userRootSlot_onMouseEnter === void 0 ? void 0 : _userRootSlot_onMouseEnter.call(userRootSlot, e);
     });
+    const { findFirstFocusable , findLastFocusable  } = (0, _reactTabster.useFocusFinders)();
     const onKeyDown = (0, _reactUtilities.useEventCallback)((e)=>{
         var _userRootSlot_onKeyDown;
-        if (e.key === 'Escape') {
+        if (e.key === _keyboardKeys.Delete) {
             e.preventDefault();
             close();
         }
+        if (e.key === _keyboardKeys.Tab && e.currentTarget === e.target) {
+            e.preventDefault();
+            if (e.shiftKey) {
+                var _findLastFocusable;
+                (_findLastFocusable = findLastFocusable(e.currentTarget)) === null || _findLastFocusable === void 0 ? void 0 : _findLastFocusable.focus();
+            } else {
+                var _findFirstFocusable;
+                (_findFirstFocusable = findFirstFocusable(e.currentTarget)) === null || _findFirstFocusable === void 0 ? void 0 : _findFirstFocusable.focus();
+            }
+        }
         userRootSlot === null || userRootSlot === void 0 ? void 0 : (_userRootSlot_onKeyDown = userRootSlot.onKeyDown) === null || _userRootSlot_onKeyDown === void 0 ? void 0 : _userRootSlot_onKeyDown.call(userRootSlot, e);
     });
     _react.useEffect(()=>{
@@ -194,12 +210,13 @@ const useToastContainer_unstable = (props, ref)=>{
         root: (0, _reactUtilities.getNativeElementProps)('div', {
             ref: (0, _reactUtilities.useMergedRefs)(ref, toastRef, toastAnimationRef),
             children,
-            tabIndex: -1,
-            role: 'group',
+            tabIndex: 0,
+            role: 'listitem',
             'aria-labelledby': titleId,
             'aria-describedby': bodyId,
             ...rest,
             ...userRootSlot,
+            ...focusableGroupAttribute,
             onMouseEnter,
             onMouseLeave,
             onKeyDown

package/lib-commonjs/components/ToastContainer/useToastContainer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useToastContainer.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs, useEventCallback, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { Timer } from '../Timer/Timer';\nimport { useFocusFinders } from '@fluentui/react-tabster';\nconst intentPolitenessMap = {\n    success: 'assertive',\n    warning: 'assertive',\n    error: 'assertive',\n    info: 'polite'\n};\n/**\n * Create the state required to render ToastContainer.\n *\n * The returned state can be modified with hooks such as useToastContainerStyles_unstable,\n * before being passed to renderToastContainer_unstable.\n *\n * @param props - props from this instance of ToastContainer\n * @param ref - reference to root HTMLElement of ToastContainer\n */ export const useToastContainer_unstable = (props, ref)=>{\n    const { visible , children , close: closeProp , remove , updateId , announce , data , timeout: timerTimeout , politeness: desiredPoliteness , intent ='info' , pauseOnHover , pauseOnWindowBlur , imperativeRef , tryRestoreFocus , ...rest } = props;\n    const titleId = useId('toast-title');\n    const bodyId = useId('toast-body');\n    const toastRef = React.useRef(null);\n    const { targetDocument  } = useFluent_unstable();\n    const [running, setRunning] = React.useState(false);\n    const imperativePauseRef = React.useRef(false);\n    const focusedToastBeforeClose = React.useRef(false);\n    const close = useEventCallback(()=>{\n        var _toastRef_current;\n        const activeElement = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement;\n        if (activeElement && ((_toastRef_current = toastRef.current) === null || _toastRef_current === void 0 ? void 0 : _toastRef_current.contains(activeElement))) {\n            focusedToastBeforeClose.current = true;\n        }\n        closeProp();\n    });\n    const onStatusChange = useEventCallback((status)=>{\n        var _props_onStatusChange;\n        return (_props_onStatusChange = props.onStatusChange) === null || _props_onStatusChange === void 0 ? void 0 : _props_onStatusChange.call(props, null, {\n            status,\n            ...props\n        });\n    });\n    const pause = useEventCallback(()=>setRunning(false));\n    const play = useEventCallback(()=>{\n        var _toastRef_current;\n        if (imperativePauseRef.current) {\n            return;\n        }\n        var _targetDocument_activeElement;\n        const containsActive = !!((_toastRef_current = toastRef.current) === null || _toastRef_current === void 0 ? void 0 : _toastRef_current.contains((_targetDocument_activeElement = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement) !== null && _targetDocument_activeElement !== void 0 ? _targetDocument_activeElement : null));\n        if (timerTimeout < 0) {\n            setRunning(true);\n            return;\n        }\n        if (!containsActive) {\n            setRunning(true);\n        }\n    });\n    const { findFirstFocusable  } = useFocusFinders();\n    React.useImperativeHandle(imperativeRef, ()=>({\n            focus: ()=>{\n                if (!toastRef.current) {\n                    return;\n                }\n                const firstFocusable = findFirstFocusable(toastRef.current);\n                if (firstFocusable) {\n                    firstFocusable.focus();\n                } else {\n                    toastRef.current.focus();\n                }\n            },\n            play: ()=>{\n                imperativePauseRef.current = false;\n                play();\n            },\n            pause: ()=>{\n                imperativePauseRef.current = true;\n                pause();\n            }\n        }));\n    React.useEffect(()=>{\n        return ()=>onStatusChange('unmounted');\n    }, [\n        onStatusChange\n    ]);\n    React.useEffect(()=>{\n        if (!targetDocument) {\n            return;\n        }\n        if (pauseOnWindowBlur) {\n            var _targetDocument_defaultView, _targetDocument_defaultView1;\n            (_targetDocument_defaultView = targetDocument.defaultView) === null || _targetDocument_defaultView === void 0 ? void 0 : _targetDocument_defaultView.addEventListener('focus', play);\n            (_targetDocument_defaultView1 = targetDocument.defaultView) === null || _targetDocument_defaultView1 === void 0 ? void 0 : _targetDocument_defaultView1.addEventListener('blur', pause);\n            return ()=>{\n                var _targetDocument_defaultView, _targetDocument_defaultView1;\n                (_targetDocument_defaultView = targetDocument.defaultView) === null || _targetDocument_defaultView === void 0 ? void 0 : _targetDocument_defaultView.removeEventListener('focus', play);\n                (_targetDocument_defaultView1 = targetDocument.defaultView) === null || _targetDocument_defaultView1 === void 0 ? void 0 : _targetDocument_defaultView1.removeEventListener('blur', pause);\n            };\n        }\n    }, [\n        targetDocument,\n        pause,\n        play,\n        pauseOnWindowBlur\n    ]);\n    // It's impossible to animate to height: auto in CSS, the actual pixel value must be known\n    // Get the height of the toast before animation styles have been applied and set a CSS\n    // variable with its height. The CSS variable will be used by the styles\n    const onTransitionEntering = ()=>{\n        if (!toastRef.current) {\n            return;\n        }\n        const element = toastRef.current;\n        element.style.setProperty('--fui-toast-height', `${element.scrollHeight}px`);\n    };\n    // Users never actually use ToastContainer as a JSX but imperatively through useToastContainerController\n    const userRootSlot = data.root;\n    // Using a ref callback here because addEventListener supports `once`\n    const toastAnimationRef = React.useCallback((el)=>{\n        if (el && toastRef.current) {\n            toastRef.current.addEventListener('animationend', ()=>{\n                // start toast once it's fully animated in\n                play();\n                onStatusChange('visible');\n            }, {\n                once: true\n            });\n        }\n    }, [\n        play,\n        onStatusChange\n    ]);\n    const onMouseEnter = useEventCallback((e)=>{\n        var _userRootSlot_onMouseEnter;\n        pause();\n        userRootSlot === null || userRootSlot === void 0 ? void 0 : (_userRootSlot_onMouseEnter = userRootSlot.onMouseEnter) === null || _userRootSlot_onMouseEnter === void 0 ? void 0 : _userRootSlot_onMouseEnter.call(userRootSlot, e);\n    });\n    const onMouseLeave = useEventCallback((e)=>{\n        var _userRootSlot_onMouseEnter;\n        play();\n        userRootSlot === null || userRootSlot === void 0 ? void 0 : (_userRootSlot_onMouseEnter = userRootSlot.onMouseEnter) === null || _userRootSlot_onMouseEnter === void 0 ? void 0 : _userRootSlot_onMouseEnter.call(userRootSlot, e);\n    });\n    const onKeyDown = useEventCallback((e)=>{\n        var _userRootSlot_onKeyDown;\n        if (e.key === 'Escape') {\n            e.preventDefault();\n            close();\n        }\n        userRootSlot === null || userRootSlot === void 0 ? void 0 : (_userRootSlot_onKeyDown = userRootSlot.onKeyDown) === null || _userRootSlot_onKeyDown === void 0 ? void 0 : _userRootSlot_onKeyDown.call(userRootSlot, e);\n    });\n    React.useEffect(()=>{\n        var _toastRef_current;\n        if (!visible) {\n            return;\n        }\n        const politeness = desiredPoliteness !== null && desiredPoliteness !== void 0 ? desiredPoliteness : intentPolitenessMap[intent];\n        var _toastRef_current_textContent;\n        announce((_toastRef_current_textContent = (_toastRef_current = toastRef.current) === null || _toastRef_current === void 0 ? void 0 : _toastRef_current.textContent) !== null && _toastRef_current_textContent !== void 0 ? _toastRef_current_textContent : '', {\n            politeness\n        });\n    }, [\n        announce,\n        desiredPoliteness,\n        toastRef,\n        visible,\n        updateId,\n        intent\n    ]);\n    React.useEffect(()=>{\n        return ()=>{\n            if (focusedToastBeforeClose.current) {\n                focusedToastBeforeClose.current = false;\n                tryRestoreFocus();\n            }\n        };\n    }, [\n        tryRestoreFocus\n    ]);\n    return {\n        components: {\n            timer: Timer,\n            root: 'div'\n        },\n        timer: resolveShorthand({\n            key: updateId,\n            onTimeout: close,\n            running,\n            timeout: timerTimeout !== null && timerTimeout !== void 0 ? timerTimeout : -1\n        }, {\n            required: true\n        }),\n        root: getNativeElementProps('div', {\n            ref: useMergedRefs(ref, toastRef, toastAnimationRef),\n            children,\n            tabIndex: -1,\n            role: 'group',\n            'aria-labelledby': titleId,\n            'aria-describedby': bodyId,\n            ...rest,\n            ...userRootSlot,\n            onMouseEnter,\n            onMouseLeave,\n            onKeyDown\n        }),\n        timerTimeout,\n        transitionTimeout: 500,\n        running,\n        visible,\n        remove,\n        close,\n        onTransitionEntering,\n        updateId,\n        nodeRef: toastRef,\n        intent,\n        titleId,\n        bodyId\n    };\n};\n"],"names":["useToastContainer_unstable","intentPolitenessMap","success","warning","error","info","props","ref","visible","children","close","closeProp","remove","updateId","announce","data","timeout","timerTimeout","politeness","desiredPoliteness","intent","pauseOnHover","pauseOnWindowBlur","imperativeRef","tryRestoreFocus","rest","titleId","useId","bodyId","toastRef","React","useRef","targetDocument","useFluent_unstable","running","setRunning","useState","imperativePauseRef","focusedToastBeforeClose","useEventCallback","_toastRef_current","activeElement","current","contains","onStatusChange","status","_props_onStatusChange","call","pause","play","_targetDocument_activeElement","containsActive","findFirstFocusable","useFocusFinders","useImperativeHandle","focus","firstFocusable","useEffect","_targetDocument_defaultView","_targetDocument_defaultView1","defaultView","addEventListener","removeEventListener","onTransitionEntering","element","style","setProperty","scrollHeight","userRootSlot","root","toastAnimationRef","useCallback","el","once","onMouseEnter","e","_userRootSlot_onMouseEnter","onMouseLeave","onKeyDown","_userRootSlot_onKeyDown","key","preventDefault","_toastRef_current_textContent","textContent","components","timer","Timer","resolveShorthand","onTimeout","required","getNativeElementProps","useMergedRefs","tabIndex","role","transitionTimeout","nodeRef"],"mappings":"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"}
+{"version":3,"sources":["useToastContainer.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, useMergedRefs, useEventCallback, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { Delete, Tab } from '@fluentui/keyboard-keys';\nimport { useFocusableGroup, useFocusFinders } from '@fluentui/react-tabster';\nimport { Timer } from '../Timer/Timer';\nconst intentPolitenessMap = {\n    success: 'assertive',\n    warning: 'assertive',\n    error: 'assertive',\n    info: 'polite'\n};\n/**\n * Create the state required to render ToastContainer.\n *\n * The returned state can be modified with hooks such as useToastContainerStyles_unstable,\n * before being passed to renderToastContainer_unstable.\n *\n * @param props - props from this instance of ToastContainer\n * @param ref - reference to root HTMLElement of ToastContainer\n */ export const useToastContainer_unstable = (props, ref)=>{\n    const { visible , children , close: closeProp , remove , updateId , announce , data , timeout: timerTimeout , politeness: desiredPoliteness , intent ='info' , pauseOnHover , pauseOnWindowBlur , imperativeRef , tryRestoreFocus , ...rest } = props;\n    const titleId = useId('toast-title');\n    const bodyId = useId('toast-body');\n    const toastRef = React.useRef(null);\n    const { targetDocument  } = useFluent_unstable();\n    const [running, setRunning] = React.useState(false);\n    const imperativePauseRef = React.useRef(false);\n    const focusedToastBeforeClose = React.useRef(false);\n    const focusableGroupAttribute = useFocusableGroup({\n        tabBehavior: 'limited-trap-focus',\n        // Users should only use Tab to focus into the toast\n        // Escape is already reserved to dismiss all toasts\n        ignoreDefaultKeydown: {\n            Tab: true,\n            Escape: true,\n            Enter: true\n        }\n    });\n    const close = useEventCallback(()=>{\n        var _toastRef_current;\n        const activeElement = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement;\n        if (activeElement && ((_toastRef_current = toastRef.current) === null || _toastRef_current === void 0 ? void 0 : _toastRef_current.contains(activeElement))) {\n            focusedToastBeforeClose.current = true;\n        }\n        closeProp();\n    });\n    const onStatusChange = useEventCallback((status)=>{\n        var _props_onStatusChange;\n        return (_props_onStatusChange = props.onStatusChange) === null || _props_onStatusChange === void 0 ? void 0 : _props_onStatusChange.call(props, null, {\n            status,\n            ...props\n        });\n    });\n    const pause = useEventCallback(()=>setRunning(false));\n    const play = useEventCallback(()=>{\n        var _toastRef_current;\n        if (imperativePauseRef.current) {\n            return;\n        }\n        var _targetDocument_activeElement;\n        const containsActive = !!((_toastRef_current = toastRef.current) === null || _toastRef_current === void 0 ? void 0 : _toastRef_current.contains((_targetDocument_activeElement = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement) !== null && _targetDocument_activeElement !== void 0 ? _targetDocument_activeElement : null));\n        if (timerTimeout < 0) {\n            setRunning(true);\n            return;\n        }\n        if (!containsActive) {\n            setRunning(true);\n        }\n    });\n    React.useImperativeHandle(imperativeRef, ()=>({\n            focus: ()=>{\n                if (!toastRef.current) {\n                    return;\n                }\n                toastRef.current.focus();\n            },\n            play: ()=>{\n                imperativePauseRef.current = false;\n                play();\n            },\n            pause: ()=>{\n                imperativePauseRef.current = true;\n                pause();\n            }\n        }));\n    React.useEffect(()=>{\n        return ()=>onStatusChange('unmounted');\n    }, [\n        onStatusChange\n    ]);\n    React.useEffect(()=>{\n        if (!targetDocument) {\n            return;\n        }\n        if (pauseOnWindowBlur) {\n            var _targetDocument_defaultView, _targetDocument_defaultView1;\n            (_targetDocument_defaultView = targetDocument.defaultView) === null || _targetDocument_defaultView === void 0 ? void 0 : _targetDocument_defaultView.addEventListener('focus', play);\n            (_targetDocument_defaultView1 = targetDocument.defaultView) === null || _targetDocument_defaultView1 === void 0 ? void 0 : _targetDocument_defaultView1.addEventListener('blur', pause);\n            return ()=>{\n                var _targetDocument_defaultView, _targetDocument_defaultView1;\n                (_targetDocument_defaultView = targetDocument.defaultView) === null || _targetDocument_defaultView === void 0 ? void 0 : _targetDocument_defaultView.removeEventListener('focus', play);\n                (_targetDocument_defaultView1 = targetDocument.defaultView) === null || _targetDocument_defaultView1 === void 0 ? void 0 : _targetDocument_defaultView1.removeEventListener('blur', pause);\n            };\n        }\n    }, [\n        targetDocument,\n        pause,\n        play,\n        pauseOnWindowBlur\n    ]);\n    // It's impossible to animate to height: auto in CSS, the actual pixel value must be known\n    // Get the height of the toast before animation styles have been applied and set a CSS\n    // variable with its height. The CSS variable will be used by the styles\n    const onTransitionEntering = ()=>{\n        if (!toastRef.current) {\n            return;\n        }\n        const element = toastRef.current;\n        element.style.setProperty('--fui-toast-height', `${element.scrollHeight}px`);\n    };\n    // Users never actually use ToastContainer as a JSX but imperatively through useToastContainerController\n    const userRootSlot = data.root;\n    // Using a ref callback here because addEventListener supports `once`\n    const toastAnimationRef = React.useCallback((el)=>{\n        if (el && toastRef.current) {\n            toastRef.current.addEventListener('animationend', ()=>{\n                // start toast once it's fully animated in\n                play();\n                onStatusChange('visible');\n            }, {\n                once: true\n            });\n        }\n    }, [\n        play,\n        onStatusChange\n    ]);\n    const onMouseEnter = useEventCallback((e)=>{\n        var _userRootSlot_onMouseEnter;\n        pause();\n        userRootSlot === null || userRootSlot === void 0 ? void 0 : (_userRootSlot_onMouseEnter = userRootSlot.onMouseEnter) === null || _userRootSlot_onMouseEnter === void 0 ? void 0 : _userRootSlot_onMouseEnter.call(userRootSlot, e);\n    });\n    const onMouseLeave = useEventCallback((e)=>{\n        var _userRootSlot_onMouseEnter;\n        play();\n        userRootSlot === null || userRootSlot === void 0 ? void 0 : (_userRootSlot_onMouseEnter = userRootSlot.onMouseEnter) === null || _userRootSlot_onMouseEnter === void 0 ? void 0 : _userRootSlot_onMouseEnter.call(userRootSlot, e);\n    });\n    const { findFirstFocusable , findLastFocusable  } = useFocusFinders();\n    const onKeyDown = useEventCallback((e)=>{\n        var _userRootSlot_onKeyDown;\n        if (e.key === Delete) {\n            e.preventDefault();\n            close();\n        }\n        if (e.key === Tab && e.currentTarget === e.target) {\n            e.preventDefault();\n            if (e.shiftKey) {\n                var _findLastFocusable;\n                (_findLastFocusable = findLastFocusable(e.currentTarget)) === null || _findLastFocusable === void 0 ? void 0 : _findLastFocusable.focus();\n            } else {\n                var _findFirstFocusable;\n                (_findFirstFocusable = findFirstFocusable(e.currentTarget)) === null || _findFirstFocusable === void 0 ? void 0 : _findFirstFocusable.focus();\n            }\n        }\n        userRootSlot === null || userRootSlot === void 0 ? void 0 : (_userRootSlot_onKeyDown = userRootSlot.onKeyDown) === null || _userRootSlot_onKeyDown === void 0 ? void 0 : _userRootSlot_onKeyDown.call(userRootSlot, e);\n    });\n    React.useEffect(()=>{\n        var _toastRef_current;\n        if (!visible) {\n            return;\n        }\n        const politeness = desiredPoliteness !== null && desiredPoliteness !== void 0 ? desiredPoliteness : intentPolitenessMap[intent];\n        var _toastRef_current_textContent;\n        announce((_toastRef_current_textContent = (_toastRef_current = toastRef.current) === null || _toastRef_current === void 0 ? void 0 : _toastRef_current.textContent) !== null && _toastRef_current_textContent !== void 0 ? _toastRef_current_textContent : '', {\n            politeness\n        });\n    }, [\n        announce,\n        desiredPoliteness,\n        toastRef,\n        visible,\n        updateId,\n        intent\n    ]);\n    React.useEffect(()=>{\n        return ()=>{\n            if (focusedToastBeforeClose.current) {\n                focusedToastBeforeClose.current = false;\n                tryRestoreFocus();\n            }\n        };\n    }, [\n        tryRestoreFocus\n    ]);\n    return {\n        components: {\n            timer: Timer,\n            root: 'div'\n        },\n        timer: resolveShorthand({\n            key: updateId,\n            onTimeout: close,\n            running,\n            timeout: timerTimeout !== null && timerTimeout !== void 0 ? timerTimeout : -1\n        }, {\n            required: true\n        }),\n        root: getNativeElementProps('div', {\n            ref: useMergedRefs(ref, toastRef, toastAnimationRef),\n            children,\n            tabIndex: 0,\n            role: 'listitem',\n            'aria-labelledby': titleId,\n            'aria-describedby': bodyId,\n            ...rest,\n            ...userRootSlot,\n            ...focusableGroupAttribute,\n            onMouseEnter,\n            onMouseLeave,\n            onKeyDown\n        }),\n        timerTimeout,\n        transitionTimeout: 500,\n        running,\n        visible,\n        remove,\n        close,\n        onTransitionEntering,\n        updateId,\n        nodeRef: toastRef,\n        intent,\n        titleId,\n        bodyId\n    };\n};\n"],"names":["useToastContainer_unstable","intentPolitenessMap","success","warning","error","info","props","ref","visible","children","close","closeProp","remove","updateId","announce","data","timeout","timerTimeout","politeness","desiredPoliteness","intent","pauseOnHover","pauseOnWindowBlur","imperativeRef","tryRestoreFocus","rest","titleId","useId","bodyId","toastRef","React","useRef","targetDocument","useFluent_unstable","running","setRunning","useState","imperativePauseRef","focusedToastBeforeClose","focusableGroupAttribute","useFocusableGroup","tabBehavior","ignoreDefaultKeydown","Tab","Escape","Enter","useEventCallback","_toastRef_current","activeElement","current","contains","onStatusChange","status","_props_onStatusChange","call","pause","play","_targetDocument_activeElement","containsActive","useImperativeHandle","focus","useEffect","_targetDocument_defaultView","_targetDocument_defaultView1","defaultView","addEventListener","removeEventListener","onTransitionEntering","element","style","setProperty","scrollHeight","userRootSlot","root","toastAnimationRef","useCallback","el","once","onMouseEnter","e","_userRootSlot_onMouseEnter","onMouseLeave","findFirstFocusable","findLastFocusable","useFocusFinders","onKeyDown","_userRootSlot_onKeyDown","key","Delete","preventDefault","currentTarget","target","shiftKey","_findLastFocusable","_findFirstFocusable","_toastRef_current_textContent","textContent","components","timer","Timer","resolveShorthand","onTimeout","required","getNativeElementProps","useMergedRefs","tabIndex","role","transitionTimeout","nodeRef"],"mappings":"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"}

package/lib-commonjs/components/ToastContainer/useToastContainerStyles.styles.js

@@ -9,11 +9,11 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    toastClassNames: ()=>toastClassNames,
+    toastContainerClassNames: ()=>toastContainerClassNames,
     useToastContainerStyles_unstable: ()=>useToastContainerStyles_unstable
 });
 const _react = require("@griffel/react");
-const toastClassNames = {
+const toastContainerClassNames = {
     root: 'fui-ToastContainer',
     timer: 'fui-ToastContainer__timer'
 };
@@ -59,6 +59,6 @@ const useRootBaseClassName = /*#__PURE__*/ (0, _react["__resetStyles"])("r1qaza6
 const useToastContainerStyles_unstable = (state)=>{
     const rootBaseClassName = useRootBaseClassName();
     const styles = useStyles();
-    state.root.className = (0, _react.mergeClasses)(toastClassNames.root, rootBaseClassName, state.visible ? styles.enter : styles.exit, state.root.className);
+    state.root.className = (0, _react.mergeClasses)(toastContainerClassNames.root, rootBaseClassName, state.visible ? styles.enter : styles.exit, state.root.className);
     return state;
 }; //# sourceMappingURL=useToastContainerStyles.styles.js.map

package/lib-commonjs/components/ToastContainer/useToastContainerStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useToastContainerStyles.styles.js"],"sourcesContent":["import { __resetStyles, __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const toastClassNames = {\n  root: 'fui-ToastContainer',\n  timer: 'fui-ToastContainer__timer'\n};\nconst useRootBaseClassName = /*#__PURE__*/__resetStyles(\"r1qaza64\", \"r1e6dlul\", [\".r1qaza64{box-sizing:border-box;margin-top:16px;min-height:44px;pointer-events:all;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);--fui-toast-height:44px;}\", \".r1qaza64[data-fui-focus-visible]{outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);}\", \".r1e6dlul{box-sizing:border-box;margin-top:16px;min-height:44px;pointer-events:all;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);--fui-toast-height:44px;}\", \".r1e6dlul[data-fui-focus-visible]{outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);}\"]);\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  enter: {\n    vin17d: \"fayl5bc\",\n    m1gqa9: \"f17oyct0\",\n    Bv12yb3: \"fvv8lvk\"\n  },\n  exit: {\n    vin17d: \"f1tk3cza\",\n    m1gqa9: \"f1nx6yy9\",\n    Bv12yb3: \"f9wuypy\"\n  }\n}, {\n  d: [\".fayl5bc{-webkit-animation-duration:200ms,400ms;animation-duration:200ms,400ms;}\", \".f17oyct0{-webkit-animation-delay:0ms,200ms;animation-delay:0ms,200ms;}\", \".fvv8lvk{-webkit-animation-name:f1rp83na,f5j8bii;animation-name:f1rp83na,f5j8bii;}\", \".f1tk3cza{-webkit-animation-duration:400ms,200ms;animation-duration:400ms,200ms;}\", \".f1nx6yy9{-webkit-animation-delay:0ms,400ms;animation-delay:0ms,400ms;}\", \".f9wuypy{-webkit-animation-name:fk0lfw7,f1n32sdh;animation-name:fk0lfw7,f1n32sdh;}\"],\n  k: [\"@-webkit-keyframes f1rp83na{from{max-height:0;opacity:0;margin-top:0;}to{margin-top:16px;opacity:0;max-height:var(--fui-toast-height);}}\", \"@keyframes f1rp83na{from{max-height:0;opacity:0;margin-top:0;}to{margin-top:16px;opacity:0;max-height:var(--fui-toast-height);}}\", \"@-webkit-keyframes f5j8bii{from{opacity:0;}to{opacity:1;}}\", \"@keyframes f5j8bii{from{opacity:0;}to{opacity:1;}}\", \"@-webkit-keyframes fk0lfw7{from{opacity:1;}to{opacity:0;}}\", \"@keyframes fk0lfw7{from{opacity:1;}to{opacity:0;}}\", \"@-webkit-keyframes f1n32sdh{from{opacity:0;}to{opacity:0;margin-top:0;max-height:0;}}\", \"@keyframes f1n32sdh{from{opacity:0;}to{opacity:0;margin-top:0;max-height:0;}}\"]\n});\n/**\n * Apply styling to the ToastContainer slots based on the state\n */\nexport const useToastContainerStyles_unstable = state => {\n  const rootBaseClassName = useRootBaseClassName();\n  const styles = useStyles();\n  state.root.className = mergeClasses(toastClassNames.root, rootBaseClassName, state.visible ? styles.enter : styles.exit, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useToastContainerStyles.styles.js.map"],"names":["toastClassNames","useToastContainerStyles_unstable","root","timer","useRootBaseClassName","__resetStyles","useStyles","__styles","enter","vin17d","m1gqa9","Bv12yb3","exit","d","k","state","rootBaseClassName","styles","className","mergeClasses","visible"],"mappings":";;;;;;;;;;;IAGaA,eAAe,MAAfA;IA0BAC,gCAAgC,MAAhCA;;uBA7BqD;AAG3D,MAAMD,kBAAkB;IAC7BE,MAAM;IACNC,OAAO;AACT;AACA,MAAMC,uBAAuB,WAAW,GAAEC,IAAAA,uBAAa,EAAC,YAAY,YAAY;IAAC;IAA4T;IAAwI;IAA4T;CAAuI;AACx9B;;CAEC,GACD,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCC,OAAO;QACLC,QAAQ;QACRC,QAAQ;QACRC,SAAS;IACX;IACAC,MAAM;QACJH,QAAQ;QACRC,QAAQ;QACRC,SAAS;IACX;AACF,GAAG;IACDE,GAAG;QAAC;QAAoF;QAA2E;QAAsF;QAAqF;QAA2E;KAAqF;IAC9eC,GAAG;QAAC;QAA4I;QAAoI;QAA8D;QAAsD;QAA8D;QAAsD;QAAyF;KAAgF;AACvqB;AAIO,MAAMb,mCAAmCc,CAAAA,QAAS;IACvD,MAAMC,oBAAoBZ;IAC1B,MAAMa,SAASX;IACfS,MAAMb,IAAI,CAACgB,SAAS,GAAGC,IAAAA,mBAAY,EAACnB,gBAAgBE,IAAI,EAAEc,mBAAmBD,MAAMK,OAAO,GAAGH,OAAOT,KAAK,GAAGS,OAAOL,IAAI,EAAEG,MAAMb,IAAI,CAACgB,SAAS;IAC7I,OAAOH;AACT,GACA,0DAA0D"}
+{"version":3,"sources":["useToastContainerStyles.styles.js"],"sourcesContent":["import { __resetStyles, __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nexport const toastContainerClassNames = {\n  root: 'fui-ToastContainer',\n  timer: 'fui-ToastContainer__timer'\n};\nconst useRootBaseClassName = /*#__PURE__*/__resetStyles(\"r1qaza64\", \"r1e6dlul\", [\".r1qaza64{box-sizing:border-box;margin-top:16px;min-height:44px;pointer-events:all;border-bottom-right-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);--fui-toast-height:44px;}\", \".r1qaza64[data-fui-focus-visible]{outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);}\", \".r1e6dlul{box-sizing:border-box;margin-top:16px;min-height:44px;pointer-events:all;border-bottom-left-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);border-top-left-radius:var(--borderRadiusMedium);border-top-right-radius:var(--borderRadiusMedium);--fui-toast-height:44px;}\", \".r1e6dlul[data-fui-focus-visible]{outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);}\"]);\n/**\n * Styles for the root slot\n */\nconst useStyles = /*#__PURE__*/__styles({\n  enter: {\n    vin17d: \"fayl5bc\",\n    m1gqa9: \"f17oyct0\",\n    Bv12yb3: \"fvv8lvk\"\n  },\n  exit: {\n    vin17d: \"f1tk3cza\",\n    m1gqa9: \"f1nx6yy9\",\n    Bv12yb3: \"f9wuypy\"\n  }\n}, {\n  d: [\".fayl5bc{-webkit-animation-duration:200ms,400ms;animation-duration:200ms,400ms;}\", \".f17oyct0{-webkit-animation-delay:0ms,200ms;animation-delay:0ms,200ms;}\", \".fvv8lvk{-webkit-animation-name:f1rp83na,f5j8bii;animation-name:f1rp83na,f5j8bii;}\", \".f1tk3cza{-webkit-animation-duration:400ms,200ms;animation-duration:400ms,200ms;}\", \".f1nx6yy9{-webkit-animation-delay:0ms,400ms;animation-delay:0ms,400ms;}\", \".f9wuypy{-webkit-animation-name:fk0lfw7,f1n32sdh;animation-name:fk0lfw7,f1n32sdh;}\"],\n  k: [\"@-webkit-keyframes f1rp83na{from{max-height:0;opacity:0;margin-top:0;}to{margin-top:16px;opacity:0;max-height:var(--fui-toast-height);}}\", \"@keyframes f1rp83na{from{max-height:0;opacity:0;margin-top:0;}to{margin-top:16px;opacity:0;max-height:var(--fui-toast-height);}}\", \"@-webkit-keyframes f5j8bii{from{opacity:0;}to{opacity:1;}}\", \"@keyframes f5j8bii{from{opacity:0;}to{opacity:1;}}\", \"@-webkit-keyframes fk0lfw7{from{opacity:1;}to{opacity:0;}}\", \"@keyframes fk0lfw7{from{opacity:1;}to{opacity:0;}}\", \"@-webkit-keyframes f1n32sdh{from{opacity:0;}to{opacity:0;margin-top:0;max-height:0;}}\", \"@keyframes f1n32sdh{from{opacity:0;}to{opacity:0;margin-top:0;max-height:0;}}\"]\n});\n/**\n * Apply styling to the ToastContainer slots based on the state\n */\nexport const useToastContainerStyles_unstable = state => {\n  const rootBaseClassName = useRootBaseClassName();\n  const styles = useStyles();\n  state.root.className = mergeClasses(toastContainerClassNames.root, rootBaseClassName, state.visible ? styles.enter : styles.exit, state.root.className);\n  return state;\n};\n//# sourceMappingURL=useToastContainerStyles.styles.js.map"],"names":["toastContainerClassNames","useToastContainerStyles_unstable","root","timer","useRootBaseClassName","__resetStyles","useStyles","__styles","enter","vin17d","m1gqa9","Bv12yb3","exit","d","k","state","rootBaseClassName","styles","className","mergeClasses","visible"],"mappings":";;;;;;;;;;;IAGaA,wBAAwB,MAAxBA;IA0BAC,gCAAgC,MAAhCA;;uBA7BqD;AAG3D,MAAMD,2BAA2B;IACtCE,MAAM;IACNC,OAAO;AACT;AACA,MAAMC,uBAAuB,WAAW,GAAEC,IAAAA,uBAAa,EAAC,YAAY,YAAY;IAAC;IAA4T;IAAwI;IAA4T;CAAuI;AACx9B;;CAEC,GACD,MAAMC,YAAY,WAAW,GAAEC,IAAAA,kBAAQ,EAAC;IACtCC,OAAO;QACLC,QAAQ;QACRC,QAAQ;QACRC,SAAS;IACX;IACAC,MAAM;QACJH,QAAQ;QACRC,QAAQ;QACRC,SAAS;IACX;AACF,GAAG;IACDE,GAAG;QAAC;QAAoF;QAA2E;QAAsF;QAAqF;QAA2E;KAAqF;IAC9eC,GAAG;QAAC;QAA4I;QAAoI;QAA8D;QAAsD;QAA8D;QAAsD;QAAyF;KAAgF;AACvqB;AAIO,MAAMb,mCAAmCc,CAAAA,QAAS;IACvD,MAAMC,oBAAoBZ;IAC1B,MAAMa,SAASX;IACfS,MAAMb,IAAI,CAACgB,SAAS,GAAGC,IAAAA,mBAAY,EAACnB,yBAAyBE,IAAI,EAAEc,mBAAmBD,MAAMK,OAAO,GAAGH,OAAOT,KAAK,GAAGS,OAAOL,IAAI,EAAEG,MAAMb,IAAI,CAACgB,SAAS;IACtJ,OAAOH;AACT,GACA,0DAA0D"}

package/lib-commonjs/components/Toaster/useToastAnnounce.js

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useToastAnnounce", {
+    enumerable: true,
+    get: ()=>useToastAnnounce
+});
+const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _reactUtilities = require("@fluentui/react-utilities");
+function useToastAnnounce(announce) {
+    const activeRef = _react.useRef(true);
+    const cleanupRef = _react.useRef(()=>undefined);
+    const announceToast = _react.useCallback((message, options)=>{
+        if (activeRef.current) {
+            announce(message, options);
+        }
+    }, [
+        announce
+    ]);
+    const toasterRef = _react.useCallback((el)=>{
+        if (!el) {
+            cleanupRef.current();
+            return;
+        }
+        const onFocusIn = (e)=>{
+            if ((0, _reactUtilities.isHTMLElement)(e.currentTarget) && e.currentTarget.contains((0, _reactUtilities.isHTMLElement)(e.relatedTarget) ? e.relatedTarget : null)) {
+                return;
+            }
+            activeRef.current = false;
+        };
+        const onFocusOut = (e)=>{
+            if ((0, _reactUtilities.isHTMLElement)(e.currentTarget) && e.currentTarget.contains((0, _reactUtilities.isHTMLElement)(e.relatedTarget) ? e.relatedTarget : null)) {
+                return;
+            }
+            activeRef.current = true;
+        };
+        el.addEventListener('focusin', onFocusIn);
+        el.addEventListener('focusout', onFocusOut);
+        cleanupRef.current = ()=>{
+            el.removeEventListener('focusin', onFocusIn);
+            el.removeEventListener('focusout', onFocusOut);
+        };
+    }, []);
+    return {
+        announceToast,
+        toasterRef
+    };
+}

package/lib-commonjs/components/Toaster/useToastAnnounce.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useToastAnnounce.js"],"sourcesContent":["import * as React from 'react';\nimport { isHTMLElement } from '@fluentui/react-utilities';\n/**\n * Wraps an aria live announcement function.\n * Aria live announcements can be detrimental once the user is already navigating\n * multiple toasts. Once the user is focused inside the toaster, the announecments should be disabled.\n * @param announce\n * @returns A function to announce a toast and a ref to attach to the toaster element\n */ export function useToastAnnounce(announce) {\n    const activeRef = React.useRef(true);\n    const cleanupRef = React.useRef(()=>undefined);\n    const announceToast = React.useCallback((message, options)=>{\n        if (activeRef.current) {\n            announce(message, options);\n        }\n    }, [\n        announce\n    ]);\n    const toasterRef = React.useCallback((el)=>{\n        if (!el) {\n            cleanupRef.current();\n            return;\n        }\n        const onFocusIn = (e)=>{\n            if (isHTMLElement(e.currentTarget) && e.currentTarget.contains(isHTMLElement(e.relatedTarget) ? e.relatedTarget : null)) {\n                return;\n            }\n            activeRef.current = false;\n        };\n        const onFocusOut = (e)=>{\n            if (isHTMLElement(e.currentTarget) && e.currentTarget.contains(isHTMLElement(e.relatedTarget) ? e.relatedTarget : null)) {\n                return;\n            }\n            activeRef.current = true;\n        };\n        el.addEventListener('focusin', onFocusIn);\n        el.addEventListener('focusout', onFocusOut);\n        cleanupRef.current = ()=>{\n            el.removeEventListener('focusin', onFocusIn);\n            el.removeEventListener('focusout', onFocusOut);\n        };\n    }, []);\n    return {\n        announceToast,\n        toasterRef\n    };\n}\n"],"names":["useToastAnnounce","announce","activeRef","React","useRef","cleanupRef","undefined","announceToast","useCallback","message","options","current","toasterRef","el","onFocusIn","e","isHTMLElement","currentTarget","contains","relatedTarget","onFocusOut","addEventListener","removeEventListener"],"mappings":";;;;+BAQoBA;;aAAAA;;;6DARG;gCACO;AAOnB,SAASA,iBAAiBC,QAAQ,EAAE;IAC3C,MAAMC,YAAYC,OAAMC,MAAM,CAAC,IAAI;IACnC,MAAMC,aAAaF,OAAMC,MAAM,CAAC,IAAIE;IACpC,MAAMC,gBAAgBJ,OAAMK,WAAW,CAAC,CAACC,SAASC,UAAU;QACxD,IAAIR,UAAUS,OAAO,EAAE;YACnBV,SAASQ,SAASC;QACtB,CAAC;IACL,GAAG;QACCT;KACH;IACD,MAAMW,aAAaT,OAAMK,WAAW,CAAC,CAACK,KAAK;QACvC,IAAI,CAACA,IAAI;YACLR,WAAWM,OAAO;YAClB;QACJ,CAAC;QACD,MAAMG,YAAY,CAACC,IAAI;YACnB,IAAIC,IAAAA,6BAAa,EAACD,EAAEE,aAAa,KAAKF,EAAEE,aAAa,CAACC,QAAQ,CAACF,IAAAA,6BAAa,EAACD,EAAEI,aAAa,IAAIJ,EAAEI,aAAa,GAAG,IAAI,GAAG;gBACrH;YACJ,CAAC;YACDjB,UAAUS,OAAO,GAAG,KAAK;QAC7B;QACA,MAAMS,aAAa,CAACL,IAAI;YACpB,IAAIC,IAAAA,6BAAa,EAACD,EAAEE,aAAa,KAAKF,EAAEE,aAAa,CAACC,QAAQ,CAACF,IAAAA,6BAAa,EAACD,EAAEI,aAAa,IAAIJ,EAAEI,aAAa,GAAG,IAAI,GAAG;gBACrH;YACJ,CAAC;YACDjB,UAAUS,OAAO,GAAG,IAAI;QAC5B;QACAE,GAAGQ,gBAAgB,CAAC,WAAWP;QAC/BD,GAAGQ,gBAAgB,CAAC,YAAYD;QAChCf,WAAWM,OAAO,GAAG,IAAI;YACrBE,GAAGS,mBAAmB,CAAC,WAAWR;YAClCD,GAAGS,mBAAmB,CAAC,YAAYF;QACvC;IACJ,GAAG,EAAE;IACL,OAAO;QACHb;QACAK;IACJ;AACJ"}

package/lib-commonjs/components/Toaster/useToaster.js

@@ -10,50 +10,52 @@ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildc
 const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 const _reactUtilities = require("@fluentui/react-utilities");
 const _reactSharedContexts = require("@fluentui/react-shared-contexts");
+const _reactTabster = require("@fluentui/react-tabster");
+const _keyboardKeys = require("@fluentui/keyboard-keys");
 const _state = require("../../state");
 const _toastContainer = require("../ToastContainer");
+const _useToasterFocusManagement = require("./useToasterFocusManagement");
+const _useToastAnnounce = require("./useToastAnnounce");
 const useToaster_unstable = (props)=>{
     const { offset , announce: announceProp , ...rest } = props;
     const announceRef = _react.useRef(()=>null);
-    const { toastsToRender , isToastVisible , pauseAllToasts , playAllToasts , tryRestoreFocus  } = (0, _state.useToaster)(rest);
+    const { toastsToRender , isToastVisible , pauseAllToasts , playAllToasts , tryRestoreFocus , closeAllToasts  } = (0, _state.useToaster)(rest);
     const announce = _react.useCallback((message, options)=>announceRef.current(message, options), []);
     const { dir  } = (0, _reactSharedContexts.useFluent_unstable)();
     const rootProps = (0, _reactUtilities.getNativeElementProps)('div', rest);
-    // Adds native HTML focusin/focusout listeners
-    // https://github.com/facebook/react/issues/25194
-    const focusListenerRef = _react.useCallback((el)=>{
-        if (el) {
-            el.addEventListener('focusin', (e)=>{
-                if ((0, _reactUtilities.isHTMLElement)(e.currentTarget) && !e.currentTarget.contains((0, _reactUtilities.isHTMLElement)(e.relatedTarget) ? e.relatedTarget : null)) {
-                    pauseAllToasts();
-                }
-            });
-            el.addEventListener('focusout', (e)=>{
-                if ((0, _reactUtilities.isHTMLElement)(e.currentTarget) && !e.currentTarget.contains((0, _reactUtilities.isHTMLElement)(e.relatedTarget) ? e.relatedTarget : null)) {
-                    playAllToasts();
-                    tryRestoreFocus();
-                }
-            });
+    const focusableGroupAttr = (0, _reactTabster.useFocusableGroup)({
+        tabBehavior: 'limited-trap-focus',
+        ignoreDefaultKeydown: {
+            Escape: true
         }
-    }, [
-        playAllToasts,
-        pauseAllToasts,
-        tryRestoreFocus
-    ]);
-    const createPositionSlot = (toastPosition)=>{
+    });
+    const onKeyDown = (0, _reactUtilities.useEventCallback)((e)=>{
+        var _props_onKeyDown;
+        if (e.key === _keyboardKeys.Escape) {
+            e.preventDefault();
+            closeAllToasts();
+        }
+        (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, e);
+    });
+    const usePositionSlot = (toastPosition)=>{
         var _toastsToRender_get;
+        const focusManagementRef = (0, _useToasterFocusManagement.useToasterFocusManagement_unstable)(pauseAllToasts, playAllToasts);
+        const { announceToast , toasterRef  } = (0, _useToastAnnounce.useToastAnnounce)(announceProp !== null && announceProp !== void 0 ? announceProp : announce);
         return (0, _reactUtilities.resolveShorthand)(toastsToRender.has(toastPosition) ? rootProps : null, {
             defaultProps: {
-                ref: focusListenerRef,
+                ref: (0, _reactUtilities.useMergedRefs)(focusManagementRef, toasterRef),
                 children: (_toastsToRender_get = toastsToRender.get(toastPosition)) === null || _toastsToRender_get === void 0 ? void 0 : _toastsToRender_get.map((toast)=>/*#__PURE__*/ _react.createElement(_toastContainer.ToastContainer, {
                         ...toast,
                         tryRestoreFocus: tryRestoreFocus,
                         intent: toast.intent,
-                        announce: announce,
+                        announce: announceToast,
                         key: toast.toastId,
                         visible: isToastVisible(toast.toastId)
                     }, toast.content)),
-                'data-toaster-position': toastPosition
+                onKeyDown,
+                ...focusableGroupAttr,
+                'data-toaster-position': toastPosition,
+                role: 'list'
             }
         });
     };
@@ -69,10 +71,10 @@ const useToaster_unstable = (props)=>{
         root: (0, _reactUtilities.resolveShorthand)(rootProps, {
             required: true
         }),
-        bottomStart: createPositionSlot(_state.TOAST_POSITIONS.bottomStart),
-        bottomEnd: createPositionSlot(_state.TOAST_POSITIONS.bottomEnd),
-        topStart: createPositionSlot(_state.TOAST_POSITIONS.topStart),
-        topEnd: createPositionSlot(_state.TOAST_POSITIONS.topEnd),
+        bottomStart: usePositionSlot(_state.TOAST_POSITIONS.bottomStart),
+        bottomEnd: usePositionSlot(_state.TOAST_POSITIONS.bottomEnd),
+        topStart: usePositionSlot(_state.TOAST_POSITIONS.topStart),
+        topEnd: usePositionSlot(_state.TOAST_POSITIONS.topEnd),
         announceRef,
         offset,
         announce: announceProp !== null && announceProp !== void 0 ? announceProp : announce,

package/lib-commonjs/components/Toaster/useToaster.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useToaster.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, isHTMLElement, resolveShorthand } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { TOAST_POSITIONS, useToaster } from '../../state';\nimport { ToastContainer } from '../ToastContainer';\n/**\n * Create the state required to render Toaster.\n *\n * @param props - props from this instance of Toaster\n */ export const useToaster_unstable = (props)=>{\n    const { offset , announce: announceProp , ...rest } = props;\n    const announceRef = React.useRef(()=>null);\n    const { toastsToRender , isToastVisible , pauseAllToasts , playAllToasts , tryRestoreFocus  } = useToaster(rest);\n    const announce = React.useCallback((message, options)=>announceRef.current(message, options), []);\n    const { dir  } = useFluent();\n    const rootProps = getNativeElementProps('div', rest);\n    // Adds native HTML focusin/focusout listeners\n    // https://github.com/facebook/react/issues/25194\n    const focusListenerRef = React.useCallback((el)=>{\n        if (el) {\n            el.addEventListener('focusin', (e)=>{\n                if (isHTMLElement(e.currentTarget) && !e.currentTarget.contains(isHTMLElement(e.relatedTarget) ? e.relatedTarget : null)) {\n                    pauseAllToasts();\n                }\n            });\n            el.addEventListener('focusout', (e)=>{\n                if (isHTMLElement(e.currentTarget) && !e.currentTarget.contains(isHTMLElement(e.relatedTarget) ? e.relatedTarget : null)) {\n                    playAllToasts();\n                    tryRestoreFocus();\n                }\n            });\n        }\n    }, [\n        playAllToasts,\n        pauseAllToasts,\n        tryRestoreFocus\n    ]);\n    const createPositionSlot = (toastPosition)=>{\n        var _toastsToRender_get;\n        return resolveShorthand(toastsToRender.has(toastPosition) ? rootProps : null, {\n            defaultProps: {\n                ref: focusListenerRef,\n                children: (_toastsToRender_get = toastsToRender.get(toastPosition)) === null || _toastsToRender_get === void 0 ? void 0 : _toastsToRender_get.map((toast)=>/*#__PURE__*/ React.createElement(ToastContainer, {\n                        ...toast,\n                        tryRestoreFocus: tryRestoreFocus,\n                        intent: toast.intent,\n                        announce: announce,\n                        key: toast.toastId,\n                        visible: isToastVisible(toast.toastId)\n                    }, toast.content)),\n                'data-toaster-position': toastPosition\n            }\n        });\n    };\n    return {\n        dir,\n        components: {\n            root: 'div',\n            bottomStart: 'div',\n            bottomEnd: 'div',\n            topStart: 'div',\n            topEnd: 'div'\n        },\n        root: resolveShorthand(rootProps, {\n            required: true\n        }),\n        bottomStart: createPositionSlot(TOAST_POSITIONS.bottomStart),\n        bottomEnd: createPositionSlot(TOAST_POSITIONS.bottomEnd),\n        topStart: createPositionSlot(TOAST_POSITIONS.topStart),\n        topEnd: createPositionSlot(TOAST_POSITIONS.topEnd),\n        announceRef,\n        offset,\n        announce: announceProp !== null && announceProp !== void 0 ? announceProp : announce,\n        renderAriaLive: !announceProp\n    };\n};\n"],"names":["useToaster_unstable","props","offset","announce","announceProp","rest","announceRef","React","useRef","toastsToRender","isToastVisible","pauseAllToasts","playAllToasts","tryRestoreFocus","useToaster","useCallback","message","options","current","dir","useFluent","rootProps","getNativeElementProps","focusListenerRef","el","addEventListener","e","isHTMLElement","currentTarget","contains","relatedTarget","createPositionSlot","toastPosition","_toastsToRender_get","resolveShorthand","has","defaultProps","ref","children","get","map","toast","createElement","ToastContainer","intent","key","toastId","visible","content","components","root","bottomStart","bottomEnd","topStart","topEnd","required","TOAST_POSITIONS","renderAriaLive"],"mappings":";;;;+BASiBA;;aAAAA;;;6DATM;gCACgD;qCACvB;uBACJ;gCACb;AAKpB,MAAMA,sBAAsB,CAACC,QAAQ;IAC5C,MAAM,EAAEC,OAAM,EAAGC,UAAUC,aAAY,EAAG,GAAGC,MAAM,GAAGJ;IACtD,MAAMK,cAAcC,OAAMC,MAAM,CAAC,IAAI,IAAI;IACzC,MAAM,EAAEC,eAAc,EAAGC,eAAc,EAAGC,eAAc,EAAGC,cAAa,EAAGC,gBAAe,EAAG,GAAGC,IAAAA,iBAAU,EAACT;IAC3G,MAAMF,WAAWI,OAAMQ,WAAW,CAAC,CAACC,SAASC,UAAUX,YAAYY,OAAO,CAACF,SAASC,UAAU,EAAE;IAChG,MAAM,EAAEE,IAAG,EAAG,GAAGC,IAAAA,uCAAS;IAC1B,MAAMC,YAAYC,IAAAA,qCAAqB,EAAC,OAAOjB;IAC/C,8CAA8C;IAC9C,iDAAiD;IACjD,MAAMkB,mBAAmBhB,OAAMQ,WAAW,CAAC,CAACS,KAAK;QAC7C,IAAIA,IAAI;YACJA,GAAGC,gBAAgB,CAAC,WAAW,CAACC,IAAI;gBAChC,IAAIC,IAAAA,6BAAa,EAACD,EAAEE,aAAa,KAAK,CAACF,EAAEE,aAAa,CAACC,QAAQ,CAACF,IAAAA,6BAAa,EAACD,EAAEI,aAAa,IAAIJ,EAAEI,aAAa,GAAG,IAAI,GAAG;oBACtHnB;gBACJ,CAAC;YACL;YACAa,GAAGC,gBAAgB,CAAC,YAAY,CAACC,IAAI;gBACjC,IAAIC,IAAAA,6BAAa,EAACD,EAAEE,aAAa,KAAK,CAACF,EAAEE,aAAa,CAACC,QAAQ,CAACF,IAAAA,6BAAa,EAACD,EAAEI,aAAa,IAAIJ,EAAEI,aAAa,GAAG,IAAI,GAAG;oBACtHlB;oBACAC;gBACJ,CAAC;YACL;QACJ,CAAC;IACL,GAAG;QACCD;QACAD;QACAE;KACH;IACD,MAAMkB,qBAAqB,CAACC,gBAAgB;QACxC,IAAIC;QACJ,OAAOC,IAAAA,gCAAgB,EAACzB,eAAe0B,GAAG,CAACH,iBAAiBX,YAAY,IAAI,EAAE;YAC1Ee,cAAc;gBACVC,KAAKd;gBACLe,UAAU,AAACL,CAAAA,sBAAsBxB,eAAe8B,GAAG,CAACP,cAAa,MAAO,IAAI,IAAIC,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBO,GAAG,CAAC,CAACC,QAAQ,WAAW,GAAGlC,OAAMmC,aAAa,CAACC,8BAAc,EAAE;wBACrM,GAAGF,KAAK;wBACR5B,iBAAiBA;wBACjB+B,QAAQH,MAAMG,MAAM;wBACpBzC,UAAUA;wBACV0C,KAAKJ,MAAMK,OAAO;wBAClBC,SAASrC,eAAe+B,MAAMK,OAAO;oBACzC,GAAGL,MAAMO,OAAO,EAAE;gBACtB,yBAAyBhB;YAC7B;QACJ;IACJ;IACA,OAAO;QACHb;QACA8B,YAAY;YACRC,MAAM;YACNC,aAAa;YACbC,WAAW;YACXC,UAAU;YACVC,QAAQ;QACZ;QACAJ,MAAMhB,IAAAA,gCAAgB,EAACb,WAAW;YAC9BkC,UAAU,IAAI;QAClB;QACAJ,aAAapB,mBAAmByB,sBAAe,CAACL,WAAW;QAC3DC,WAAWrB,mBAAmByB,sBAAe,CAACJ,SAAS;QACvDC,UAAUtB,mBAAmByB,sBAAe,CAACH,QAAQ;QACrDC,QAAQvB,mBAAmByB,sBAAe,CAACF,MAAM;QACjDhD;QACAJ;QACAC,UAAUC,iBAAiB,IAAI,IAAIA,iBAAiB,KAAK,IAAIA,eAAeD,QAAQ;QACpFsD,gBAAgB,CAACrD;IACrB;AACJ"}
+{"version":3,"sources":["useToaster.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useFocusableGroup } from '@fluentui/react-tabster';\nimport { Escape } from '@fluentui/keyboard-keys';\nimport { TOAST_POSITIONS, useToaster } from '../../state';\nimport { ToastContainer } from '../ToastContainer';\nimport { useToasterFocusManagement_unstable } from './useToasterFocusManagement';\nimport { useToastAnnounce } from './useToastAnnounce';\n/**\n * Create the state required to render Toaster.\n *\n * @param props - props from this instance of Toaster\n */ export const useToaster_unstable = (props)=>{\n    const { offset , announce: announceProp , ...rest } = props;\n    const announceRef = React.useRef(()=>null);\n    const { toastsToRender , isToastVisible , pauseAllToasts , playAllToasts , tryRestoreFocus , closeAllToasts  } = useToaster(rest);\n    const announce = React.useCallback((message, options)=>announceRef.current(message, options), []);\n    const { dir  } = useFluent();\n    const rootProps = getNativeElementProps('div', rest);\n    const focusableGroupAttr = useFocusableGroup({\n        tabBehavior: 'limited-trap-focus',\n        ignoreDefaultKeydown: {\n            Escape: true\n        }\n    });\n    const onKeyDown = useEventCallback((e)=>{\n        var _props_onKeyDown;\n        if (e.key === Escape) {\n            e.preventDefault();\n            closeAllToasts();\n        }\n        (_props_onKeyDown = props.onKeyDown) === null || _props_onKeyDown === void 0 ? void 0 : _props_onKeyDown.call(props, e);\n    });\n    const usePositionSlot = (toastPosition)=>{\n        var _toastsToRender_get;\n        const focusManagementRef = useToasterFocusManagement_unstable(pauseAllToasts, playAllToasts);\n        const { announceToast , toasterRef  } = useToastAnnounce(announceProp !== null && announceProp !== void 0 ? announceProp : announce);\n        return resolveShorthand(toastsToRender.has(toastPosition) ? rootProps : null, {\n            defaultProps: {\n                ref: useMergedRefs(focusManagementRef, toasterRef),\n                children: (_toastsToRender_get = toastsToRender.get(toastPosition)) === null || _toastsToRender_get === void 0 ? void 0 : _toastsToRender_get.map((toast)=>/*#__PURE__*/ React.createElement(ToastContainer, {\n                        ...toast,\n                        tryRestoreFocus: tryRestoreFocus,\n                        intent: toast.intent,\n                        announce: announceToast,\n                        key: toast.toastId,\n                        visible: isToastVisible(toast.toastId)\n                    }, toast.content)),\n                onKeyDown,\n                ...focusableGroupAttr,\n                'data-toaster-position': toastPosition,\n                role: 'list'\n            }\n        });\n    };\n    return {\n        dir,\n        components: {\n            root: 'div',\n            bottomStart: 'div',\n            bottomEnd: 'div',\n            topStart: 'div',\n            topEnd: 'div'\n        },\n        root: resolveShorthand(rootProps, {\n            required: true\n        }),\n        bottomStart: usePositionSlot(TOAST_POSITIONS.bottomStart),\n        bottomEnd: usePositionSlot(TOAST_POSITIONS.bottomEnd),\n        topStart: usePositionSlot(TOAST_POSITIONS.topStart),\n        topEnd: usePositionSlot(TOAST_POSITIONS.topEnd),\n        announceRef,\n        offset,\n        announce: announceProp !== null && announceProp !== void 0 ? announceProp : announce,\n        renderAriaLive: !announceProp\n    };\n};\n"],"names":["useToaster_unstable","props","offset","announce","announceProp","rest","announceRef","React","useRef","toastsToRender","isToastVisible","pauseAllToasts","playAllToasts","tryRestoreFocus","closeAllToasts","useToaster","useCallback","message","options","current","dir","useFluent","rootProps","getNativeElementProps","focusableGroupAttr","useFocusableGroup","tabBehavior","ignoreDefaultKeydown","Escape","onKeyDown","useEventCallback","e","_props_onKeyDown","key","preventDefault","call","usePositionSlot","toastPosition","_toastsToRender_get","focusManagementRef","useToasterFocusManagement_unstable","announceToast","toasterRef","useToastAnnounce","resolveShorthand","has","defaultProps","ref","useMergedRefs","children","get","map","toast","createElement","ToastContainer","intent","toastId","visible","content","role","components","root","bottomStart","bottomEnd","topStart","topEnd","required","TOAST_POSITIONS","renderAriaLive"],"mappings":";;;;+BAaiBA;;aAAAA;;;6DAbM;gCACkE;qCACzC;8BACd;8BACX;uBACqB;gCACb;2CACoB;kCAClB;AAKtB,MAAMA,sBAAsB,CAACC,QAAQ;IAC5C,MAAM,EAAEC,OAAM,EAAGC,UAAUC,aAAY,EAAG,GAAGC,MAAM,GAAGJ;IACtD,MAAMK,cAAcC,OAAMC,MAAM,CAAC,IAAI,IAAI;IACzC,MAAM,EAAEC,eAAc,EAAGC,eAAc,EAAGC,eAAc,EAAGC,cAAa,EAAGC,gBAAe,EAAGC,eAAc,EAAG,GAAGC,IAAAA,iBAAU,EAACV;IAC5H,MAAMF,WAAWI,OAAMS,WAAW,CAAC,CAACC,SAASC,UAAUZ,YAAYa,OAAO,CAACF,SAASC,UAAU,EAAE;IAChG,MAAM,EAAEE,IAAG,EAAG,GAAGC,IAAAA,uCAAS;IAC1B,MAAMC,YAAYC,IAAAA,qCAAqB,EAAC,OAAOlB;IAC/C,MAAMmB,qBAAqBC,IAAAA,+BAAiB,EAAC;QACzCC,aAAa;QACbC,sBAAsB;YAClBC,QAAQ,IAAI;QAChB;IACJ;IACA,MAAMC,YAAYC,IAAAA,gCAAgB,EAAC,CAACC,IAAI;QACpC,IAAIC;QACJ,IAAID,EAAEE,GAAG,KAAKL,oBAAM,EAAE;YAClBG,EAAEG,cAAc;YAChBpB;QACJ,CAAC;QACAkB,CAAAA,mBAAmB/B,MAAM4B,SAAS,AAAD,MAAO,IAAI,IAAIG,qBAAqB,KAAK,IAAI,KAAK,IAAIA,iBAAiBG,IAAI,CAAClC,OAAO8B,EAAE;IAC3H;IACA,MAAMK,kBAAkB,CAACC,gBAAgB;QACrC,IAAIC;QACJ,MAAMC,qBAAqBC,IAAAA,6DAAkC,EAAC7B,gBAAgBC;QAC9E,MAAM,EAAE6B,cAAa,EAAGC,WAAU,EAAG,GAAGC,IAAAA,kCAAgB,EAACvC,iBAAiB,IAAI,IAAIA,iBAAiB,KAAK,IAAIA,eAAeD,QAAQ;QACnI,OAAOyC,IAAAA,gCAAgB,EAACnC,eAAeoC,GAAG,CAACR,iBAAiBf,YAAY,IAAI,EAAE;YAC1EwB,cAAc;gBACVC,KAAKC,IAAAA,6BAAa,EAACT,oBAAoBG;gBACvCO,UAAU,AAACX,CAAAA,sBAAsB7B,eAAeyC,GAAG,CAACb,cAAa,MAAO,IAAI,IAAIC,wBAAwB,KAAK,IAAI,KAAK,IAAIA,oBAAoBa,GAAG,CAAC,CAACC,QAAQ,WAAW,GAAG7C,OAAM8C,aAAa,CAACC,8BAAc,EAAE;wBACrM,GAAGF,KAAK;wBACRvC,iBAAiBA;wBACjB0C,QAAQH,MAAMG,MAAM;wBACpBpD,UAAUsC;wBACVR,KAAKmB,MAAMI,OAAO;wBAClBC,SAAS/C,eAAe0C,MAAMI,OAAO;oBACzC,GAAGJ,MAAMM,OAAO,EAAE;gBACtB7B;gBACA,GAAGL,kBAAkB;gBACrB,yBAAyBa;gBACzBsB,MAAM;YACV;QACJ;IACJ;IACA,OAAO;QACHvC;QACAwC,YAAY;YACRC,MAAM;YACNC,aAAa;YACbC,WAAW;YACXC,UAAU;YACVC,QAAQ;QACZ;QACAJ,MAAMjB,IAAAA,gCAAgB,EAACtB,WAAW;YAC9B4C,UAAU,IAAI;QAClB;QACAJ,aAAa1B,gBAAgB+B,sBAAe,CAACL,WAAW;QACxDC,WAAW3B,gBAAgB+B,sBAAe,CAACJ,SAAS;QACpDC,UAAU5B,gBAAgB+B,sBAAe,CAACH,QAAQ;QAClDC,QAAQ7B,gBAAgB+B,sBAAe,CAACF,MAAM;QAC9C3D;QACAJ;QACAC,UAAUC,iBAAiB,IAAI,IAAIA,iBAAiB,KAAK,IAAIA,eAAeD,QAAQ;QACpFiE,gBAAgB,CAAChE;IACrB;AACJ"}

package/lib-commonjs/components/Toaster/useToasterFocusManagement.js

@@ -0,0 +1,92 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useToasterFocusManagement_unstable", {
+    enumerable: true,
+    get: ()=>useToasterFocusManagement_unstable
+});
+const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
+const _reactUtilities = require("@fluentui/react-utilities");
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _reactSharedContexts = require("@fluentui/react-shared-contexts");
+const _keyboardKeys = require("@fluentui/keyboard-keys");
+const _toastContainer = require("../ToastContainer");
+const noop = ()=>undefined;
+function useToasterFocusManagement_unstable(pauseAllToasts, playAllToasts) {
+    const { targetDocument  } = (0, _reactSharedContexts.useFluent_unstable)();
+    const cleanupListenersRef = _react.useRef(noop);
+    return _react.useCallback((el)=>{
+        if (!el || !targetDocument) {
+            cleanupListenersRef.current();
+            cleanupListenersRef.current = noop;
+            return;
+        }
+        const toastContainerWalker = targetDocument.createTreeWalker(el, NodeFilter.SHOW_ELEMENT, {
+            acceptNode (node) {
+                if ((0, _reactUtilities.isHTMLElement)(node) && node.classList.contains(_toastContainer.toastContainerClassNames.root)) {
+                    return NodeFilter.FILTER_ACCEPT;
+                }
+                return NodeFilter.FILTER_SKIP;
+            }
+        });
+        /**
+       * FIXME: https://github.com/microsoft/tabster/issues/299
+       * Toasts  should be arrow navigable and focus should be trapped in a stack of tasts
+       * This is a temporary measure, Tabster does not have an API yet to enable mover arrow keys from within grouppers
+       * Once tabster fully supports this use case, remove this hook
+       */ const keydownListener = (e)=>{
+            const { target , key  } = e;
+            if (!(0, _reactUtilities.isHTMLElement)(target)) {
+                return;
+            }
+            if (key === _keyboardKeys.ArrowDown) {
+                toastContainerWalker.currentNode = target;
+                let nextToastContainer = toastContainerWalker.nextNode();
+                if (!nextToastContainer) {
+                    toastContainerWalker.currentNode = el;
+                    nextToastContainer = toastContainerWalker.nextNode();
+                }
+                if ((0, _reactUtilities.isHTMLElement)(nextToastContainer)) {
+                    nextToastContainer.focus();
+                }
+            }
+            if (key === _keyboardKeys.ArrowUp) {
+                toastContainerWalker.currentNode = target;
+                let prevToastContainer = toastContainerWalker.previousNode();
+                if (prevToastContainer && prevToastContainer.contains(target)) {
+                    prevToastContainer = toastContainerWalker.previousNode();
+                }
+                if (!prevToastContainer) {
+                    toastContainerWalker.currentNode = el;
+                    prevToastContainer = toastContainerWalker.lastChild();
+                }
+                if ((0, _reactUtilities.isHTMLElement)(prevToastContainer)) {
+                    prevToastContainer.focus();
+                }
+            }
+        };
+        const focusInListener = (e)=>{
+            if ((0, _reactUtilities.isHTMLElement)(e.currentTarget) && !e.currentTarget.contains((0, _reactUtilities.isHTMLElement)(e.relatedTarget) ? e.relatedTarget : null)) {
+                pauseAllToasts();
+            }
+        };
+        const focusOutListener = (e)=>{
+            if ((0, _reactUtilities.isHTMLElement)(e.currentTarget) && !e.currentTarget.contains((0, _reactUtilities.isHTMLElement)(e.relatedTarget) ? e.relatedTarget : null)) {
+                playAllToasts();
+            }
+        };
+        el.addEventListener('keydown', keydownListener);
+        el.addEventListener('focusin', focusInListener);
+        el.addEventListener('focusout', focusOutListener);
+        cleanupListenersRef.current = ()=>{
+            el.removeEventListener('keydown', keydownListener);
+            el.removeEventListener('focusin', focusInListener);
+            el.removeEventListener('focusout', focusOutListener);
+        };
+    }, [
+        targetDocument,
+        pauseAllToasts,
+        playAllToasts
+    ]);
+}