import * as React from 'react'

import {
  normalizeStatusDotSize,
  type StatusDotSize,
  type StatusDotStatus,
} from '../../display/status-dot'
import { cn } from './utils'

export interface StatusDotProps extends React.HTMLAttributes<HTMLSpanElement> {
  status?: StatusDotStatus
  size?: StatusDotSize
  label?: string
  decorative?: boolean
  pulse?: boolean
}

export function StatusDot({
  className,
  status = 'neutral',
  size = 'sm',
  label,
  decorative = true,
  pulse = false,
  ...props
}: StatusDotProps) {
  const normalizedSize = normalizeStatusDotSize(size)
  const accessibilityProps =
    decorative && label === undefined
      ? { 'aria-hidden': true }
      : { role: 'img', 'aria-label': label ?? status }

  return (
    <span
      data-slot="status-dot"
      className={cn(
        'cmm-status-dot',
        `cmm-status-dot--${status}`,
        `cmm-status-dot--${normalizedSize}`,
        pulse && 'cmm-status-dot--pulse',
        className
      )}
      {...accessibilityProps}
      {...props}
    />
  )
}
