Marquee

import { Marquee } from '@otfdashkit/ui'

const LOGOS = ['Acme', 'Globex', 'Initech', 'Umbrella', 'Hooli', 'Wonka', 'Stark Industries', 'Cyberdyne']

const LogoChip = ({ name }: { name: string }) => (
  <div className="flex h-12 min-w-[140px] items-center justify-center rounded-md border border-border bg-card px-6 font-mono text-sm uppercase tracking-widest text-muted-foreground">
    {name}
  </div>
)

export function Example() {
  return (
    <Marquee>
      {LOGOS.map((n) => (
        <LogoChip key={n} name={n} />
      ))}
    </Marquee>
  )
}