import * as React from 'react';

import { cn } from '@/lib/utils';

interface SrAnnouncerProps extends React.HTMLAttributes<HTMLDivElement> {
  /**
   * The message to announce. If empty, the announcer will be hidden.
   */
  message?: string;
  /**
   * Whether announcements should be assertive (true) or polite (false, default).
   */
  assertive?: boolean;
}

/**
 * Screen reader announcer component for accessibility.
 * Provides real-time feedback to screen reader users.
 *
 * @example
 * const [message, setMessage] = React.useState('');
 * return (
 *   <>
 *     <SrAnnouncer message={message} />
 *     <button onClick={() => setMessage('Item loaded')}>Load</button>
 *   </>
 * );
 */
const SrAnnouncer = React.forwardRef<HTMLDivElement, SrAnnouncerProps>(
  ({ message, assertive = false, className, ...props }, ref) => (
    <div
      ref={ref}
      role="status"
      aria-live={assertive ? 'assertive' : 'polite'}
      aria-atomic="true"
      className={cn('sr-only', className)}
      {...props}
    >
      {message}
    </div>
  ),
);
SrAnnouncer.displayName = 'SrAnnouncer';

export { SrAnnouncer };