fd57a35820
Release package / release (push) Successful in 1h12m42s
Co-authored-by: Thanh Quy - wolf <524H0124@student.tdtu.edu.vn> Reviewed-on: #28 Reviewed-by: TakahashiNguyen <takahashi.ng@icloud.com> Co-authored-by: TaNguyenThanhQuy <tanguyenthanhquy@noreply.localhost> Co-committed-by: TaNguyenThanhQuy <tanguyenthanhquy@noreply.localhost>
32 lines
756 B
TypeScript
32 lines
756 B
TypeScript
import type { BadgeProps } from "./Badge.types";
|
|
|
|
export default function Badge({
|
|
variant = "primary",
|
|
size = "md",
|
|
children,
|
|
className = "",
|
|
...props
|
|
}: BadgeProps) {
|
|
const variants = {
|
|
primary: "bg-(--color-primary) text-white",
|
|
secondary: "bg-(--color-border-light) text-(--color-text-secondary)",
|
|
success: "bg-green-100 text-green-700",
|
|
danger: "bg-red-100 text-red-700",
|
|
warning: "bg-yellow-100 text-yellow-700",
|
|
};
|
|
|
|
const sizes = {
|
|
sm: "px-2 py-1 text-xs",
|
|
md: "px-3 py-1.5 text-sm",
|
|
};
|
|
|
|
return (
|
|
<span
|
|
className={`inline-flex items-center justify-center rounded-full font-semibold ${variants[variant]} ${sizes[size]} ${className}`}
|
|
{...props}
|
|
>
|
|
{children}
|
|
</span>
|
|
);
|
|
}
|