"use client"; import * as React from "react"; import Link from "next/link"; import { CircleCheckIcon, CircleHelpIcon, CircleIcon } from "lucide-react"; import { NavigationMenu, NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, navigationMenuTriggerStyle } from "@/components/ui/navigation-menu"; const components: { title: string; href: string; description: string }[] = [ { title: "Alert Dialog", href: "/docs/primitives/alert-dialog", description: "A modal dialog that interrupts the user with important content and expects a response." }, { title: "Hover Card", href: "/docs/primitives/hover-card", description: "For sighted users to preview content available behind a link." }, { title: "Progress", href: "/docs/primitives/progress", description: "Displays an indicator showing the completion progress of a task, typically displayed as a progress bar." }, { title: "Scroll-area", href: "/docs/primitives/scroll-area", description: "Visually or semantically separates content." }, { title: "Tabs", href: "/docs/primitives/tabs", description: "A set of layered sections of content—known as tab panels—that are displayed one at a time." }, { title: "Tooltip", href: "/docs/primitives/tooltip", description: "A popup that displays information related to an element when the element receives keyboard focus or the mouse hovers over it." } ]; export default function NavigationMenuDemo() { return ( Home

shadcn/ui

Beautifully designed components built with Tailwind CSS.

Re-usable components built using Radix UI and Tailwind CSS.

How to install dependencies and structure your app.

Styles for headings, paragraphs, lists...etc

Components

{component.description}

Docs List

Components

Browse all components in the library.

Documentation

Learn how to use the library.

Blog

Read our latest blog posts.

Simple

Components Documentation Blocks

With Icon

Backlog To Do Done

); } function ListItem({ title, children, href, ...props }: React.ComponentPropsWithoutRef<"li"> & { href: string }) { return (

{title}

{children}

); }