@zendeskgarden/react-notifications 8.75.1 → 8.76.0

package/dist/esm/elements/Alert.js

@@ -0,0 +1,49 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import { TYPE } from '../types/index.js';
+import '../styled/content/StyledClose.js';
+import '../styled/content/StyledParagraph.js';
+import '../styled/content/StyledTitle.js';
+import { StyledAlert } from '../styled/StyledAlert.js';
+import '../styled/StyledNotification.js';
+import '../styled/StyledWell.js';
+import { StyledIcon } from '../styled/StyledIcon.js';
+import '../styled/StyledBase.js';
+import '../styled/global-alert/StyledGlobalAlert.js';
+import '../styled/global-alert/StyledGlobalAlertButton.js';
+import '../styled/global-alert/StyledGlobalAlertClose.js';
+import '../styled/global-alert/StyledGlobalAlertContent.js';
+import '../styled/global-alert/StyledGlobalAlertIcon.js';
+import '../styled/global-alert/StyledGlobalAlertTitle.js';
+import { validationHues, validationIcons } from '../utils/icons.js';
+import { NotificationsContext } from '../utils/useNotificationsContext.js';
+
+const Alert = React__default.forwardRef((_ref, ref) => {
+  let {
+    role,
+    ...props
+  } = _ref;
+  const hue = validationHues[props.type];
+  const Icon = validationIcons[props.type];
+  return React__default.createElement(NotificationsContext.Provider, {
+    value: hue
+  }, React__default.createElement(StyledAlert, Object.assign({
+    ref: ref,
+    hue: hue,
+    role: role === undefined ? 'alert' : role
+  }, props), React__default.createElement(StyledIcon, {
+    hue: hue
+  }, React__default.createElement(Icon, null)), props.children));
+});
+Alert.displayName = 'Alert';
+Alert.propTypes = {
+  type: PropTypes.oneOf(TYPE).isRequired
+};
+
+export { Alert };

package/dist/esm/elements/Notification.js

@@ -0,0 +1,49 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef } from 'react';
+import PropTypes from 'prop-types';
+import SvgInfoStroke from '../node_modules/@zendeskgarden/svg-icons/src/16/info-stroke.svg.js';
+import { TYPE } from '../types/index.js';
+import '../styled/content/StyledClose.js';
+import '../styled/content/StyledParagraph.js';
+import '../styled/content/StyledTitle.js';
+import '../styled/StyledAlert.js';
+import { StyledNotification } from '../styled/StyledNotification.js';
+import '../styled/StyledWell.js';
+import { StyledIcon } from '../styled/StyledIcon.js';
+import '../styled/StyledBase.js';
+import '../styled/global-alert/StyledGlobalAlert.js';
+import '../styled/global-alert/StyledGlobalAlertButton.js';
+import '../styled/global-alert/StyledGlobalAlertClose.js';
+import '../styled/global-alert/StyledGlobalAlertContent.js';
+import '../styled/global-alert/StyledGlobalAlertIcon.js';
+import '../styled/global-alert/StyledGlobalAlertTitle.js';
+import { validationIcons, validationHues } from '../utils/icons.js';
+
+const Notification = forwardRef((_ref, ref) => {
+  let {
+    role,
+    ...props
+  } = _ref;
+  const Icon = props.type ? validationIcons[props.type] : SvgInfoStroke;
+  const hue = props.type && validationHues[props.type];
+  return React__default.createElement(StyledNotification, Object.assign({
+    ref: ref,
+    type: props.type,
+    isFloating: true
+  }, props, {
+    role: role === undefined ? 'status' : role
+  }), props.type && React__default.createElement(StyledIcon, {
+    hue: hue
+  }, React__default.createElement(Icon, null)), props.children);
+});
+Notification.displayName = 'Notification';
+Notification.propTypes = {
+  type: PropTypes.oneOf(TYPE)
+};
+
+export { Notification };

package/dist/esm/elements/Well.js

