"use client";
// Adapted from Magic UI (MIT). See THIRD_PARTY_NOTICES.md.
import { Children, type ComponentProps, type CSSProperties } from "react";
export interface OrbitingCirclesProps extends ComponentProps<"div"> {
  reverse?: boolean;
  paused?: boolean;
}
/** Decorative content only: put an accessible description on the surrounding figure. */
export function OrbitingCircles({
  children,
  className = "",
  reverse = false,
  paused = false,
  ...props
}: OrbitingCirclesProps) {
  const count = Children.count(children);
  return (
    <div
      {...props}
      aria-hidden="true"
      inert
      className={`ynr-orbiting-circles ${className}`}
      data-reverse={reverse}
      data-paused={paused}
    >
      <div className="ynr-orbiting-circles-path" />
      {Children.map(children, (child, i) => (
        <div
          className="ynr-orbiting-circles-orbit"
          style={
            {
              "--orbiting-circles-angle": `${(i * 360) / count}deg`,
            } as CSSProperties
          }
        >
          <div className="ynr-orbiting-circles-item">{child}</div>
        </div>
      ))}
    </div>
  );
}