Initial commit

frontend/src/components/shared/Badge.tsx

@@ -0,0 +1,25 @@
+// Badge Component
+import { ReactNode } from 'react';
+import { clsx } from 'clsx';
+import './Badge.css';
+
+interface BadgeProps {
+  children: ReactNode;
+  variant?: 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'secondary';
+  size?: 'small' | 'medium' | 'large';
+  className?: string;
+}
+
+export default function Badge({
+  children,
+  variant = 'secondary',
+  size = 'medium',
+  className,
+}: BadgeProps) {
+  return (
+    <span className={clsx('badge', `badge--${variant}`, `badge--${size}`, className)}>
+      {children}
+    </span>
+  );
+}
+