@@ -0,0 +1,33 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default from 'react';
+import PropTypes from 'prop-types';
+import '../styled/content/StyledClose.js';
+import '../styled/content/StyledParagraph.js';
+import '../styled/content/StyledTitle.js';
+import '../styled/StyledAlert.js';
+import '../styled/StyledNotification.js';
+import { StyledWell } from '../styled/StyledWell.js';
+import '../styled/StyledIcon.js';
+import '../styled/StyledBase.js';
+import '../styled/global-alert/StyledGlobalAlert.js';
+import '../styled/global-alert/StyledGlobalAlertButton.js';
+import '../styled/global-alert/StyledGlobalAlertClose.js';
+import '../styled/global-alert/StyledGlobalAlertContent.js';
+import '../styled/global-alert/StyledGlobalAlertIcon.js';
+import '../styled/global-alert/StyledGlobalAlertTitle.js';
+
+const Well = React__default.forwardRef((props, ref) => React__default.createElement(StyledWell, Object.assign({
+  ref: ref
+}, props)));
+Well.displayName = 'Well';
+Well.propTypes = {
+  isRecessed: PropTypes.bool,
+  isFloating: PropTypes.bool
+};
+
+export { Well };

package/dist/esm/elements/content/Close.js

@@ -0,0 +1,37 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default from 'react';
+import { StyledClose } from '../../styled/content/StyledClose.js';
+import '../../styled/content/StyledParagraph.js';
+import '../../styled/content/StyledTitle.js';
+import '../../styled/StyledAlert.js';
+import '../../styled/StyledNotification.js';
+import '../../styled/StyledWell.js';
+import '../../styled/StyledIcon.js';
+import '../../styled/StyledBase.js';
+import '../../styled/global-alert/StyledGlobalAlert.js';
+import '../../styled/global-alert/StyledGlobalAlertButton.js';
+import '../../styled/global-alert/StyledGlobalAlertClose.js';
+import '../../styled/global-alert/StyledGlobalAlertContent.js';
+import '../../styled/global-alert/StyledGlobalAlertIcon.js';
+import '../../styled/global-alert/StyledGlobalAlertTitle.js';
+import { useNotificationsContext } from '../../utils/useNotificationsContext.js';
+import { useText } from '@zendeskgarden/react-theming';
+import SvgXStroke from '../../node_modules/@zendeskgarden/svg-icons/src/12/x-stroke.svg.js';
+
+const Close = React__default.forwardRef((props, ref) => {
+  const ariaLabel = useText(Close, props, 'aria-label', 'Close');
+  const hue = useNotificationsContext();
+  return React__default.createElement(StyledClose, Object.assign({
+    ref: ref,
+    hue: hue,
+    "aria-label": ariaLabel
+  }, props), React__default.createElement(SvgXStroke, null));
+});
+Close.displayName = 'Close';
+
+export { Close };

package/dist/esm/elements/content/Paragraph.js

@@ -0,0 +1,28 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default from 'react';
+import '../../styled/content/StyledClose.js';
+import { StyledParagraph } from '../../styled/content/StyledParagraph.js';
+import '../../styled/content/StyledTitle.js';
+import '../../styled/StyledAlert.js';
+import '../../styled/StyledNotification.js';
+import '../../styled/StyledWell.js';
+import '../../styled/StyledIcon.js';
+import '../../styled/StyledBase.js';
+import '../../styled/global-alert/StyledGlobalAlert.js';
+import '../../styled/global-alert/StyledGlobalAlertButton.js';
+import '../../styled/global-alert/StyledGlobalAlertClose.js';
+import '../../styled/global-alert/StyledGlobalAlertContent.js';
+import '../../styled/global-alert/StyledGlobalAlertIcon.js';
+import '../../styled/global-alert/StyledGlobalAlertTitle.js';
+
+const Paragraph = React__default.forwardRef((props, ref) => React__default.createElement(StyledParagraph, Object.assign({
+  ref: ref
+}, props)));
+Paragraph.displayName = 'Paragraph';
+
+export { Paragraph };

