import NavigationMenuItem from "./NavigationMenuItem"
import { navigationMenuVariants } from "./variants"

import styles from "./navigationMenu.module.css"

import { NavigationMenuProps } from "@/types/components/header/navigationMenu"

export default function NavigationMenu({
  items,
  variant,
}: NavigationMenuProps) {
  return (
    <ul className={navigationMenuVariants({ variant })}>
      {items.map((item) => (
        <li key={item.id} className={styles.item}>
          <NavigationMenuItem variant={variant} item={item} />
        </li>
      ))}
    </ul>
  )
}