From be0f537dc4fe384eef09436833c6407e6482c16d Mon Sep 17 00:00:00 2001
From: Rafi Zadanly <zadanlyr@gmail.com>
Date: Thu, 9 Nov 2023 15:40:16 +0700
Subject: Initial commit

---
 src/common/libs/toast.tsx | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)
 create mode 100644 src/common/libs/toast.tsx

(limited to 'src/common/libs/toast.tsx')

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
-- 
cgit v1.2.3