package/dist/esm/elements/content/Title.js

@@ -0,0 +1,28 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default from 'react';
+import '../../styled/content/StyledClose.js';
+import '../../styled/content/StyledParagraph.js';
+import { StyledTitle } from '../../styled/content/StyledTitle.js';
+import '../../styled/StyledAlert.js';
+import '../../styled/StyledNotification.js';
+import '../../styled/StyledWell.js';
+import '../../styled/StyledIcon.js';
+import '../../styled/StyledBase.js';
+import '../../styled/global-alert/StyledGlobalAlert.js';
+import '../../styled/global-alert/StyledGlobalAlertButton.js';
+import '../../styled/global-alert/StyledGlobalAlertClose.js';
+import '../../styled/global-alert/StyledGlobalAlertContent.js';
+import '../../styled/global-alert/StyledGlobalAlertIcon.js';
+import '../../styled/global-alert/StyledGlobalAlertTitle.js';
+
+const Title = React__default.forwardRef((props, ref) => React__default.createElement(StyledTitle, Object.assign({
+  ref: ref
+}, props)));
+Title.displayName = 'Title';
+
+export { Title };

package/dist/esm/elements/global-alert/GlobalAlert.js

@@ -0,0 +1,64 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef, useMemo } from 'react';
+import PropTypes from 'prop-types';
+import SvgInfoStroke from '../../node_modules/@zendeskgarden/svg-icons/src/16/info-stroke.svg.js';
+import SvgAlertErrorStroke from '../../node_modules/@zendeskgarden/svg-icons/src/16/alert-error-stroke.svg.js';
+import SvgAlertWarningStroke from '../../node_modules/@zendeskgarden/svg-icons/src/16/alert-warning-stroke.svg.js';
+import SvgCheckCircleStroke from '../../node_modules/@zendeskgarden/svg-icons/src/16/check-circle-stroke.svg.js';
+import { TYPE } from '../../types/index.js';
+import '../../styled/content/StyledClose.js';
+import '../../styled/content/StyledParagraph.js';
+import '../../styled/content/StyledTitle.js';
+import '../../styled/StyledAlert.js';
+import '../../styled/StyledNotification.js';
+import '../../styled/StyledWell.js';
+import '../../styled/StyledIcon.js';
+import '../../styled/StyledBase.js';
+import { StyledGlobalAlert } from '../../styled/global-alert/StyledGlobalAlert.js';
+import '../../styled/global-alert/StyledGlobalAlertButton.js';
+import '../../styled/global-alert/StyledGlobalAlertClose.js';
+import '../../styled/global-alert/StyledGlobalAlertContent.js';
+import { StyledGlobalAlertIcon } from '../../styled/global-alert/StyledGlobalAlertIcon.js';
+import '../../styled/global-alert/StyledGlobalAlertTitle.js';
+import { GlobalAlertContext } from './utility.js';
+import { GlobalAlertButton } from './GlobalAlertButton.js';
+import { GlobalAlertClose } from './GlobalAlertClose.js';
+import { GlobalAlertContent } from './GlobalAlertContent.js';
+import { GlobalAlertTitle } from './GlobalAlertTitle.js';
+
+const GlobalAlertComponent = forwardRef((_ref, ref) => {
+  let {
+    type,
+    ...props
+  } = _ref;
+  return React__default.createElement(GlobalAlertContext.Provider, {
+    value: useMemo(() => ({
+      type
+    }), [type])
+  }, React__default.createElement(StyledGlobalAlert, Object.assign({
+    ref: ref,
+    role: "status",
+    alertType: type
+  }, props), {
+    success: React__default.createElement(StyledGlobalAlertIcon, null, React__default.createElement(SvgCheckCircleStroke, null)),
+    error: React__default.createElement(StyledGlobalAlertIcon, null, React__default.createElement(SvgAlertErrorStroke, null)),
+    warning: React__default.createElement(StyledGlobalAlertIcon, null, React__default.createElement(SvgAlertWarningStroke, null)),
+    info: React__default.createElement(StyledGlobalAlertIcon, null, React__default.createElement(SvgInfoStroke, null))
+  }[type], props.children));
+});
+GlobalAlertComponent.displayName = 'GlobalAlert';
+const GlobalAlert = GlobalAlertComponent;
+GlobalAlert.Button = GlobalAlertButton;
+GlobalAlert.Close = GlobalAlertClose;
+GlobalAlert.Content = GlobalAlertContent;
+GlobalAlert.Title = GlobalAlertTitle;
+GlobalAlert.propTypes = {
+  type: PropTypes.oneOf(TYPE).isRequired
+};
+
+export { GlobalAlert };

