MCPX MCP Gateway

import React from "react"; interface CustomBadgeProps { label: React.ReactNode; color?: "blue" | "green" | "purple" | "gray" | "red"; size?: "xs" | "sm" | "md"; rounded?: "lg" | "full"; icon?: React.ReactNode; className?: string; } const sizeToClasses: Record<NonNullable<CustomBadgeProps["size"]>, string> = { xs: "text-[9px] py-0.5 font-semibold", sm: "text-xs py-1 font-semibold", md: "text-md py-2 font-semibold", }; const CustomBadge: React.FC<CustomBadgeProps> = ({ label, size = "xs", rounded = "lg", icon, }) => { return ( <div className={`inline-flex items-center gap-1 text-[#4F33CC] ${sizeToClasses[size]} rounded-${rounded} `} style={{ width: "fit-content" }} > {icon} {label} </div> ); }; export default CustomBadge;