2020-10-16 13:16:01 +00:00
|
|
|
import React from "react";
|
2021-02-10 15:05:02 +00:00
|
|
|
import { cssTransition } from "react-toastify";
|
|
|
|
|
2020-10-16 13:16:01 +00:00
|
|
|
import PropTypes from "prop-types";
|
2021-02-10 15:05:02 +00:00
|
|
|
import StyledToastContainer from "./styled-toast";
|
2019-07-17 11:20:02 +00:00
|
|
|
|
2020-09-29 05:14:29 +00:00
|
|
|
const Slide = cssTransition({
|
2020-10-16 13:16:01 +00:00
|
|
|
enter: "SlideIn",
|
|
|
|
exit: "SlideOut",
|
2019-07-17 11:20:02 +00:00
|
|
|
});
|
|
|
|
|
2020-10-16 13:16:01 +00:00
|
|
|
const Toast = (props) => {
|
2020-12-09 12:34:10 +00:00
|
|
|
const onToastClick = () => {
|
2020-12-08 10:15:22 +00:00
|
|
|
let documentElement = document.getElementsByClassName("Toastify__toast");
|
|
|
|
if (documentElement.length > 1)
|
|
|
|
for (var i = 0; i < documentElement.length; i++) {
|
|
|
|
documentElement &&
|
|
|
|
documentElement[i].style.setProperty("position", "static");
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
2019-07-17 11:20:02 +00:00
|
|
|
return (
|
|
|
|
<StyledToastContainer
|
2022-01-24 14:32:05 +00:00
|
|
|
theme={props.theme}
|
2019-12-17 11:08:11 +00:00
|
|
|
className={props.className}
|
2020-09-29 05:14:29 +00:00
|
|
|
draggable={true}
|
|
|
|
position="top-right"
|
2019-07-17 11:20:02 +00:00
|
|
|
hideProgressBar={true}
|
2019-12-17 11:08:11 +00:00
|
|
|
id={props.id}
|
2019-07-17 11:20:02 +00:00
|
|
|
newestOnTop={true}
|
|
|
|
pauseOnFocusLoss={false}
|
2019-12-03 13:42:14 +00:00
|
|
|
style={props.style}
|
2020-09-29 05:14:29 +00:00
|
|
|
transition={Slide}
|
2020-12-09 12:34:10 +00:00
|
|
|
onClick={onToastClick}
|
2019-07-17 11:20:02 +00:00
|
|
|
/>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
Toast.propTypes = {
|
|
|
|
autoClosed: PropTypes.bool,
|
2021-03-11 16:03:17 +00:00
|
|
|
/** Accepts class */
|
2019-12-03 13:42:14 +00:00
|
|
|
className: PropTypes.string,
|
2021-03-11 16:03:17 +00:00
|
|
|
/** Accepts id */
|
2019-12-03 13:42:14 +00:00
|
|
|
id: PropTypes.string,
|
2021-03-11 16:03:17 +00:00
|
|
|
/** Accepts css style */
|
2019-12-17 11:08:11 +00:00
|
|
|
style: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
|
|
|
|
text: PropTypes.string,
|
2021-03-11 16:03:17 +00:00
|
|
|
/** Title inside a toast */
|
2019-12-17 11:08:11 +00:00
|
|
|
title: PropTypes.string,
|
2021-03-11 16:03:17 +00:00
|
|
|
/** Define color and icon of toast */
|
2020-10-16 13:16:01 +00:00
|
|
|
type: PropTypes.oneOf(["success", "error", "warning", "info"]).isRequired,
|
2019-07-17 11:20:02 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
Toast.defaultProps = {
|
2019-12-17 11:08:11 +00:00
|
|
|
autoClosed: true,
|
2020-10-16 13:16:01 +00:00
|
|
|
text: "Demo text for example",
|
|
|
|
title: "Demo title",
|
|
|
|
type: "success",
|
|
|
|
};
|
2019-07-17 11:20:02 +00:00
|
|
|
|
|
|
|
export default Toast;
|