"use client";
// Adapted from Magic UI (MIT). See THIRD_PARTY_NOTICES.md.
import { type ComponentProps, type CSSProperties } from "react";
export interface MeteorsProps extends Omit<ComponentProps<"div">, "children"> {
  count?: number;
}
export function Meteors({ count = 8, className = "", ...props }: MeteorsProps) {
  const total = Number.isFinite(count)
    ? Math.min(30, Math.max(0, Math.floor(count)))
    : 8;
  return (
    <div {...props} aria-hidden="true" className={`ynr-meteors ${className}`}>
      {Array.from({ length: total }, (_, i) => (
        <span
          key={i}
          style={
            {
              left: `${(i * 37 + 13) % 100}%`,
              "--meteors-delay": `${i * 0.13}s`,
            } as CSSProperties
          }
        />
      ))}
    </div>
  );
}