@doist/reactist 28.2.0 → 28.2.1

package/es/toast/use-toasts.js

@@ -23,25 +23,24 @@ const InternalToast = /*#__PURE__*/React__default.forwardRef(function InternalTo
   onDismiss,
   onRemoveToast
 }, ref) {
-  const [timeoutRunning, setTimeoutRunning] = React__default.useState(Boolean(autoDismissDelay));
   const timeoutRef = React__default.useRef();
+  const removeToast = React__default.useCallback(function removeToast() {
+    onRemoveToast(toastId);
+    onDismiss == null ? void 0 : onDismiss();
+  }, [onDismiss, onRemoveToast, toastId]);
   const startTimeout = React__default.useCallback(function startTimeout() {
-    setTimeoutRunning(true);
-  }, []);
+    if (!autoDismissDelay) return;
+    timeoutRef.current = window.setTimeout(removeToast, autoDismissDelay * 1000);
+  }, [autoDismissDelay, removeToast]);
   const stopTimeout = React__default.useCallback(function stopTimeout() {
-    setTimeoutRunning(false);
     clearTimeout(timeoutRef.current);
     timeoutRef.current = undefined;
   }, []);
-  const removeToast = React__default.useCallback(function removeToast() {
-    onRemoveToast(toastId);
-    onDismiss == null ? void 0 : onDismiss();
-  }, [onDismiss, onRemoveToast, toastId]);
   React__default.useEffect(function setupAutoDismiss() {
-    if (!timeoutRunning || !autoDismissDelay) return;
-    timeoutRef.current = window.setTimeout(removeToast, autoDismissDelay * 1000);
+    stopTimeout();
+    startTimeout();
     return stopTimeout;
-  }, [autoDismissDelay, removeToast, stopTimeout, timeoutRunning]);
+  }, [startTimeout, stopTimeout]);
   /**
    * If the action is toast action object and not a custom element,
    * the `onClick` property is wrapped in another handler responsible

package/es/toast/use-toasts.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-toasts.js","sources":["../../src/toast/use-toasts.tsx"],"sourcesContent":["import React from 'react'\nimport { Portal } from '@ariakit/react'\n\nimport { generateElementId } from '../utils/common-helpers'\nimport { Box } from '../box'\nimport { Stack } from '../stack'\nimport { isActionObject, StaticToast, StaticToastProps } from './static-toast'\n\nimport styles from './toast.module.css'\n\nimport type { Space } from '../utils/common-types'\nimport { useToastsAnimation } from './toast-animation'\n\n/**\n * The props needed to fire up a new notification toast.\n */\ntype ToastProps = StaticToastProps & {\n    /**\n     * The number of seconds the toast is expected to be shown before it is dismissed automatically,\n     * or false to disable auto-dismiss.\n     *\n     * It defaults to whatever is the autoDismissDelay set in the ToastsProvider.\n     */\n    autoDismissDelay?: number | false\n\n    /**\n     * The label for the button that dismisses the toast.\n     *\n     * It defaults to the value set in the ToastsProvider, but individual toasts can have a\n     * different value if needed.\n     */\n    dismissLabel?: string\n\n    /**\n     * Whether to show the dismiss button or not.\n     *\n     * Use this value with care. If combined with disabling `autoDismissDelay`, it may leave you\n     * with toasts that the user won't be able to dismiss at will. It then is your responsibility to\n     * dismiss the toast by calling the function returned by `showToast`.\n     */\n    showDismissButton?: boolean\n}\n\n//\n// InternalToast component and its props\n//\n\ntype InternalToastProps = Omit<ToastProps, 'autoDismissDelay' | 'dismissLabel'> &\n    Required<Pick<ToastProps, 'autoDismissDelay' | 'dismissLabel'>> & {\n        toastId: string\n        onRemoveToast: (toastId: string) => void\n    }\n\n/** @private */\nconst InternalToast = React.forwardRef<HTMLDivElement, InternalToastProps>(function InternalToast(\n    {\n        message,\n        description,\n        icon,\n        action,\n        autoDismissDelay,\n        dismissLabel,\n        showDismissButton = true,\n        toastId,\n        onDismiss,\n        onRemoveToast,\n    },\n    ref,\n) {\n    const [timeoutRunning, setTimeoutRunning] = React.useState(Boolean(autoDismissDelay))\n    const timeoutRef = React.useRef<number | undefined>()\n\n    const startTimeout = React.useCallback(function startTimeout() {\n        setTimeoutRunning(true)\n    }, [])\n\n    const stopTimeout = React.useCallback(function stopTimeout() {\n        setTimeoutRunning(false)\n        clearTimeout(timeoutRef.current)\n        timeoutRef.current = undefined\n    }, [])\n\n    const removeToast = React.useCallback(\n        function removeToast() {\n            onRemoveToast(toastId)\n            onDismiss?.()\n        },\n        [onDismiss, onRemoveToast, toastId],\n    )\n\n    React.useEffect(\n        function setupAutoDismiss() {\n            if (!timeoutRunning || !autoDismissDelay) return\n            timeoutRef.current = window.setTimeout(removeToast, autoDismissDelay * 1000)\n            return stopTimeout\n        },\n        [autoDismissDelay, removeToast, stopTimeout, timeoutRunning],\n    )\n\n    /**\n     * If the action is toast action object and not a custom element,\n     * the `onClick` property is wrapped in another handler responsible\n     * for removing the toast when the action is triggered.\n     */\n    const actionWithCustomActionHandler = React.useMemo(() => {\n        if (!isActionObject(action)) {\n            return action\n        }\n\n        return {\n            ...action,\n            closeToast: action.closeToast ?? true,\n            onClick: function handleActionClick() {\n                if (!action) {\n                    return\n                }\n\n                action.onClick()\n\n                if (action.closeToast ?? true) {\n                    removeToast()\n                }\n            },\n        }\n    }, [action, removeToast])\n\n    return (\n        <StaticToast\n            ref={ref}\n            message={message}\n            description={description}\n            icon={icon}\n            action={actionWithCustomActionHandler}\n            onDismiss={showDismissButton ? removeToast : undefined}\n            dismissLabel={dismissLabel}\n            // @ts-expect-error\n            onMouseEnter={stopTimeout}\n            onMouseLeave={startTimeout}\n        />\n    )\n})\n\n//\n// Internal state and context\n//\n\ntype InternalToastEntry = Omit<InternalToastProps, 'onRemoveToast'>\ntype ToastsList = readonly InternalToastEntry[]\n\ntype ShowToastAction = (props: ToastProps) => () => void\nconst ToastsContext = React.createContext<ShowToastAction>(() => () => undefined)\n\n/**\n * The props needed by the ToastsProvider component.\n *\n * @see ToastsProvider\n */\ntype ToastsProviderProps = {\n    /**\n     * The default label to apply to toast dismiss buttons.\n     *\n     * This is useful in environments that need locatization, so you do not need to pass the same\n     * translated label every time you trigger a toast.\n     *\n     * However, you can still apply a different label to a specific toast, by passing a different\n     * value when calling showToast.\n     *\n     * @default 'Close'\n     */\n    defaultDismissLabel?: string\n\n    /**\n     * The default number of seconds after which the toast will be dismissed automatically.\n     *\n     * You can pass a different value to a specific toast when calling `showToast`. You can even\n     * pass `false` if you want a certain toast to never be dismissed automatically.\n     *\n     * @default 10 (seconds)\n     */\n    defaultAutoDismissDelay?: number\n\n    /**\n     * The padding used to separate the toasts from the viewport borders.\n     *\n     * @default 'large'\n     */\n    padding?: Space\n\n    /**\n     * The app wrapped by the provider.\n     */\n    children: NonNullable<React.ReactNode>\n\n    /**\n     * Custom classname for the toasts container, if you need to fine-tune the position or other styles\n     */\n    containerClassName?: string\n}\n\n/**\n * Provides the state management and rendering of the toasts currently active.\n *\n * You need to render this near the top of your app components tree, in order to `useToasts`.\n *\n * @see useToasts\n */\nfunction ToastsProvider({\n    children,\n    padding = 'large',\n    defaultAutoDismissDelay = 10 /* seconds */,\n    defaultDismissLabel = 'Close',\n    containerClassName,\n}: ToastsProviderProps) {\n    const [toasts, setToasts] = React.useState<ToastsList>([])\n    const { mappedRef, animateRemove } = useToastsAnimation()\n\n    const removeToast = React.useCallback(\n        function onRemoveToast(toastId: string) {\n            animateRemove(toastId, () => {\n                setToasts((list) => {\n                    const index = list.findIndex((n) => n.toastId === toastId)\n                    if (index < 0) return list\n                    const copy = [...list]\n                    copy.splice(index, 1)\n                    return copy\n                })\n            })\n        },\n        [animateRemove],\n    )\n\n    const showToast = React.useCallback(\n        function showToast(props: ToastProps) {\n            const toastId = generateElementId('toast')\n            const newToast: InternalToastEntry = {\n                autoDismissDelay: defaultAutoDismissDelay,\n                dismissLabel: defaultDismissLabel,\n                ...props,\n                toastId,\n            }\n            setToasts((list) => [...list, newToast])\n            return () => removeToast(toastId)\n        },\n        [defaultAutoDismissDelay, defaultDismissLabel, removeToast],\n    )\n\n    return (\n        <ToastsContext.Provider value={showToast}>\n            {children}\n            <Portal>\n                {toasts.length === 0 ? null : (\n                    <Box\n                        className={[styles.stackedToastsView, containerClassName]}\n                        position=\"fixed\"\n                        width=\"full\"\n                        paddingX={padding}\n                        paddingBottom={padding}\n                        data-testid=\"toasts-container\"\n                    >\n                        <Stack space=\"medium\">\n                            {toasts.map(({ toastId, ...props }) => (\n                                <InternalToast\n                                    key={toastId}\n                                    ref={mappedRef(toastId)}\n                                    toastId={toastId}\n                                    onRemoveToast={removeToast}\n                                    {...props}\n                                />\n                            ))}\n                        </Stack>\n                    </Box>\n                )}\n            </Portal>\n        </ToastsContext.Provider>\n    )\n}\n\n/**\n * Provides a function `showToast` that shows a new toast every time you call it.\n *\n * ```jsx\n * const showToast = useToasts()\n *\n * <button onClick={() => showToast({ message: 'Hello' })}>\n *   Say hello\n * </button>\n * ```\n *\n * All toasts fired via this function are rendered in a global fixed location, and stacked one on\n * top of the other.\n *\n * When called, `showToast` returns a function that dismisses the toast when called.\n *\n * @see ToastsProvider\n */\nfunction useToasts() {\n    return React.useContext(ToastsContext)\n}\n\n/**\n * Adds a toast to be rendered, stacked alongside any other currently active toasts.\n *\n * For most situations, you should prefer to use the `showToast` function obtained from `useToasts`.\n * This component is provided for convenience to render toasts in the markup, but it has some\n * peculiarities, which are discussed below.\n *\n * Internally, this calls `showToast`. It is provided for two reasons:\n *\n * 1. Convenience, when you want to fire a toast in markup/jsx code. Keep in mind, though, that\n *    toasts rendered in this way will be removed from view when the context where it is rendered\n *    is unmounted. Unlike toasts fired with `showToast`, which will normally be dismissed, either\n *    by the user or after a delay. They'll still be animated on their way out, though.\n * 2. When combined with disabling dismissing it (e.g. `showDismissButton={false}` and\n *    `autoDismissDelay={false}` it provides a way to show \"permanent\" toasts that only go away when\n *    the component ceases to be rendered).\n *\n * This is useful for cases when the consumer wants to control when a toast is visible, and to keep\n * it visible based on an app-specific condition.\n *\n * Something important to note about this component is that it triggers the toast based on the props\n * passed when first rendered, and it does not update the toast if these props change on subsequent\n * renders. In this sense, this is an imperative component, more than a descriptive one. This is\n * done to simplify the internals, and to keep it in line with how `showToast` works: you fire up a\n * toast imperatively, and you loose control over it. It remains rendered according to the props you\n * first passed.\n *\n * @see useToasts\n */\nfunction Toast(props: ToastProps) {\n    const showToast = useToasts()\n    const propsRef = React.useRef<ToastProps>(props)\n    React.useEffect(() => {\n        const dismissToast = showToast(propsRef.current)\n        return dismissToast\n    }, [showToast])\n    return null\n}\n\nexport { Toast, ToastsProvider, useToasts }\nexport type { ToastProps, ToastsProviderProps }\n"],"names":["InternalToast","React","forwardRef","message","description","icon","action","autoDismissDelay","dismissLabel","showDismissButton","toastId","onDismiss","onRemoveToast","ref","timeoutRunning","setTimeoutRunning","useState","Boolean","timeoutRef","useRef","startTimeout","useCallback","stopTimeout","clearTimeout","current","undefined","removeToast","useEffect","setupAutoDismiss","window","setTimeout","actionWithCustomActionHandler","useMemo","isActionObject","_objectSpread","closeToast","onClick","handleActionClick","createElement","StaticToast","onMouseEnter","onMouseLeave","ToastsContext","createContext","ToastsProvider","children","padding","defaultAutoDismissDelay","defaultDismissLabel","containerClassName","toasts","setToasts","mappedRef","animateRemove","useToastsAnimation","list","index","findIndex","n","copy","splice","showToast","props","generateElementId","newToast","Provider","value","Portal","length","Box","className","styles","stackedToastsView","position","width","paddingX","paddingBottom","Stack","space","map","key","useToasts","useContext","Toast","propsRef","dismissToast"],"mappings":"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"}
+{"version":3,"file":"use-toasts.js","sources":["../../src/toast/use-toasts.tsx"],"sourcesContent":["import React from 'react'\nimport { Portal } from '@ariakit/react'\n\nimport { generateElementId } from '../utils/common-helpers'\nimport { Box } from '../box'\nimport { Stack } from '../stack'\nimport { isActionObject, StaticToast, StaticToastProps } from './static-toast'\n\nimport styles from './toast.module.css'\n\nimport type { Space } from '../utils/common-types'\nimport { useToastsAnimation } from './toast-animation'\n\n/**\n * The props needed to fire up a new notification toast.\n */\ntype ToastProps = StaticToastProps & {\n    /**\n     * The number of seconds the toast is expected to be shown before it is dismissed automatically,\n     * or false to disable auto-dismiss.\n     *\n     * It defaults to whatever is the autoDismissDelay set in the ToastsProvider.\n     */\n    autoDismissDelay?: number | false\n\n    /**\n     * The label for the button that dismisses the toast.\n     *\n     * It defaults to the value set in the ToastsProvider, but individual toasts can have a\n     * different value if needed.\n     */\n    dismissLabel?: string\n\n    /**\n     * Whether to show the dismiss button or not.\n     *\n     * Use this value with care. If combined with disabling `autoDismissDelay`, it may leave you\n     * with toasts that the user won't be able to dismiss at will. It then is your responsibility to\n     * dismiss the toast by calling the function returned by `showToast`.\n     */\n    showDismissButton?: boolean\n}\n\n//\n// InternalToast component and its props\n//\n\ntype InternalToastProps = Omit<ToastProps, 'autoDismissDelay' | 'dismissLabel'> &\n    Required<Pick<ToastProps, 'autoDismissDelay' | 'dismissLabel'>> & {\n        toastId: string\n        onRemoveToast: (toastId: string) => void\n    }\n\n/** @private */\nconst InternalToast = React.forwardRef<HTMLDivElement, InternalToastProps>(function InternalToast(\n    {\n        message,\n        description,\n        icon,\n        action,\n        autoDismissDelay,\n        dismissLabel,\n        showDismissButton = true,\n        toastId,\n        onDismiss,\n        onRemoveToast,\n    },\n    ref,\n) {\n    const timeoutRef = React.useRef<number | undefined>()\n\n    const removeToast = React.useCallback(\n        function removeToast() {\n            onRemoveToast(toastId)\n            onDismiss?.()\n        },\n        [onDismiss, onRemoveToast, toastId],\n    )\n\n    const startTimeout = React.useCallback(\n        function startTimeout() {\n            if (!autoDismissDelay) return\n            timeoutRef.current = window.setTimeout(removeToast, autoDismissDelay * 1000)\n        },\n        [autoDismissDelay, removeToast],\n    )\n\n    const stopTimeout = React.useCallback(function stopTimeout() {\n        clearTimeout(timeoutRef.current)\n        timeoutRef.current = undefined\n    }, [])\n\n    React.useEffect(\n        function setupAutoDismiss() {\n            stopTimeout()\n            startTimeout()\n\n            return stopTimeout\n        },\n        [startTimeout, stopTimeout],\n    )\n\n    /**\n     * If the action is toast action object and not a custom element,\n     * the `onClick` property is wrapped in another handler responsible\n     * for removing the toast when the action is triggered.\n     */\n    const actionWithCustomActionHandler = React.useMemo(() => {\n        if (!isActionObject(action)) {\n            return action\n        }\n\n        return {\n            ...action,\n            closeToast: action.closeToast ?? true,\n            onClick: function handleActionClick() {\n                if (!action) {\n                    return\n                }\n\n                action.onClick()\n\n                if (action.closeToast ?? true) {\n                    removeToast()\n                }\n            },\n        }\n    }, [action, removeToast])\n\n    return (\n        <StaticToast\n            ref={ref}\n            message={message}\n            description={description}\n            icon={icon}\n            action={actionWithCustomActionHandler}\n            onDismiss={showDismissButton ? removeToast : undefined}\n            dismissLabel={dismissLabel}\n            // @ts-expect-error\n            onMouseEnter={stopTimeout}\n            onMouseLeave={startTimeout}\n        />\n    )\n})\n\n//\n// Internal state and context\n//\n\ntype InternalToastEntry = Omit<InternalToastProps, 'onRemoveToast'>\ntype ToastsList = readonly InternalToastEntry[]\n\ntype ShowToastAction = (props: ToastProps) => () => void\nconst ToastsContext = React.createContext<ShowToastAction>(() => () => undefined)\n\n/**\n * The props needed by the ToastsProvider component.\n *\n * @see ToastsProvider\n */\ntype ToastsProviderProps = {\n    /**\n     * The default label to apply to toast dismiss buttons.\n     *\n     * This is useful in environments that need locatization, so you do not need to pass the same\n     * translated label every time you trigger a toast.\n     *\n     * However, you can still apply a different label to a specific toast, by passing a different\n     * value when calling showToast.\n     *\n     * @default 'Close'\n     */\n    defaultDismissLabel?: string\n\n    /**\n     * The default number of seconds after which the toast will be dismissed automatically.\n     *\n     * You can pass a different value to a specific toast when calling `showToast`. You can even\n     * pass `false` if you want a certain toast to never be dismissed automatically.\n     *\n     * @default 10 (seconds)\n     */\n    defaultAutoDismissDelay?: number\n\n    /**\n     * The padding used to separate the toasts from the viewport borders.\n     *\n     * @default 'large'\n     */\n    padding?: Space\n\n    /**\n     * The app wrapped by the provider.\n     */\n    children: NonNullable<React.ReactNode>\n\n    /**\n     * Custom classname for the toasts container, if you need to fine-tune the position or other styles\n     */\n    containerClassName?: string\n}\n\n/**\n * Provides the state management and rendering of the toasts currently active.\n *\n * You need to render this near the top of your app components tree, in order to `useToasts`.\n *\n * @see useToasts\n */\nfunction ToastsProvider({\n    children,\n    padding = 'large',\n    defaultAutoDismissDelay = 10 /* seconds */,\n    defaultDismissLabel = 'Close',\n    containerClassName,\n}: ToastsProviderProps) {\n    const [toasts, setToasts] = React.useState<ToastsList>([])\n    const { mappedRef, animateRemove } = useToastsAnimation()\n\n    const removeToast = React.useCallback(\n        function onRemoveToast(toastId: string) {\n            animateRemove(toastId, () => {\n                setToasts((list) => {\n                    const index = list.findIndex((n) => n.toastId === toastId)\n                    if (index < 0) return list\n                    const copy = [...list]\n                    copy.splice(index, 1)\n                    return copy\n                })\n            })\n        },\n        [animateRemove],\n    )\n\n    const showToast = React.useCallback(\n        function showToast(props: ToastProps) {\n            const toastId = generateElementId('toast')\n            const newToast: InternalToastEntry = {\n                autoDismissDelay: defaultAutoDismissDelay,\n                dismissLabel: defaultDismissLabel,\n                ...props,\n                toastId,\n            }\n            setToasts((list) => [...list, newToast])\n            return () => removeToast(toastId)\n        },\n        [defaultAutoDismissDelay, defaultDismissLabel, removeToast],\n    )\n\n    return (\n        <ToastsContext.Provider value={showToast}>\n            {children}\n            <Portal>\n                {toasts.length === 0 ? null : (\n                    <Box\n                        className={[styles.stackedToastsView, containerClassName]}\n                        position=\"fixed\"\n                        width=\"full\"\n                        paddingX={padding}\n                        paddingBottom={padding}\n                        data-testid=\"toasts-container\"\n                    >\n                        <Stack space=\"medium\">\n                            {toasts.map(({ toastId, ...props }) => (\n                                <InternalToast\n                                    key={toastId}\n                                    ref={mappedRef(toastId)}\n                                    toastId={toastId}\n                                    onRemoveToast={removeToast}\n                                    {...props}\n                                />\n                            ))}\n                        </Stack>\n                    </Box>\n                )}\n            </Portal>\n        </ToastsContext.Provider>\n    )\n}\n\n/**\n * Provides a function `showToast` that shows a new toast every time you call it.\n *\n * ```jsx\n * const showToast = useToasts()\n *\n * <button onClick={() => showToast({ message: 'Hello' })}>\n *   Say hello\n * </button>\n * ```\n *\n * All toasts fired via this function are rendered in a global fixed location, and stacked one on\n * top of the other.\n *\n * When called, `showToast` returns a function that dismisses the toast when called.\n *\n * @see ToastsProvider\n */\nfunction useToasts() {\n    return React.useContext(ToastsContext)\n}\n\n/**\n * Adds a toast to be rendered, stacked alongside any other currently active toasts.\n *\n * For most situations, you should prefer to use the `showToast` function obtained from `useToasts`.\n * This component is provided for convenience to render toasts in the markup, but it has some\n * peculiarities, which are discussed below.\n *\n * Internally, this calls `showToast`. It is provided for two reasons:\n *\n * 1. Convenience, when you want to fire a toast in markup/jsx code. Keep in mind, though, that\n *    toasts rendered in this way will be removed from view when the context where it is rendered\n *    is unmounted. Unlike toasts fired with `showToast`, which will normally be dismissed, either\n *    by the user or after a delay. They'll still be animated on their way out, though.\n * 2. When combined with disabling dismissing it (e.g. `showDismissButton={false}` and\n *    `autoDismissDelay={false}` it provides a way to show \"permanent\" toasts that only go away when\n *    the component ceases to be rendered).\n *\n * This is useful for cases when the consumer wants to control when a toast is visible, and to keep\n * it visible based on an app-specific condition.\n *\n * Something important to note about this component is that it triggers the toast based on the props\n * passed when first rendered, and it does not update the toast if these props change on subsequent\n * renders. In this sense, this is an imperative component, more than a descriptive one. This is\n * done to simplify the internals, and to keep it in line with how `showToast` works: you fire up a\n * toast imperatively, and you loose control over it. It remains rendered according to the props you\n * first passed.\n *\n * @see useToasts\n */\nfunction Toast(props: ToastProps) {\n    const showToast = useToasts()\n    const propsRef = React.useRef<ToastProps>(props)\n    React.useEffect(() => {\n        const dismissToast = showToast(propsRef.current)\n        return dismissToast\n    }, [showToast])\n    return null\n}\n\nexport { Toast, ToastsProvider, useToasts }\nexport type { ToastProps, ToastsProviderProps }\n"],"names":["InternalToast","React","forwardRef","message","description","icon","action","autoDismissDelay","dismissLabel","showDismissButton","toastId","onDismiss","onRemoveToast","ref","timeoutRef","useRef","removeToast","useCallback","startTimeout","current","window","setTimeout","stopTimeout","clearTimeout","undefined","useEffect","setupAutoDismiss","actionWithCustomActionHandler","useMemo","isActionObject","_objectSpread","closeToast","onClick","handleActionClick","createElement","StaticToast","onMouseEnter","onMouseLeave","ToastsContext","createContext","ToastsProvider","children","padding","defaultAutoDismissDelay","defaultDismissLabel","containerClassName","toasts","setToasts","useState","mappedRef","animateRemove","useToastsAnimation","list","index","findIndex","n","copy","splice","showToast","props","generateElementId","newToast","Provider","value","Portal","length","Box","className","styles","stackedToastsView","position","width","paddingX","paddingBottom","Stack","space","map","key","useToasts","useContext","Toast","propsRef","dismissToast"],"mappings":"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"}