package/dist/esm/elements/global-alert/GlobalAlertButton.js

@@ -0,0 +1,46 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef } from 'react';
+import PropTypes from 'prop-types';
+import '../../styled/content/StyledClose.js';
+import '../../styled/content/StyledParagraph.js';
+import '../../styled/content/StyledTitle.js';
+import '../../styled/StyledAlert.js';
+import '../../styled/StyledNotification.js';
+import '../../styled/StyledWell.js';
+import '../../styled/StyledIcon.js';
+import '../../styled/StyledBase.js';
+import '../../styled/global-alert/StyledGlobalAlert.js';
+import { StyledGlobalAlertButton } from '../../styled/global-alert/StyledGlobalAlertButton.js';
+import '../../styled/global-alert/StyledGlobalAlertClose.js';
+import '../../styled/global-alert/StyledGlobalAlertContent.js';
+import '../../styled/global-alert/StyledGlobalAlertIcon.js';
+import '../../styled/global-alert/StyledGlobalAlertTitle.js';
+import { useGlobalAlertContext } from './utility.js';
+
+const GlobalAlertButton = forwardRef((_ref, ref) => {
+  let {
+    isBasic,
+    ...props
+  } = _ref;
+  const {
+    type
+  } = useGlobalAlertContext();
+  return React__default.createElement(StyledGlobalAlertButton, Object.assign({
+    ref: ref,
+    alertType: type
+  }, props, {
+    isPrimary: !isBasic,
+    isBasic: isBasic
+  }));
+});
+GlobalAlertButton.displayName = 'GlobalAlert.Button';
+GlobalAlertButton.propTypes = {
+  isBasic: PropTypes.bool
+};
+
+export { GlobalAlertButton };

package/dist/esm/elements/global-alert/GlobalAlertClose.js

@@ -0,0 +1,41 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef } from 'react';
+import { useText } from '@zendeskgarden/react-theming';
+import SvgXStroke from '../../node_modules/@zendeskgarden/svg-icons/src/16/x-stroke.svg.js';
+import '../../styled/content/StyledClose.js';
+import '../../styled/content/StyledParagraph.js';
+import '../../styled/content/StyledTitle.js';
+import '../../styled/StyledAlert.js';
+import '../../styled/StyledNotification.js';
+import '../../styled/StyledWell.js';
+import '../../styled/StyledIcon.js';
+import '../../styled/StyledBase.js';
+import '../../styled/global-alert/StyledGlobalAlert.js';
+import '../../styled/global-alert/StyledGlobalAlertButton.js';
+import { StyledGlobalAlertClose } from '../../styled/global-alert/StyledGlobalAlertClose.js';
+import '../../styled/global-alert/StyledGlobalAlertContent.js';
+import '../../styled/global-alert/StyledGlobalAlertIcon.js';
+import '../../styled/global-alert/StyledGlobalAlertTitle.js';
+import { useGlobalAlertContext } from './utility.js';
+
+const GlobalAlertClose = forwardRef((props, ref) => {
+  const {
+    type
+  } = useGlobalAlertContext();
+  const label = useText(GlobalAlertClose, props, 'aria-label', 'Close');
+  return React__default.createElement(StyledGlobalAlertClose, Object.assign({
+    ref: ref,
+    alertType: type
+  }, props), React__default.createElement(SvgXStroke, {
+    role: "img",
+    "aria-label": label
+  }));
+});
+GlobalAlertClose.displayName = 'GlobalAlert.Close';
+
+export { GlobalAlertClose };

