import styles from '../../pages/HomePage.module.css'

type DanceFloorProps = {
  cols: number
  rows: number
}

export function DanceFloor({ cols, rows }: DanceFloorProps) {
  const floorTileCount = cols * rows

  return (
    <div className={styles.floor} aria-hidden>
      <div className={styles.floorInner}>
        <div className={styles.floorGlow} />
        <div
          className={styles.floorTiles}
          style={{
            gridTemplateColumns: `repeat(${cols}, 1fr)`,
            gridTemplateRows: `repeat(${rows}, 1fr)`,
          }}
        >
          {Array.from({ length: floorTileCount }, (_, i) => (
            <div
              key={i}
              className={styles.floorTile}
              style={{ animationDelay: `${(i % 7) * 0.12}s` }}
            />
          ))}
        </div>
      </div>
    </div>
  )
}
