import React from "react";
import cn from "classnames";
import Badge from "../badge/badge";

export interface ICloudBeesNavigationBadgeProps {
  ["data-testid"]?: string;
  className?: string;
  children: React.ReactNode | React.ReactNode[];
}

const CloudBeesNavigationBadge = ({
  className,
  children,
  ...props
}: ICloudBeesNavigationBadgeProps) => {
  const testId = props["data-testid"] || "honeyui-cloudbees-navigation-badge";

  return (
    <Badge
      {...props}
      pill={true}
      className={cn("px-1", className)}
      variant="dark"
      data-testid={testId}
    >
      {children}
    </Badge>
  );
};

CloudBeesNavigationBadge.displayName = "Cloudbees Navigation Badge";

export default CloudBeesNavigationBadge;