Navigation Menu

"use client"

import { Home, Bell, Settings, User } from "lucide-react"
import { MenuBar } from "@/components/ui/navigation-menu"

export function MenuBarDemo() {
  const menuItems = [
    {
      icon: <Home className="h-5 w-5" />,
      label: "Home",
      href: "#",
      color: "primary",
    },
    {
      icon: <Bell className="h-5 w-5" />,
      label: "Notifications",
      href: "#",
      color: "orange",
    },
    {
      icon: <Settings className="h-5 w-5" />,
      label: "Settings",
      href: "#",
      color: "green",
    },
    {
      icon: <User className="h-5 w-5" />,
      label: "Profile",
      href: "#",
      color: "red",
    },
  ]

  return (
    <div className="p-6 flex justify-center">
      <MenuBar items={menuItems} />
    </div>
  )
}

export default MenuBarDemo