diff options
| author | Rafi Zadanly <zadanlyr@gmail.com> | 2023-11-09 15:40:16 +0700 |
|---|---|---|
| committer | Rafi Zadanly <zadanlyr@gmail.com> | 2023-11-09 15:40:16 +0700 |
| commit | be0f537dc4fe384eef09436833c6407e6482c16d (patch) | |
| tree | 194b1ad3f34396cb8149075bbbd38b854aedf361 /src/common/libs/toast.tsx | |
| parent | 5d5401ae36e7e0c8eb38ccd943c1aa44a9573d35 (diff) | |
Initial commit
Diffstat (limited to 'src/common/libs/toast.tsx')
| -rw-r--r-- | src/common/libs/toast.tsx | 23 |
1 files changed, 23 insertions, 0 deletions
diff --git a/src/common/libs/toast.tsx b/src/common/libs/toast.tsx new file mode 100644 index 0000000..2047a27 --- /dev/null +++ b/src/common/libs/toast.tsx @@ -0,0 +1,23 @@ +import ReactHotToast, { Toast } from "react-hot-toast" +import clsxm from "./clsxm" +import { ReactNode } from "react" +import { XIcon } from "lucide-react" + +type Options = Partial<Pick<Toast, "style" | "className" | "id" | "icon" | "duration" | "ariaProps" | "position" | "iconTheme">> | undefined + +const toast = (children: ReactNode, options: Options = undefined) => { + return ReactHotToast.custom((t) => ( + <div className={clsxm("bg-neutral-100 border border-neutral-200 text-neutral-800 text-sm rounded-lg flex", { + "animate-appearance-in": t.visible, + "animate-appearance-out": !t.visible + })}> + <span className="py-2 px-3">{children}</span> + <div className="w-[1px] h-full bg-neutral-300" /> + <button type="button" className="px-2 text-neutral-800" onClick={() => ReactHotToast.dismiss(t.id)}> + <XIcon size={18} /> + </button> + </div> + ), options) +} + +export default toast
\ No newline at end of file |
