UNPKG

@coinmeca/ui

Version:

This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).

25 lines 1.2 kB
"use client"; import { Layouts } from "../../../components"; import Notify from "../notification/Notify"; import Style from "./Toast.styled"; export default function Toast({ list, active, width, align, style, swipe }) { width = width || 60; align = align === "left" || align === "right" ? align : "left"; return (active && list && list?.length > 0 && (<Style $width={width} $align={align} style={style} data-active={typeof list !== "undefined" ? true : false}> <Layouts.Contents.InnerContent style={{ flexDirection: "column-reverse" }}> {/* <AnimatePresence key={"notification"} mode="popLayout"> */} {list?.map((v, k) => (<Notify key={v?.id || k} direction={align} // as={motion.div} // initial={{ y: "15%", opacity: 0 }} // animate={{ y: "0", opacity: 1 }} // exit={{ x: "15%", opacity: 0 }} // transition={{ ease: "easeInOut", duration: 0.3 }} // layout {...{ ...v, swipe, type: "toast" }}/>))} {/* </AnimatePresence> */} </Layouts.Contents.InnerContent> </Style>)); } //# sourceMappingURL=Toast.jsx.map