// Adapted from Astryx StatusDot (MIT). See THIRD_PARTY_NOTICES.md.
import type { ComponentProps, ReactNode } from "react";

export type StatusDotVariant =
  "success" | "warning" | "error" | "accent" | "neutral";

export interface StatusDotProps extends ComponentProps<"span"> {
  variant: StatusDotVariant;
  label: string;
  isPulsing?: boolean;
  icon?: ReactNode;
}

export function StatusDot({
  variant,
  label,
  isPulsing = false,
  icon,
  className = "",
  ...props
}: StatusDotProps) {
  return (
    <span
      {...props}
      role="img"
      aria-label={label}
      data-variant={variant}
      data-pulsing={isPulsing || undefined}
      className={`ynr-status-dot${className ? ` ${className}` : ""}`}
    >
      {icon != null && (
        <span className="ynr-status-dot-icon" aria-hidden="true">
          {icon}
        </span>
      )}
    </span>
  );
}