package/dist/esm/elements/global-alert/GlobalAlertContent.js

@@ -0,0 +1,30 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef } from 'react';
+import '../../styled/content/StyledClose.js';
+import '../../styled/content/StyledParagraph.js';
+import '../../styled/content/StyledTitle.js';
+import '../../styled/StyledAlert.js';
+import '../../styled/StyledNotification.js';
+import '../../styled/StyledWell.js';
+import '../../styled/StyledIcon.js';
+import '../../styled/StyledBase.js';
+import '../../styled/global-alert/StyledGlobalAlert.js';
+import '../../styled/global-alert/StyledGlobalAlertButton.js';
+import '../../styled/global-alert/StyledGlobalAlertClose.js';
+import { StyledGlobalAlertContent } from '../../styled/global-alert/StyledGlobalAlertContent.js';
+import '../../styled/global-alert/StyledGlobalAlertIcon.js';
+import '../../styled/global-alert/StyledGlobalAlertTitle.js';
+
+const GlobalAlertContent = forwardRef((props, ref) => {
+  return React__default.createElement(StyledGlobalAlertContent, Object.assign({
+    ref: ref
+  }, props));
+});
+GlobalAlertContent.displayName = 'GlobalAlert.Content';
+
+export { GlobalAlertContent };

package/dist/esm/elements/global-alert/GlobalAlertTitle.js

@@ -0,0 +1,39 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { forwardRef } from 'react';
+import PropTypes from 'prop-types';
+import '../../styled/content/StyledClose.js';
+import '../../styled/content/StyledParagraph.js';
+import '../../styled/content/StyledTitle.js';
+import '../../styled/StyledAlert.js';
+import '../../styled/StyledNotification.js';
+import '../../styled/StyledWell.js';
+import '../../styled/StyledIcon.js';
+import '../../styled/StyledBase.js';
+import '../../styled/global-alert/StyledGlobalAlert.js';
+import '../../styled/global-alert/StyledGlobalAlertButton.js';
+import '../../styled/global-alert/StyledGlobalAlertClose.js';
+import '../../styled/global-alert/StyledGlobalAlertContent.js';
+import '../../styled/global-alert/StyledGlobalAlertIcon.js';
+import { StyledGlobalAlertTitle } from '../../styled/global-alert/StyledGlobalAlertTitle.js';
+import { useGlobalAlertContext } from './utility.js';
+
+const GlobalAlertTitle = forwardRef((props, ref) => {
+  const {
+    type
+  } = useGlobalAlertContext();
+  return React__default.createElement(StyledGlobalAlertTitle, Object.assign({
+    alertType: type,
+    ref: ref
+  }, props));
+});
+GlobalAlertTitle.displayName = 'GlobalAlert.Title';
+GlobalAlertTitle.propTypes = {
+  isRegular: PropTypes.bool
+};
+
+export { GlobalAlertTitle };

package/dist/esm/elements/global-alert/utility.js

@@ -0,0 +1,14 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import { createContext, useContext } from 'react';
+
+const GlobalAlertContext = createContext({
+  type: 'info'
+});
+const useGlobalAlertContext = () => useContext(GlobalAlertContext);
+
+export { GlobalAlertContext, useGlobalAlertContext };

package/dist/esm/elements/toaster/Toast.js

