@react-spectrum/toast 3.1.6 → 3.2.0

package/dist/types.d.ts.map

@@ -1 +0,0 @@
-{"mappings":";;;;AEwBA,sBAA6B,KAAK,GAAG,SAAS,GAAG,QAAQ,GAAG,YAAY,CAAC;AAEzE,4CAA6C,SAAQ,oBAAoB;IACvE,SAAS,CAAC,EAAE,cAAc,CAAA;CAC3B;AAED,qCAAsC,SAAQ,YAAY,EAAE,QAAQ;IAClE,sDAAsD;IACtD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gEAAgE;IAChE,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,gFAAgF;IAChF,mBAAmB,CAAC,EAAE,OAAO,CAAA;CAC9B;AAED,qBAAqB,MAAM,IAAI,CAAC;AAmDhC;;;GAGG;AACH,+BAA+B,KAAK,EAAE,2BAA2B,GAAG,YAAY,GAAG,IAAI,CA+DtF;AAuCD,OAAA,MAAM;IACJ,8BAA8B;sBACZ,MAAM,YAAW,oBAAoB,GAAQ,aAAa;IAG5E,+BAA+B;uBACZ,MAAM,YAAW,oBAAoB,GAAQ,aAAa;IAG7E,+BAA+B;uBACZ,MAAM,YAAW,oBAAoB,GAAQ,aAAa;IAG7E,qCAAqC;mBACtB,MAAM,YAAW,oBAAoB,GAAQ,aAAa;CAG1E,CAAC","sources":["packages/@react-spectrum/toast/src/packages/@react-spectrum/toast/src/Toast.tsx","packages/@react-spectrum/toast/src/packages/@react-spectrum/toast/src/Toaster.tsx","packages/@react-spectrum/toast/src/packages/@react-spectrum/toast/src/ToastContainer.tsx","packages/@react-spectrum/toast/src/packages/@react-spectrum/toast/src/index.ts","packages/@react-spectrum/toast/src/index.ts"],"sourcesContent":[null,null,null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/// <reference types=\"css-module-types\" />\n\nexport {ToastContainer, ToastQueue} from './ToastContainer';\n\nexport type {SpectrumToastOptions, SpectrumToastContainerProps} from './ToastContainer';\n"],"names":[],"version":3,"file":"types.d.ts.map"}

package/dist/uk-UA.main.js

@@ -1,8 +0,0 @@
-module.exports = {
-    "info": `\u{406}\u{43D}\u{444}\u{43E}\u{440}\u{43C}\u{430}\u{446}\u{456}\u{44F}`,
-    "negative": `\u{41F}\u{43E}\u{43C}\u{438}\u{43B}\u{43A}\u{430}`,
-    "positive": `\u{423}\u{441}\u{43F}\u{456}\u{448}\u{43D}\u{43E}`
-};
-
-
-//# sourceMappingURL=uk-UA.main.js.map

package/dist/uk-UA.main.js.map

@@ -1 +0,0 @@
-{"mappings":"AAAA,iBAAiB;IAAG,QAAQ,CAAC,sEAAU,CAAC;IACtC,YAAY,CAAC,iDAAO,CAAC;IACrB,YAAY,CAAC,iDAAO,CAAC;AACvB","sources":["packages/@react-spectrum/toast/intl/uk-UA.json"],"sourcesContent":["{\n  \"info\": \"Інформація\",\n  \"negative\": \"Помилка\",\n  \"positive\": \"Успішно\"\n}\n"],"names":[],"version":3,"file":"uk-UA.main.js.map"}

package/dist/uk-UA.mjs

@@ -1,10 +0,0 @@
-var $6764c871b5447c7a$exports = {};
-$6764c871b5447c7a$exports = {
-    "info": `\u{406}\u{43D}\u{444}\u{43E}\u{440}\u{43C}\u{430}\u{446}\u{456}\u{44F}`,
-    "negative": `\u{41F}\u{43E}\u{43C}\u{438}\u{43B}\u{43A}\u{430}`,
-    "positive": `\u{423}\u{441}\u{43F}\u{456}\u{448}\u{43D}\u{43E}`
-};
-
-
-export {$6764c871b5447c7a$exports as default};
-//# sourceMappingURL=uk-UA.module.js.map

package/dist/uk-UA.module.js

@@ -1,10 +0,0 @@
-var $6764c871b5447c7a$exports = {};
-$6764c871b5447c7a$exports = {
-    "info": `\u{406}\u{43D}\u{444}\u{43E}\u{440}\u{43C}\u{430}\u{446}\u{456}\u{44F}`,
-    "negative": `\u{41F}\u{43E}\u{43C}\u{438}\u{43B}\u{43A}\u{430}`,
-    "positive": `\u{423}\u{441}\u{43F}\u{456}\u{448}\u{43D}\u{43E}`
-};
-
-
-export {$6764c871b5447c7a$exports as default};
-//# sourceMappingURL=uk-UA.module.js.map

package/dist/uk-UA.module.js.map

@@ -1 +0,0 @@
-{"mappings":";AAAA,4BAAiB;IAAG,QAAQ,CAAC,sEAAU,CAAC;IACtC,YAAY,CAAC,iDAAO,CAAC;IACrB,YAAY,CAAC,iDAAO,CAAC;AACvB","sources":["packages/@react-spectrum/toast/intl/uk-UA.json"],"sourcesContent":["{\n  \"info\": \"Інформація\",\n  \"negative\": \"Помилка\",\n  \"positive\": \"Успішно\"\n}\n"],"names":[],"version":3,"file":"uk-UA.module.js.map"}

package/dist/zh-CN.main.js

@@ -1,8 +0,0 @@
-module.exports = {
-    "info": `\u{4FE1}\u{606F}`,
-    "negative": `\u{9519}\u{8BEF}`,
-    "positive": `\u{6210}\u{529F}`
-};
-
-
-//# sourceMappingURL=zh-CN.main.js.map

package/dist/zh-CN.main.js.map

@@ -1 +0,0 @@
-{"mappings":"AAAA,iBAAiB;IAAG,QAAQ,CAAC,gBAAE,CAAC;IAC9B,YAAY,CAAC,gBAAE,CAAC;IAChB,YAAY,CAAC,gBAAE,CAAC;AAClB","sources":["packages/@react-spectrum/toast/intl/zh-CN.json"],"sourcesContent":["{\n  \"info\": \"信息\",\n  \"negative\": \"错误\",\n  \"positive\": \"成功\"\n}\n"],"names":[],"version":3,"file":"zh-CN.main.js.map"}

package/dist/zh-CN.mjs

@@ -1,10 +0,0 @@
-var $b1634d37b87f243f$exports = {};
-$b1634d37b87f243f$exports = {
-    "info": `\u{4FE1}\u{606F}`,
-    "negative": `\u{9519}\u{8BEF}`,
-    "positive": `\u{6210}\u{529F}`
-};
-
-
-export {$b1634d37b87f243f$exports as default};
-//# sourceMappingURL=zh-CN.module.js.map

package/dist/zh-CN.module.js

@@ -1,10 +0,0 @@
-var $b1634d37b87f243f$exports = {};
-$b1634d37b87f243f$exports = {
-    "info": `\u{4FE1}\u{606F}`,
-    "negative": `\u{9519}\u{8BEF}`,
-    "positive": `\u{6210}\u{529F}`
-};
-
-
-export {$b1634d37b87f243f$exports as default};
-//# sourceMappingURL=zh-CN.module.js.map

package/dist/zh-CN.module.js.map

@@ -1 +0,0 @@
-{"mappings":";AAAA,4BAAiB;IAAG,QAAQ,CAAC,gBAAE,CAAC;IAC9B,YAAY,CAAC,gBAAE,CAAC;IAChB,YAAY,CAAC,gBAAE,CAAC;AAClB","sources":["packages/@react-spectrum/toast/intl/zh-CN.json"],"sourcesContent":["{\n  \"info\": \"信息\",\n  \"negative\": \"错误\",\n  \"positive\": \"成功\"\n}\n"],"names":[],"version":3,"file":"zh-CN.module.js.map"}

package/dist/zh-TW.main.js

@@ -1,8 +0,0 @@
-module.exports = {
-    "info": `\u{8CC7}\u{8A0A}`,
-    "negative": `\u{932F}\u{8AA4}`,
-    "positive": `\u{6210}\u{529F}`
-};
-
-
-//# sourceMappingURL=zh-TW.main.js.map

package/dist/zh-TW.main.js.map

@@ -1 +0,0 @@
-{"mappings":"AAAA,iBAAiB;IAAG,QAAQ,CAAC,gBAAE,CAAC;IAC9B,YAAY,CAAC,gBAAE,CAAC;IAChB,YAAY,CAAC,gBAAE,CAAC;AAClB","sources":["packages/@react-spectrum/toast/intl/zh-TW.json"],"sourcesContent":["{\n  \"info\": \"資訊\",\n  \"negative\": \"錯誤\",\n  \"positive\": \"成功\"\n}\n"],"names":[],"version":3,"file":"zh-TW.main.js.map"}

package/dist/zh-TW.mjs

@@ -1,10 +0,0 @@
-var $19cbd4230357935e$exports = {};
-$19cbd4230357935e$exports = {
-    "info": `\u{8CC7}\u{8A0A}`,
-    "negative": `\u{932F}\u{8AA4}`,
-    "positive": `\u{6210}\u{529F}`
-};
-
-
-export {$19cbd4230357935e$exports as default};
-//# sourceMappingURL=zh-TW.module.js.map

package/dist/zh-TW.module.js

@@ -1,10 +0,0 @@
-var $19cbd4230357935e$exports = {};
-$19cbd4230357935e$exports = {
-    "info": `\u{8CC7}\u{8A0A}`,
-    "negative": `\u{932F}\u{8AA4}`,
-    "positive": `\u{6210}\u{529F}`
-};
-
-
-export {$19cbd4230357935e$exports as default};
-//# sourceMappingURL=zh-TW.module.js.map

package/dist/zh-TW.module.js.map

@@ -1 +0,0 @@
-{"mappings":";AAAA,4BAAiB;IAAG,QAAQ,CAAC,gBAAE,CAAC;IAC9B,YAAY,CAAC,gBAAE,CAAC;IAChB,YAAY,CAAC,gBAAE,CAAC;AAClB","sources":["packages/@react-spectrum/toast/intl/zh-TW.json"],"sourcesContent":["{\n  \"info\": \"資訊\",\n  \"negative\": \"錯誤\",\n  \"positive\": \"成功\"\n}\n"],"names":[],"version":3,"file":"zh-TW.module.js.map"}

package/src/Toast.tsx

@@ -1,135 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-import AlertMedium from '@spectrum-icons/ui/AlertMedium';
-import {Button, ClearButton} from '@react-spectrum/button';
-import {classNames, useDOMRef, useStyleProps} from '@react-spectrum/utils';
-import CrossMedium from '@spectrum-icons/ui/CrossMedium';
-import {DOMProps, DOMRef} from '@react-types/shared';
-import {filterDOMProps, mergeProps} from '@react-aria/utils';
-import InfoMedium from '@spectrum-icons/ui/InfoMedium';
-// @ts-ignore
-import intlMessages from '../intl/*.json';
-import {QueuedToast, ToastState} from '@react-stately/toast';
-import React from 'react';
-import styles from '@adobe/spectrum-css-temp/components/toast/vars.css';
-import SuccessMedium from '@spectrum-icons/ui/SuccessMedium';
-import toastContainerStyles from './toastContainer.css';
-import {useFocusRing} from '@react-aria/focus';
-import {useLocalizedStringFormatter} from '@react-aria/i18n';
-import {useToast} from '@react-aria/toast';
-
-export interface SpectrumToastValue extends DOMProps {
-  children: string,
-  variant: 'positive' | 'negative' | 'info' | 'neutral',
-  actionLabel?: string,
-  onAction?: () => void,
-  shouldCloseOnAction?: boolean
-}
-
-export interface SpectrumToastProps {
-  toast: QueuedToast<SpectrumToastValue>,
-  state: ToastState<SpectrumToastValue>
-}
-
-// TODO: express should use filled icons...
-export const ICONS = {
-  info: InfoMedium,
-  negative: AlertMedium,
-  positive: SuccessMedium
-};
-
-export const Toast = React.forwardRef(function Toast(props: SpectrumToastProps, ref: DOMRef<HTMLDivElement>) {
-  let {
-    toast: {
-      key,
-      content: {
-        children,
-        variant,
-        actionLabel,
-        onAction,
-        shouldCloseOnAction
-      }
-    },
-    state,
-    ...otherProps
-  } = props;
-  let domRef = useDOMRef(ref);
-  let {
-    closeButtonProps,
-    titleProps,
-    toastProps,
-    contentProps
-  } = useToast(props, state, domRef);
-  let {styleProps} = useStyleProps(otherProps);
-
-  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/toast');
-  let iconLabel = variant && variant !== 'neutral' ? stringFormatter.format(variant) : null;
-  let Icon = ICONS[variant];
-  let {isFocusVisible, focusProps} = useFocusRing();
-
-  const handleAction = () => {
-    if (onAction) {
-      onAction();
-    }
-
-    if (shouldCloseOnAction) {
-      state.close(key);
-    }
-  };
-
-  return (
-    <div
-      {...styleProps}
-      {...mergeProps(toastProps, focusProps)}
-      {...filterDOMProps(props.toast.content)}
-      ref={domRef}
-      className={classNames(styles,
-        'spectrum-Toast',
-        {['spectrum-Toast--' + variant]: variant},
-        styleProps.className,
-        classNames(
-          toastContainerStyles,
-          'spectrum-Toast',
-          {'focus-ring': isFocusVisible}
-        )
-      )}>
-      <div
-        {...contentProps}
-        className={classNames(toastContainerStyles, 'spectrum-Toast-contentWrapper')}>
-        {Icon &&
-          <Icon
-            aria-label={iconLabel}
-            UNSAFE_className={classNames(styles, 'spectrum-Toast-typeIcon')} />
-        }
-        <div className={classNames(styles, 'spectrum-Toast-body')} role="presentation">
-          <div className={classNames(styles, 'spectrum-Toast-content')} role="presentation" {...titleProps}>{children}</div>
-          {actionLabel &&
-            <Button
-              onPress={handleAction}
-              UNSAFE_className={classNames(styles, 'spectrum-Button')}
-              variant="secondary"
-              staticColor="white"
-              data-testid="rsp-Toast-secondaryButton">
-              {actionLabel}
-            </Button>
-          }
-        </div>
-      </div>
-      <div className={classNames(styles, 'spectrum-Toast-buttons')}>
-        <ClearButton {...closeButtonProps} variant="overBackground" data-testid="rsp-Toast-closeButton">
-          <CrossMedium />
-        </ClearButton>
-      </div>
-    </div>
-  );
-});

package/src/ToastContainer.tsx

@@ -1,216 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-import {AriaToastRegionProps} from '@react-aria/toast';
-import {classNames} from '@react-spectrum/utils';
-import {DOMProps} from '@react-types/shared';
-import {filterDOMProps} from '@react-aria/utils';
-import {flushSync} from 'react-dom';
-import React, {ReactElement, useEffect, useMemo, useRef} from 'react';
-import {SpectrumToastValue, Toast} from './Toast';
-import toastContainerStyles from './toastContainer.css';
-import {Toaster} from './Toaster';
-import {ToastOptions, ToastQueue, useToastQueue} from '@react-stately/toast';
-import {useSyncExternalStore} from 'use-sync-external-store/shim/index.js';
-
-export type ToastPlacement = 'top' | 'top end' | 'bottom' | 'bottom end';
-
-export interface SpectrumToastContainerProps extends AriaToastRegionProps {
-  placement?: ToastPlacement
-}
-
-export interface SpectrumToastOptions extends ToastOptions, DOMProps {
-  /** A label for the action button within the toast. */
-  actionLabel?: string,
-  /** Handler that is called when the action button is pressed. */
-  onAction?: () => void,
-  /** Whether the toast should automatically close when an action is performed. */
-  shouldCloseOnAction?: boolean
-}
-
-type CloseFunction = () => void;
-
-function wrapInViewTransition(fn: () => void): void {
-  if ('startViewTransition' in document) {
-    document.startViewTransition(() => {
-      flushSync(fn);
-    }).ready.catch(() => {});
-  } else {
-    fn();
-  }
-}
-
-// There is a single global toast queue instance for the whole app, initialized lazily.
-let globalToastQueue: ToastQueue<SpectrumToastValue> | null = null;
-function getGlobalToastQueue() {
-  if (!globalToastQueue) {
-    globalToastQueue = new ToastQueue({
-      maxVisibleToasts: Infinity,
-      wrapUpdate: wrapInViewTransition
-    });
-  }
-
-  return globalToastQueue;
-}
-
-// For testing. Not exported from the package index.
-export function clearToastQueue(): void {
-  globalToastQueue = null;
-}
-
-let toastProviders = new Set();
-let subscriptions = new Set<() => void>();
-function subscribe(fn: () => void) {
-  subscriptions.add(fn);
-  return () => subscriptions.delete(fn);
-}
-
-function triggerSubscriptions() {
-  for (let fn of subscriptions) {
-    fn();
-  }
-}
-
-function getActiveToastContainer() {
-  return toastProviders.values().next().value;
-}
-
-function useActiveToastContainer() {
-  return useSyncExternalStore(subscribe, getActiveToastContainer, getActiveToastContainer);
-}
-
-/**
- * A ToastContainer renders the queued toasts in an application. It should be placed
- * at the root of the app.
- */
-export function ToastContainer(props: SpectrumToastContainerProps): ReactElement | null {
-  // Track all toast provider instances in a set.
-  // Only the first one will actually render.
-  // We use a ref to do this, since it will have a stable identity
-  // over the lifetime of the component.
-  let ref = useRef(null);
-
-
-  useEffect(() => {
-    toastProviders.add(ref);
-    triggerSubscriptions();
-
-    return () => {
-      // Remove this toast provider, and call subscriptions.
-      // This will cause all other instances to re-render,
-      // and the first one to become the new active toast provider.
-      toastProviders.delete(ref);
-      triggerSubscriptions();
-    };
-  }, []);
-
-  // Only render if this is the active toast provider instance, and there are visible toasts.
-  let activeToastContainer = useActiveToastContainer();
-  let state = useToastQueue(getGlobalToastQueue());
-
-  let {placement, isCentered} = useMemo(() => {
-    let placements = (props.placement ?? 'bottom').split(' ');
-    let placement = placements[placements.length - 1];
-    let isCentered = placements.length === 1;
-    return {placement, isCentered};
-  }, [props.placement]);
-
-  if (ref === activeToastContainer && state.visibleToasts.length > 0) {
-    return (
-      <Toaster state={state} {...props}>
-        <ol className={classNames(toastContainerStyles, 'spectrum-ToastContainer-list')}>
-          {state.visibleToasts.map((toast, index) => {
-            let shouldFade = isCentered && index !== 0;
-            return (
-              <li
-                key={toast.key}
-                className={classNames(toastContainerStyles, 'spectrum-ToastContainer-listitem')}
-                style={{
-                  viewTransitionName: toast.key,
-                  viewTransitionClass: classNames(
-                    toastContainerStyles,
-                    'toast',
-                    placement,
-                    {'fadeOnly': shouldFade}
-                  )
-                }}>
-                <Toast
-                  toast={toast}
-                  state={state} />
-              </li>
-            );
-          })}
-        </ol>
-      </Toaster>
-    );
-  }
-
-  return null;
-}
-
-function addToast(children: string, variant: SpectrumToastValue['variant'], options: SpectrumToastOptions = {}) {
-  // Dispatch a custom event so that toasts can be intercepted and re-targeted, e.g. when inside an iframe.
-  if (typeof CustomEvent !== 'undefined' && typeof window !== 'undefined') {
-    let event = new CustomEvent('react-spectrum-toast', {
-      cancelable: true,
-      bubbles: true,
-      detail: {
-        children,
-        variant,
-        options
-      }
-    });
-
-    let shouldContinue = window.dispatchEvent(event);
-    if (!shouldContinue) {
-      return () => {};
-    }
-  }
-
-  let value = {
-    children,
-    variant,
-    actionLabel: options.actionLabel,
-    onAction: options.onAction,
-    shouldCloseOnAction: options.shouldCloseOnAction,
-    ...filterDOMProps(options)
-  };
-
-  // Minimum time of 5s from https://spectrum.adobe.com/page/toast/#Auto-dismissible
-  // Actionable toasts cannot be auto dismissed. That would fail WCAG SC 2.2.1.
-  // It is debatable whether non-actionable toasts would also fail.
-  let timeout = options.timeout && !options.onAction ? Math.max(options.timeout, 5000) : undefined;
-  let queue = getGlobalToastQueue();
-  let key = queue.add(value, {timeout, onClose: options.onClose});
-  return () => queue.close(key);
-}
-
-const SpectrumToastQueue = {
-  /** Queues a neutral toast. */
-  neutral(children: string, options: SpectrumToastOptions = {}): CloseFunction {
-    return addToast(children, 'neutral', options);
-  },
-  /** Queues a positive toast. */
-  positive(children: string, options: SpectrumToastOptions = {}): CloseFunction {
-    return addToast(children, 'positive', options);
-  },
-  /** Queues a negative toast. */
-  negative(children: string, options: SpectrumToastOptions = {}): CloseFunction {
-    return addToast(children, 'negative', options);
-  },
-  /** Queues an informational toast. */
-  info(children: string, options: SpectrumToastOptions = {}): CloseFunction {
-    return addToast(children, 'info', options);
-  }
-};
-
-export {SpectrumToastQueue as ToastQueue};

package/src/Toaster.tsx

@@ -1,71 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-import {AriaToastRegionProps, useToastRegion} from '@react-aria/toast';
-import {classNames} from '@react-spectrum/utils';
-import {FocusScope, useFocusRing} from '@react-aria/focus';
-import {mergeProps} from '@react-aria/utils';
-import {Provider} from '@react-spectrum/provider';
-import React, {createContext, ReactElement, ReactNode, useMemo, useRef} from 'react';
-import ReactDOM from 'react-dom';
-import toastContainerStyles from './toastContainer.css';
-import type {ToastPlacement} from './ToastContainer';
-import {ToastState} from '@react-stately/toast';
-import {useUNSAFE_PortalContext} from '@react-aria/overlays';
-
-interface ToastContainerProps extends AriaToastRegionProps {
-  children: ReactNode,
-  state: ToastState<unknown>,
-  placement?: ToastPlacement
-}
-
-export const ToasterContext = createContext(false);
-
-export function Toaster(props: ToastContainerProps): ReactElement {
-  let {
-    children,
-    state
-  } = props;
-
-  let ref = useRef(null);
-  let {regionProps} = useToastRegion(props, state, ref);
-  let {focusProps, isFocusVisible} = useFocusRing();
-  let {getContainer} = useUNSAFE_PortalContext();
-
-  let [position, placement] = useMemo(() => {
-    let [pos = 'bottom', place = 'center'] = props.placement?.split(' ') || [];
-    return [pos, place];
-  }, [props.placement]);
-
-  let contents = (
-    <Provider UNSAFE_style={{background: 'transparent'}}>
-      <FocusScope>
-        <ToasterContext.Provider value={isFocusVisible}>
-          <div
-            {...mergeProps(regionProps, focusProps)}
-            ref={ref}
-            data-position={position}
-            data-placement={placement}
-            className={classNames(
-              toastContainerStyles,
-              'react-spectrum-ToastContainer',
-              {'focus-ring': isFocusVisible}
-            )}>
-            {children}
-          </div>
-        </ToasterContext.Provider>
-      </FocusScope>
-    </Provider>
-  );
-
-  return ReactDOM.createPortal(contents, getContainer?.() ?? document.body);
-}