import React from 'react';
import { EmojiConfettiBurst } from './types';
import { EmojiConfettiBurstCanvas } from './EmojiConfettiBurstCanvas';

type EmojiConfettiOverlayProps = {
  bursts: EmojiConfettiBurst[];
  onBurstComplete: (burstId: string) => void;
};

export function EmojiConfettiOverlay({ bursts, onBurstComplete }: EmojiConfettiOverlayProps) {
  if (bursts.length === 0) return null;

  return (
    <>
      {bursts.map((burst) => (
        <EmojiConfettiBurstCanvas
          key={burst.id}
          burst={burst}
          onComplete={onBurstComplete}
        />
      ))}
    </>
  );
}