@@ -0,0 +1,62 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import { useState, useRef, useEffect, useCallback } from 'react';
+import { useToast } from './useToast.js';
+
+const Toast = _ref => {
+  let {
+    toast,
+    pauseTimers
+  } = _ref;
+  const {
+    removeToast
+  } = useToast();
+  const {
+    id
+  } = toast;
+  const {
+    autoDismiss
+  } = toast.options;
+  const [remainingTime, setRemainingTime] = useState(NaN);
+  const startTimeRef = useRef(Date.now());
+  const previousRemainingTimeRef = useRef(remainingTime);
+  useEffect(() => {
+    if (typeof autoDismiss === 'number') {
+      setRemainingTime(autoDismiss);
+    } else {
+      setRemainingTime(NaN);
+    }
+  }, [autoDismiss]);
+  useEffect(() => {
+    if (pauseTimers && !isNaN(remainingTime)) {
+      previousRemainingTimeRef.current = remainingTime - (Date.now() - startTimeRef.current);
+      setRemainingTime(NaN);
+    } else if (!pauseTimers && isNaN(remainingTime) && !isNaN(previousRemainingTimeRef.current)) {
+      setRemainingTime(previousRemainingTimeRef.current);
+    }
+  }, [pauseTimers, remainingTime]);
+  useEffect(() => {
+    let timeout;
+    if (!isNaN(remainingTime)) {
+      startTimeRef.current = Date.now();
+      timeout = setTimeout(() => {
+        removeToast(id);
+      }, remainingTime);
+    }
+    return () => {
+      clearTimeout(timeout);
+    };
+  }, [id, pauseTimers, remainingTime, removeToast]);
+  const close = useCallback(() => {
+    removeToast(toast.id);
+  }, [removeToast, toast.id]);
+  return toast.content({
+    close
+  });
+};
+
+export { Toast };

package/dist/esm/elements/toaster/ToastContext.js

@@ -0,0 +1,11 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import { createContext } from 'react';
+
+const ToastContext = createContext(undefined);
+
+export { ToastContext };

package/dist/esm/elements/toaster/ToastProvider.js

@@ -0,0 +1,51 @@
+/**
+* Copyright Zendesk, Inc.
+*
+* Use of this source code is governed under the Apache License, Version 2.0
+* found at http://www.apache.org/licenses/LICENSE-2.0.
+*/
+import React__default, { useReducer, useMemo, useCallback } from 'react';
+import PropTypes from 'prop-types';
+import { toasterReducer, getInitialState } from './reducer.js';
+import { ToastContext } from './ToastContext.js';
+import { ToastSlot } from './ToastSlot.js';
+
+const ToastProvider = _ref => {
+  let {
+    limit,
+    zIndex,
+    placementProps = {},
+    children
+  } = _ref;
+  const [state, dispatch] = useReducer(toasterReducer, getInitialState());
+  const contextValue = useMemo(() => ({
+    state,
+    dispatch
+  }), [state, dispatch]);
+  const toastsByPlacement = useCallback(placement => {
+    let matchingToasts = state.toasts.filter(toast => toast.options.placement === placement);
+    if (placement === 'bottom' || placement === 'bottom-start' || placement === 'bottom-end') {
+      matchingToasts = matchingToasts.reverse();
+    }
+    return React__default.createElement(ToastSlot, Object.assign({
+      placement: placement,
+      toasts: matchingToasts,
+      zIndex: zIndex,
+      limit: limit
+    }, placementProps[placement]));
+  }, [limit, state.toasts, zIndex, placementProps]);
+  return React__default.createElement(ToastContext.Provider, {
+    value: contextValue
+  }, toastsByPlacement('top-start'), toastsByPlacement('top'), toastsByPlacement('top-end'), children, toastsByPlacement('bottom-start'), toastsByPlacement('bottom'), toastsByPlacement('bottom-end'));
+};
+ToastProvider.displayName = 'ToastProvider';
+ToastProvider.defaultProps = {
+  limit: 4
+};
+ToastProvider.propTypes = {
+  limit: PropTypes.number,
+  zIndex: PropTypes.number,
+  placementProps: PropTypes.object
+};
+
+export { ToastProvider };