/**
 * BoostMedia AI Content Generator Admin - PingDot Component
 *
 * Pulsing indicator dot for onboarding attention cues.
 *
 * @package BoostMedia_AI
 * @license GPL-2.0-or-later
 */

interface PingDotProps {
  visible: boolean
  size?: 'sm' | 'md'
  className?: string
}

export function PingDot({ visible, size = 'sm', className = '' }: PingDotProps) {
  if (!visible) return null

  const sizeClasses = size === 'sm'
    ? 'w-2 h-2'
    : 'w-2.5 h-2.5'

  return (
    <span className={`relative inline-flex ${className}`}>
      <span className={`absolute inline-flex ${sizeClasses} rounded-full bg-bc-primary opacity-75 animate-pulse`} />
      <span className={`relative inline-flex ${sizeClasses} rounded-full bg-bc-primary`} />
    </span>
  )
}