"use client";
import React from "react";
import { cn } from "@/lib/utils";
import FastMarquee from "react-fast-marquee";
import type { MarqueeProps as FastMarqueeProps } from "react-fast-marquee";

export interface MarqueeProps extends FastMarqueeProps {
  className?: string;
  direction?: "left" | "right";
  monochrome?: boolean;
}

export function LogoMarquee({
  children,
  className,
  autoFill = true,
  monochrome,
  ...props
}: MarqueeProps) {
  return (
    <div className={cn("grid", className)}>
      <FastMarquee
        {...props}
        gradient
        autoFill={autoFill}
        gradientWidth={40}
        gradientColor="hsl(var(--background))"
        className={cn("[&_svg]:w-[140px]", {
          "[&_path]:fill-muted-foreground": monochrome,
        })}
      >
        {children}
      </FastMarquee>
    </div>
  );
}
Marquees