package/lib/toast/use-toasts.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),a=require("@ariakit/react"),s=require("../utils/common-helpers.js"),o=require("../box/box.js"),n=require("../stack/stack.js"),u=require("./static-toast.js"),r=require("./toast.module.css.js"),i=require("./toast-animation.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=l(t);const d=["toastId"],f=c.default.forwardRef((function({message:t,description:a,icon:s,action:o,autoDismissDelay:n,dismissLabel:r,showDismissButton:i=!0,toastId:l,onDismiss:d,onRemoveToast:f},m){const[p,b]=c.default.useState(Boolean(n)),j=c.default.useRef(),v=c.default.useCallback((function(){b(!0)}),[]),k=c.default.useCallback((function(){b(!1),clearTimeout(j.current),j.current=void 0}),[]),T=c.default.useCallback((function(){f(l),null==d||d()}),[d,f,l]);c.default.useEffect((function(){if(p&&n)return j.current=window.setTimeout(T,1e3*n),k}),[n,T,k,p]);const x=c.default.useMemo(()=>{var t;return u.isActionObject(o)?e.objectSpread2(e.objectSpread2({},o),{},{closeToast:null==(t=o.closeToast)||t,onClick:function(){var e;o&&(o.onClick(),(null==(e=o.closeToast)||e)&&T())}}):o},[o,T]);return c.default.createElement(u.StaticToast,{ref:m,message:t,description:a,icon:s,action:x,onDismiss:i?T:void 0,dismissLabel:r,onMouseEnter:k,onMouseLeave:v})})),m=c.default.createContext(()=>()=>{});function p(){return c.default.useContext(m)}exports.Toast=function(e){const t=p(),a=c.default.useRef(e);return c.default.useEffect(()=>t(a.current),[t]),null},exports.ToastsProvider=function({children:t,padding:u="large",defaultAutoDismissDelay:l=10,defaultDismissLabel:p="Close",containerClassName:b}){const[j,v]=c.default.useState([]),{mappedRef:k,animateRemove:T}=i.useToastsAnimation(),x=c.default.useCallback((function(e){T(e,()=>{v(t=>{const a=t.findIndex(t=>t.toastId===e);if(a<0)return t;const s=[...t];return s.splice(a,1),s})})}),[T]),C=c.default.useCallback((function(t){const a=s.generateElementId("toast"),o=e.objectSpread2(e.objectSpread2({autoDismissDelay:l,dismissLabel:p},t),{},{toastId:a});return v(e=>[...e,o]),()=>x(a)}),[l,p,x]);return c.default.createElement(m.Provider,{value:C},t,c.default.createElement(a.Portal,null,0===j.length?null:c.default.createElement(o.Box,{className:[r.default.stackedToastsView,b],position:"fixed",width:"full",paddingX:u,paddingBottom:u,"data-testid":"toasts-container"},c.default.createElement(n.Stack,{space:"medium"},j.map(t=>{let{toastId:a}=t,s=e.objectWithoutProperties(t,d);return c.default.createElement(f,e.objectSpread2({key:a,ref:k(a),toastId:a,onRemoveToast:x},s))})))))},exports.useToasts=p;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../_virtual/_rollupPluginBabelHelpers.js"),t=require("react"),a=require("@ariakit/react"),s=require("../utils/common-helpers.js"),o=require("../box/box.js"),n=require("../stack/stack.js"),u=require("./static-toast.js"),r=require("./toast.module.css.js"),i=require("./toast-animation.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=l(t);const d=["toastId"],f=c.default.forwardRef((function({message:t,description:a,icon:s,action:o,autoDismissDelay:n,dismissLabel:r,showDismissButton:i=!0,toastId:l,onDismiss:d,onRemoveToast:f},m){const p=c.default.useRef(),b=c.default.useCallback((function(){f(l),null==d||d()}),[d,f,l]),j=c.default.useCallback((function(){n&&(p.current=window.setTimeout(b,1e3*n))}),[n,b]),v=c.default.useCallback((function(){clearTimeout(p.current),p.current=void 0}),[]);c.default.useEffect((function(){return v(),j(),v}),[j,v]);const k=c.default.useMemo(()=>{var t;return u.isActionObject(o)?e.objectSpread2(e.objectSpread2({},o),{},{closeToast:null==(t=o.closeToast)||t,onClick:function(){var e;o&&(o.onClick(),(null==(e=o.closeToast)||e)&&b())}}):o},[o,b]);return c.default.createElement(u.StaticToast,{ref:m,message:t,description:a,icon:s,action:k,onDismiss:i?b:void 0,dismissLabel:r,onMouseEnter:v,onMouseLeave:j})})),m=c.default.createContext(()=>()=>{});function p(){return c.default.useContext(m)}exports.Toast=function(e){const t=p(),a=c.default.useRef(e);return c.default.useEffect(()=>t(a.current),[t]),null},exports.ToastsProvider=function({children:t,padding:u="large",defaultAutoDismissDelay:l=10,defaultDismissLabel:p="Close",containerClassName:b}){const[j,v]=c.default.useState([]),{mappedRef:k,animateRemove:T}=i.useToastsAnimation(),x=c.default.useCallback((function(e){T(e,()=>{v(t=>{const a=t.findIndex(t=>t.toastId===e);if(a<0)return t;const s=[...t];return s.splice(a,1),s})})}),[T]),C=c.default.useCallback((function(t){const a=s.generateElementId("toast"),o=e.objectSpread2(e.objectSpread2({autoDismissDelay:l,dismissLabel:p},t),{},{toastId:a});return v(e=>[...e,o]),()=>x(a)}),[l,p,x]);return c.default.createElement(m.Provider,{value:C},t,c.default.createElement(a.Portal,null,0===j.length?null:c.default.createElement(o.Box,{className:[r.default.stackedToastsView,b],position:"fixed",width:"full",paddingX:u,paddingBottom:u,"data-testid":"toasts-container"},c.default.createElement(n.Stack,{space:"medium"},j.map(t=>{let{toastId:a}=t,s=e.objectWithoutProperties(t,d);return c.default.createElement(f,e.objectSpread2({key:a,ref:k(a),toastId:a,onRemoveToast:x},s))})))))},exports.useToasts=p;
 //# sourceMappingURL=use-toasts.js.map

package/lib/toast/use-toasts.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-toasts.js","sources":["../../src/toast/use-toasts.tsx"],"sourcesContent":["import React from 'react'\nimport { Portal } from '@ariakit/react'\n\nimport { generateElementId } from '../utils/common-helpers'\nimport { Box } from '../box'\nimport { Stack } from '../stack'\nimport { isActionObject, StaticToast, StaticToastProps } from './static-toast'\n\nimport styles from './toast.module.css'\n\nimport type { Space } from '../utils/common-types'\nimport { useToastsAnimation } from './toast-animation'\n\n/**\n * The props needed to fire up a new notification toast.\n */\ntype ToastProps = StaticToastProps & {\n    /**\n     * The number of seconds the toast is expected to be shown before it is dismissed automatically,\n     * or false to disable auto-dismiss.\n     *\n     * It defaults to whatever is the autoDismissDelay set in the ToastsProvider.\n     */\n    autoDismissDelay?: number | false\n\n    /**\n     * The label for the button that dismisses the toast.\n     *\n     * It defaults to the value set in the ToastsProvider, but individual toasts can have a\n     * different value if needed.\n     */\n    dismissLabel?: string\n\n    /**\n     * Whether to show the dismiss button or not.\n     *\n     * Use this value with care. If combined with disabling `autoDismissDelay`, it may leave you\n     * with toasts that the user won't be able to dismiss at will. It then is your responsibility to\n     * dismiss the toast by calling the function returned by `showToast`.\n     */\n    showDismissButton?: boolean\n}\n\n//\n// InternalToast component and its props\n//\n\ntype InternalToastProps = Omit<ToastProps, 'autoDismissDelay' | 'dismissLabel'> &\n    Required<Pick<ToastProps, 'autoDismissDelay' | 'dismissLabel'>> & {\n        toastId: string\n        onRemoveToast: (toastId: string) => void\n    }\n\n/** @private */\nconst InternalToast = React.forwardRef<HTMLDivElement, InternalToastProps>(function InternalToast(\n    {\n        message,\n        description,\n        icon,\n        action,\n        autoDismissDelay,\n        dismissLabel,\n        showDismissButton = true,\n        toastId,\n        onDismiss,\n        onRemoveToast,\n    },\n    ref,\n) {\n    const [timeoutRunning, setTimeoutRunning] = React.useState(Boolean(autoDismissDelay))\n    const timeoutRef = React.useRef<number | undefined>()\n\n    const startTimeout = React.useCallback(function startTimeout() {\n        setTimeoutRunning(true)\n    }, [])\n\n    const stopTimeout = React.useCallback(function stopTimeout() {\n        setTimeoutRunning(false)\n        clearTimeout(timeoutRef.current)\n        timeoutRef.current = undefined\n    }, [])\n\n    const removeToast = React.useCallback(\n        function removeToast() {\n            onRemoveToast(toastId)\n            onDismiss?.()\n        },\n        [onDismiss, onRemoveToast, toastId],\n    )\n\n    React.useEffect(\n        function setupAutoDismiss() {\n            if (!timeoutRunning || !autoDismissDelay) return\n            timeoutRef.current = window.setTimeout(removeToast, autoDismissDelay * 1000)\n            return stopTimeout\n        },\n        [autoDismissDelay, removeToast, stopTimeout, timeoutRunning],\n    )\n\n    /**\n     * If the action is toast action object and not a custom element,\n     * the `onClick` property is wrapped in another handler responsible\n     * for removing the toast when the action is triggered.\n     */\n    const actionWithCustomActionHandler = React.useMemo(() => {\n        if (!isActionObject(action)) {\n            return action\n        }\n\n        return {\n            ...action,\n            closeToast: action.closeToast ?? true,\n            onClick: function handleActionClick() {\n                if (!action) {\n                    return\n                }\n\n                action.onClick()\n\n                if (action.closeToast ?? true) {\n                    removeToast()\n                }\n            },\n        }\n    }, [action, removeToast])\n\n    return (\n        <StaticToast\n            ref={ref}\n            message={message}\n            description={description}\n            icon={icon}\n            action={actionWithCustomActionHandler}\n            onDismiss={showDismissButton ? removeToast : undefined}\n            dismissLabel={dismissLabel}\n            // @ts-expect-error\n            onMouseEnter={stopTimeout}\n            onMouseLeave={startTimeout}\n        />\n    )\n})\n\n//\n// Internal state and context\n//\n\ntype InternalToastEntry = Omit<InternalToastProps, 'onRemoveToast'>\ntype ToastsList = readonly InternalToastEntry[]\n\ntype ShowToastAction = (props: ToastProps) => () => void\nconst ToastsContext = React.createContext<ShowToastAction>(() => () => undefined)\n\n/**\n * The props needed by the ToastsProvider component.\n *\n * @see ToastsProvider\n */\ntype ToastsProviderProps = {\n    /**\n     * The default label to apply to toast dismiss buttons.\n     *\n     * This is useful in environments that need locatization, so you do not need to pass the same\n     * translated label every time you trigger a toast.\n     *\n     * However, you can still apply a different label to a specific toast, by passing a different\n     * value when calling showToast.\n     *\n     * @default 'Close'\n     */\n    defaultDismissLabel?: string\n\n    /**\n     * The default number of seconds after which the toast will be dismissed automatically.\n     *\n     * You can pass a different value to a specific toast when calling `showToast`. You can even\n     * pass `false` if you want a certain toast to never be dismissed automatically.\n     *\n     * @default 10 (seconds)\n     */\n    defaultAutoDismissDelay?: number\n\n    /**\n     * The padding used to separate the toasts from the viewport borders.\n     *\n     * @default 'large'\n     */\n    padding?: Space\n\n    /**\n     * The app wrapped by the provider.\n     */\n    children: NonNullable<React.ReactNode>\n\n    /**\n     * Custom classname for the toasts container, if you need to fine-tune the position or other styles\n     */\n    containerClassName?: string\n}\n\n/**\n * Provides the state management and rendering of the toasts currently active.\n *\n * You need to render this near the top of your app components tree, in order to `useToasts`.\n *\n * @see useToasts\n */\nfunction ToastsProvider({\n    children,\n    padding = 'large',\n    defaultAutoDismissDelay = 10 /* seconds */,\n    defaultDismissLabel = 'Close',\n    containerClassName,\n}: ToastsProviderProps) {\n    const [toasts, setToasts] = React.useState<ToastsList>([])\n    const { mappedRef, animateRemove } = useToastsAnimation()\n\n    const removeToast = React.useCallback(\n        function onRemoveToast(toastId: string) {\n            animateRemove(toastId, () => {\n                setToasts((list) => {\n                    const index = list.findIndex((n) => n.toastId === toastId)\n                    if (index < 0) return list\n                    const copy = [...list]\n                    copy.splice(index, 1)\n                    return copy\n                })\n            })\n        },\n        [animateRemove],\n    )\n\n    const showToast = React.useCallback(\n        function showToast(props: ToastProps) {\n            const toastId = generateElementId('toast')\n            const newToast: InternalToastEntry = {\n                autoDismissDelay: defaultAutoDismissDelay,\n                dismissLabel: defaultDismissLabel,\n                ...props,\n                toastId,\n            }\n            setToasts((list) => [...list, newToast])\n            return () => removeToast(toastId)\n        },\n        [defaultAutoDismissDelay, defaultDismissLabel, removeToast],\n    )\n\n    return (\n        <ToastsContext.Provider value={showToast}>\n            {children}\n            <Portal>\n                {toasts.length === 0 ? null : (\n                    <Box\n                        className={[styles.stackedToastsView, containerClassName]}\n                        position=\"fixed\"\n                        width=\"full\"\n                        paddingX={padding}\n                        paddingBottom={padding}\n                        data-testid=\"toasts-container\"\n                    >\n                        <Stack space=\"medium\">\n                            {toasts.map(({ toastId, ...props }) => (\n                                <InternalToast\n                                    key={toastId}\n                                    ref={mappedRef(toastId)}\n                                    toastId={toastId}\n                                    onRemoveToast={removeToast}\n                                    {...props}\n                                />\n                            ))}\n                        </Stack>\n                    </Box>\n                )}\n            </Portal>\n        </ToastsContext.Provider>\n    )\n}\n\n/**\n * Provides a function `showToast` that shows a new toast every time you call it.\n *\n * ```jsx\n * const showToast = useToasts()\n *\n * <button onClick={() => showToast({ message: 'Hello' })}>\n *   Say hello\n * </button>\n * ```\n *\n * All toasts fired via this function are rendered in a global fixed location, and stacked one on\n * top of the other.\n *\n * When called, `showToast` returns a function that dismisses the toast when called.\n *\n * @see ToastsProvider\n */\nfunction useToasts() {\n    return React.useContext(ToastsContext)\n}\n\n/**\n * Adds a toast to be rendered, stacked alongside any other currently active toasts.\n *\n * For most situations, you should prefer to use the `showToast` function obtained from `useToasts`.\n * This component is provided for convenience to render toasts in the markup, but it has some\n * peculiarities, which are discussed below.\n *\n * Internally, this calls `showToast`. It is provided for two reasons:\n *\n * 1. Convenience, when you want to fire a toast in markup/jsx code. Keep in mind, though, that\n *    toasts rendered in this way will be removed from view when the context where it is rendered\n *    is unmounted. Unlike toasts fired with `showToast`, which will normally be dismissed, either\n *    by the user or after a delay. They'll still be animated on their way out, though.\n * 2. When combined with disabling dismissing it (e.g. `showDismissButton={false}` and\n *    `autoDismissDelay={false}` it provides a way to show \"permanent\" toasts that only go away when\n *    the component ceases to be rendered).\n *\n * This is useful for cases when the consumer wants to control when a toast is visible, and to keep\n * it visible based on an app-specific condition.\n *\n * Something important to note about this component is that it triggers the toast based on the props\n * passed when first rendered, and it does not update the toast if these props change on subsequent\n * renders. In this sense, this is an imperative component, more than a descriptive one. This is\n * done to simplify the internals, and to keep it in line with how `showToast` works: you fire up a\n * toast imperatively, and you loose control over it. It remains rendered according to the props you\n * first passed.\n *\n * @see useToasts\n */\nfunction Toast(props: ToastProps) {\n    const showToast = useToasts()\n    const propsRef = React.useRef<ToastProps>(props)\n    React.useEffect(() => {\n        const dismissToast = showToast(propsRef.current)\n        return dismissToast\n    }, [showToast])\n    return null\n}\n\nexport { Toast, ToastsProvider, useToasts }\nexport type { ToastProps, ToastsProviderProps }\n"],"names":["InternalToast","React","forwardRef","message","description","icon","action","autoDismissDelay","dismissLabel","showDismissButton","toastId","onDismiss","onRemoveToast","ref","timeoutRunning","setTimeoutRunning","useState","Boolean","timeoutRef","useRef","startTimeout","useCallback","stopTimeout","clearTimeout","current","undefined","removeToast","useEffect","window","setTimeout","actionWithCustomActionHandler","useMemo","_action$closeToast","isActionObject","_objectSpread","objectSpread2","closeToast","onClick","_action$closeToast2","createElement","StaticToast","onMouseEnter","onMouseLeave","ToastsContext","createContext","useToasts","useContext","props","showToast","propsRef","children","padding","defaultAutoDismissDelay","defaultDismissLabel","containerClassName","toasts","setToasts","mappedRef","animateRemove","useToastsAnimation","list","index","findIndex","n","copy","splice","generateElementId","newToast","Provider","value","Portal","length","Box","className","styles","stackedToastsView","position","width","paddingX","paddingBottom","Stack","space","map","_ref","_objectWithoutProperties","objectWithoutProperties","_excluded","key"],"mappings":"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"}
+{"version":3,"file":"use-toasts.js","sources":["../../src/toast/use-toasts.tsx"],"sourcesContent":["import React from 'react'\nimport { Portal } from '@ariakit/react'\n\nimport { generateElementId } from '../utils/common-helpers'\nimport { Box } from '../box'\nimport { Stack } from '../stack'\nimport { isActionObject, StaticToast, StaticToastProps } from './static-toast'\n\nimport styles from './toast.module.css'\n\nimport type { Space } from '../utils/common-types'\nimport { useToastsAnimation } from './toast-animation'\n\n/**\n * The props needed to fire up a new notification toast.\n */\ntype ToastProps = StaticToastProps & {\n    /**\n     * The number of seconds the toast is expected to be shown before it is dismissed automatically,\n     * or false to disable auto-dismiss.\n     *\n     * It defaults to whatever is the autoDismissDelay set in the ToastsProvider.\n     */\n    autoDismissDelay?: number | false\n\n    /**\n     * The label for the button that dismisses the toast.\n     *\n     * It defaults to the value set in the ToastsProvider, but individual toasts can have a\n     * different value if needed.\n     */\n    dismissLabel?: string\n\n    /**\n     * Whether to show the dismiss button or not.\n     *\n     * Use this value with care. If combined with disabling `autoDismissDelay`, it may leave you\n     * with toasts that the user won't be able to dismiss at will. It then is your responsibility to\n     * dismiss the toast by calling the function returned by `showToast`.\n     */\n    showDismissButton?: boolean\n}\n\n//\n// InternalToast component and its props\n//\n\ntype InternalToastProps = Omit<ToastProps, 'autoDismissDelay' | 'dismissLabel'> &\n    Required<Pick<ToastProps, 'autoDismissDelay' | 'dismissLabel'>> & {\n        toastId: string\n        onRemoveToast: (toastId: string) => void\n    }\n\n/** @private */\nconst InternalToast = React.forwardRef<HTMLDivElement, InternalToastProps>(function InternalToast(\n    {\n        message,\n        description,\n        icon,\n        action,\n        autoDismissDelay,\n        dismissLabel,\n        showDismissButton = true,\n        toastId,\n        onDismiss,\n        onRemoveToast,\n    },\n    ref,\n) {\n    const timeoutRef = React.useRef<number | undefined>()\n\n    const removeToast = React.useCallback(\n        function removeToast() {\n            onRemoveToast(toastId)\n            onDismiss?.()\n        },\n        [onDismiss, onRemoveToast, toastId],\n    )\n\n    const startTimeout = React.useCallback(\n        function startTimeout() {\n            if (!autoDismissDelay) return\n            timeoutRef.current = window.setTimeout(removeToast, autoDismissDelay * 1000)\n        },\n        [autoDismissDelay, removeToast],\n    )\n\n    const stopTimeout = React.useCallback(function stopTimeout() {\n        clearTimeout(timeoutRef.current)\n        timeoutRef.current = undefined\n    }, [])\n\n    React.useEffect(\n        function setupAutoDismiss() {\n            stopTimeout()\n            startTimeout()\n\n            return stopTimeout\n        },\n        [startTimeout, stopTimeout],\n    )\n\n    /**\n     * If the action is toast action object and not a custom element,\n     * the `onClick` property is wrapped in another handler responsible\n     * for removing the toast when the action is triggered.\n     */\n    const actionWithCustomActionHandler = React.useMemo(() => {\n        if (!isActionObject(action)) {\n            return action\n        }\n\n        return {\n            ...action,\n            closeToast: action.closeToast ?? true,\n            onClick: function handleActionClick() {\n                if (!action) {\n                    return\n                }\n\n                action.onClick()\n\n                if (action.closeToast ?? true) {\n                    removeToast()\n                }\n            },\n        }\n    }, [action, removeToast])\n\n    return (\n        <StaticToast\n            ref={ref}\n            message={message}\n            description={description}\n            icon={icon}\n            action={actionWithCustomActionHandler}\n            onDismiss={showDismissButton ? removeToast : undefined}\n            dismissLabel={dismissLabel}\n            // @ts-expect-error\n            onMouseEnter={stopTimeout}\n            onMouseLeave={startTimeout}\n        />\n    )\n})\n\n//\n// Internal state and context\n//\n\ntype InternalToastEntry = Omit<InternalToastProps, 'onRemoveToast'>\ntype ToastsList = readonly InternalToastEntry[]\n\ntype ShowToastAction = (props: ToastProps) => () => void\nconst ToastsContext = React.createContext<ShowToastAction>(() => () => undefined)\n\n/**\n * The props needed by the ToastsProvider component.\n *\n * @see ToastsProvider\n */\ntype ToastsProviderProps = {\n    /**\n     * The default label to apply to toast dismiss buttons.\n     *\n     * This is useful in environments that need locatization, so you do not need to pass the same\n     * translated label every time you trigger a toast.\n     *\n     * However, you can still apply a different label to a specific toast, by passing a different\n     * value when calling showToast.\n     *\n     * @default 'Close'\n     */\n    defaultDismissLabel?: string\n\n    /**\n     * The default number of seconds after which the toast will be dismissed automatically.\n     *\n     * You can pass a different value to a specific toast when calling `showToast`. You can even\n     * pass `false` if you want a certain toast to never be dismissed automatically.\n     *\n     * @default 10 (seconds)\n     */\n    defaultAutoDismissDelay?: number\n\n    /**\n     * The padding used to separate the toasts from the viewport borders.\n     *\n     * @default 'large'\n     */\n    padding?: Space\n\n    /**\n     * The app wrapped by the provider.\n     */\n    children: NonNullable<React.ReactNode>\n\n    /**\n     * Custom classname for the toasts container, if you need to fine-tune the position or other styles\n     */\n    containerClassName?: string\n}\n\n/**\n * Provides the state management and rendering of the toasts currently active.\n *\n * You need to render this near the top of your app components tree, in order to `useToasts`.\n *\n * @see useToasts\n */\nfunction ToastsProvider({\n    children,\n    padding = 'large',\n    defaultAutoDismissDelay = 10 /* seconds */,\n    defaultDismissLabel = 'Close',\n    containerClassName,\n}: ToastsProviderProps) {\n    const [toasts, setToasts] = React.useState<ToastsList>([])\n    const { mappedRef, animateRemove } = useToastsAnimation()\n\n    const removeToast = React.useCallback(\n        function onRemoveToast(toastId: string) {\n            animateRemove(toastId, () => {\n                setToasts((list) => {\n                    const index = list.findIndex((n) => n.toastId === toastId)\n                    if (index < 0) return list\n                    const copy = [...list]\n                    copy.splice(index, 1)\n                    return copy\n                })\n            })\n        },\n        [animateRemove],\n    )\n\n    const showToast = React.useCallback(\n        function showToast(props: ToastProps) {\n            const toastId = generateElementId('toast')\n            const newToast: InternalToastEntry = {\n                autoDismissDelay: defaultAutoDismissDelay,\n                dismissLabel: defaultDismissLabel,\n                ...props,\n                toastId,\n            }\n            setToasts((list) => [...list, newToast])\n            return () => removeToast(toastId)\n        },\n        [defaultAutoDismissDelay, defaultDismissLabel, removeToast],\n    )\n\n    return (\n        <ToastsContext.Provider value={showToast}>\n            {children}\n            <Portal>\n                {toasts.length === 0 ? null : (\n                    <Box\n                        className={[styles.stackedToastsView, containerClassName]}\n                        position=\"fixed\"\n                        width=\"full\"\n                        paddingX={padding}\n                        paddingBottom={padding}\n                        data-testid=\"toasts-container\"\n                    >\n                        <Stack space=\"medium\">\n                            {toasts.map(({ toastId, ...props }) => (\n                                <InternalToast\n                                    key={toastId}\n                                    ref={mappedRef(toastId)}\n                                    toastId={toastId}\n                                    onRemoveToast={removeToast}\n                                    {...props}\n                                />\n                            ))}\n                        </Stack>\n                    </Box>\n                )}\n            </Portal>\n        </ToastsContext.Provider>\n    )\n}\n\n/**\n * Provides a function `showToast` that shows a new toast every time you call it.\n *\n * ```jsx\n * const showToast = useToasts()\n *\n * <button onClick={() => showToast({ message: 'Hello' })}>\n *   Say hello\n * </button>\n * ```\n *\n * All toasts fired via this function are rendered in a global fixed location, and stacked one on\n * top of the other.\n *\n * When called, `showToast` returns a function that dismisses the toast when called.\n *\n * @see ToastsProvider\n */\nfunction useToasts() {\n    return React.useContext(ToastsContext)\n}\n\n/**\n * Adds a toast to be rendered, stacked alongside any other currently active toasts.\n *\n * For most situations, you should prefer to use the `showToast` function obtained from `useToasts`.\n * This component is provided for convenience to render toasts in the markup, but it has some\n * peculiarities, which are discussed below.\n *\n * Internally, this calls `showToast`. It is provided for two reasons:\n *\n * 1. Convenience, when you want to fire a toast in markup/jsx code. Keep in mind, though, that\n *    toasts rendered in this way will be removed from view when the context where it is rendered\n *    is unmounted. Unlike toasts fired with `showToast`, which will normally be dismissed, either\n *    by the user or after a delay. They'll still be animated on their way out, though.\n * 2. When combined with disabling dismissing it (e.g. `showDismissButton={false}` and\n *    `autoDismissDelay={false}` it provides a way to show \"permanent\" toasts that only go away when\n *    the component ceases to be rendered).\n *\n * This is useful for cases when the consumer wants to control when a toast is visible, and to keep\n * it visible based on an app-specific condition.\n *\n * Something important to note about this component is that it triggers the toast based on the props\n * passed when first rendered, and it does not update the toast if these props change on subsequent\n * renders. In this sense, this is an imperative component, more than a descriptive one. This is\n * done to simplify the internals, and to keep it in line with how `showToast` works: you fire up a\n * toast imperatively, and you loose control over it. It remains rendered according to the props you\n * first passed.\n *\n * @see useToasts\n */\nfunction Toast(props: ToastProps) {\n    const showToast = useToasts()\n    const propsRef = React.useRef<ToastProps>(props)\n    React.useEffect(() => {\n        const dismissToast = showToast(propsRef.current)\n        return dismissToast\n    }, [showToast])\n    return null\n}\n\nexport { Toast, ToastsProvider, useToasts }\nexport type { ToastProps, ToastsProviderProps }\n"],"names":["InternalToast","React","forwardRef","message","description","icon","action","autoDismissDelay","dismissLabel","showDismissButton","toastId","onDismiss","onRemoveToast","ref","timeoutRef","useRef","removeToast","useCallback","startTimeout","current","window","setTimeout","stopTimeout","clearTimeout","undefined","useEffect","actionWithCustomActionHandler","useMemo","_action$closeToast","isActionObject","_objectSpread","objectSpread2","closeToast","onClick","_action$closeToast2","createElement","StaticToast","onMouseEnter","onMouseLeave","ToastsContext","createContext","useToasts","useContext","props","showToast","propsRef","children","padding","defaultAutoDismissDelay","defaultDismissLabel","containerClassName","toasts","setToasts","useState","mappedRef","animateRemove","useToastsAnimation","list","index","findIndex","n","copy","splice","generateElementId","newToast","Provider","value","Portal","length","Box","className","styles","stackedToastsView","position","width","paddingX","paddingBottom","Stack","space","map","_ref","_objectWithoutProperties","objectWithoutProperties","_excluded","key"],"mappings":"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"}

package/package.json

@@ -6,7 +6,7 @@
         "email": "henning@doist.com",
         "url": "http://doist.com"
     },
-    "version": "28.2.0",
+    "version": "28.2.1",
     "license": "MIT",
     "homepage": "https://github.com/Doist/reactist#readme",
     "repository": {