import React from "react";

import Typography, { ETypo, ETypoColor } from "../../Typography";
import classes from "./classes.module.scss";

type IProps = {
	title: string;
	description?: string;
	icon?: React.ReactNode;
};

export default function ToastContent(props: IProps) {
	const { icon, title, description } = props;

	return (
		<div className={classes["root"]}>
			{icon}
			<div className={classes["content"]}>
				<Typography typo={ETypo.TEXT_MD_SEMIBOLD} color={ETypoColor.TOASTER_CONTRAST_TITLE}>
					{title}
				</Typography>
				<Typography typo={ETypo.TEXT_MD_REGULAR} color={ETypoColor.TOASTER_CONTRAST_TEXT}>
					{description}
				</Typography>
			</div>
		</div>
	);
}