From e5417cf6552acdda0ed483c988c1e80ac442d80d Mon Sep 17 00:00:00 2001
From: Kunerkhan <kakerov@gmail.com>
Date: Tue, 26 Aug 2025 22:43:15 +0600
Subject: [PATCH] feat(AIFEP-20): Add classname and color for badge

---
 src/components/common/Badge/index.tsx | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/common/Badge/index.tsx b/src/components/common/Badge/index.tsx
index b5d1d81..395caae 100644
--- a/src/components/common/Badge/index.tsx
+++ b/src/components/common/Badge/index.tsx
@@ -22,18 +22,19 @@ export enum BadgeColor {
 
 export interface BadgeProps {
   children: ReactNode;
-  color: BadgeColor;
+  color: BadgeColor | string;
   icon?: string;
   filled?: boolean;
+  className?: string;
 }
 
 export const Badge: FC<BadgeProps> = props => {
-  const { children, color, icon, filled } = useCombinedPropsWithKit({
+  const { children, color, icon, filled, className } = useCombinedPropsWithKit({
     name: 'Badge',
     props,
   });
   return (
-    <div className={clsx('badge', `badge--${color}`, { 'badge--filled': filled })}>
+    <div className={clsx('badge', className, `badge--${color}`, { 'badge--filled': filled })}>
       {icon !== undefined && <Icon className="badge__icon" name={icon} size={14} />}
       <p className="badge__text">{children}</p>
     </div>