background-confetti.tsx

'use client'

import { useState, useEffect } from 'react'
import { useInView } from 'react-intersection-observer'

const colors = [
  'bg-pink-400',
  'bg-yellow-400',
  'bg-purple-400',
  'bg-teal-400',
  'bg-orange-400',
  'bg-rose-400',
  'bg-sky-400',
  'bg-lime-400',
  'bg-fuchsia-400',
  'bg-amber-400',
]

const shapes = [
  { width: 'w-2', height: 'h-1', rounded: 'rounded-none' }, // Horizontal ribbon