From 60d0d77dffe15eab9b4e65276952893879f9cdbf Mon Sep 17 00:00:00 2001
From: ValdiANS <rvdans002@gmail.com>
Date: Fri, 3 Oct 2025 22:13:35 +0700
Subject: [PATCH] feat(FE-40): add Alert component

---
 src/components/Alert.tsx | 27 +++++++++++++++++++++++++++
 1 file changed, 27 insertions(+)
 create mode 100644 src/components/Alert.tsx

diff --git a/src/components/Alert.tsx b/src/components/Alert.tsx
new file mode 100644
index 00000000..61792d0c
--- /dev/null
+++ b/src/components/Alert.tsx
@@ -0,0 +1,27 @@
+import { ReactNode } from 'react';
+
+import { cn } from '@/lib/helper';
+
+interface AlertProps {
+  variant?: 'outline' | 'dash' | 'soft';
+  color?: 'info' | 'success' | 'warning' | 'error';
+  children?: ReactNode;
+  className?: string;
+}
+
+const Alert = ({ children, variant, color, className }: AlertProps) => {
+  const alertBaseClassName = cn('alert', {
+    'alert-soft': variant === 'soft',
+    'alert-outline': variant === 'outline',
+    'alert-dash': variant === 'dash',
+
+    'alert-info': color === 'info',
+    'alert-success': color === 'success',
+    'alert-warning': color === 'warning',
+    'alert-error': color === 'error',
+  });
+
+  return <div className={cn(alertBaseClassName, className)}>{children}</div>;
+};
+
+export default Alert;