mirror of
https://github.com/hanzoai/shadcn.git
synced 2026-10-30 18:22:59 +00:00
zeekay
a5f7b07b67
- Add new blocks explorer page with lazy-loading previews - Intersection Observer for viewport-based loading - Error states with retry functionality - Skeleton loading UI - Hover reveals block metadata - Enhance builder page with drag-and-drop UI - Categorized blocks and components palette - Page preview with viewport switching - Block selection and reordering - Container nesting support - Add Builder link to main navigation - Add refresh button to block viewer toolbar - Fix icon sizing in toggle buttons (!h-3.5 !w-3.5) - Add blocks index to tsup build config - Bump @hanzo/ui version to 5.3.3
122 lines
3.2 KiB
TypeScript
122 lines
3.2 KiB
TypeScript
"use client"
|
|
|
|
import Link from "next/link"
|
|
import { usePathname } from "next/navigation"
|
|
|
|
import { siteConfig } from "@/config/site"
|
|
import { cn } from "@/lib/utils"
|
|
import { Icons } from "@/components/icons"
|
|
|
|
export function MainNav() {
|
|
const pathname = usePathname()
|
|
|
|
return (
|
|
<div className="mr-4 hidden md:flex">
|
|
<Link href="/" className="mr-4 flex items-center gap-2 lg:mr-6">
|
|
<Icons.logo className="h-6 w-6" />
|
|
</Link>
|
|
<nav className="flex items-center gap-4 text-sm xl:gap-6">
|
|
<Link
|
|
href="/docs/installation"
|
|
className={cn(
|
|
"transition-colors hover:text-foreground/80",
|
|
pathname === "/docs/installation"
|
|
? "text-foreground"
|
|
: "text-foreground/80"
|
|
)}
|
|
>
|
|
Docs
|
|
</Link>
|
|
<Link
|
|
href="/docs/components"
|
|
className={cn(
|
|
"transition-colors hover:text-foreground/80",
|
|
pathname?.startsWith("/docs/components") &&
|
|
!pathname?.startsWith("/docs/component/chart")
|
|
? "text-foreground"
|
|
: "text-foreground/80"
|
|
)}
|
|
>
|
|
Components
|
|
</Link>
|
|
<Link
|
|
href="/ai"
|
|
className={cn(
|
|
"transition-colors hover:text-foreground/80",
|
|
pathname === "/ai" || pathname?.startsWith("/docs/ai")
|
|
? "text-foreground"
|
|
: "text-foreground/80"
|
|
)}
|
|
>
|
|
AI
|
|
</Link>
|
|
<Link
|
|
href="/blocks"
|
|
className={cn(
|
|
"transition-colors hover:text-foreground/80",
|
|
pathname?.startsWith("/blocks")
|
|
? "text-foreground"
|
|
: "text-foreground/80"
|
|
)}
|
|
>
|
|
Blocks
|
|
</Link>
|
|
<Link
|
|
href="/builder"
|
|
className={cn(
|
|
"transition-colors hover:text-foreground/80",
|
|
pathname?.startsWith("/builder")
|
|
? "text-foreground"
|
|
: "text-foreground/80"
|
|
)}
|
|
>
|
|
Builder
|
|
</Link>
|
|
<Link
|
|
href="/charts"
|
|
className={cn(
|
|
"transition-colors hover:text-foreground/80",
|
|
pathname?.startsWith("/docs/component/chart") ||
|
|
pathname?.startsWith("/charts")
|
|
? "text-foreground"
|
|
: "text-foreground/80"
|
|
)}
|
|
>
|
|
Charts
|
|
</Link>
|
|
<Link
|
|
href="/themes"
|
|
className={cn(
|
|
"transition-colors hover:text-foreground/80",
|
|
pathname?.startsWith("/themes")
|
|
? "text-foreground"
|
|
: "text-foreground/80"
|
|
)}
|
|
>
|
|
Themes
|
|
</Link>
|
|
<Link
|
|
href="/colors"
|
|
className={cn(
|
|
"transition-colors hover:text-foreground/80",
|
|
pathname?.startsWith("/colors")
|
|
? "text-foreground"
|
|
: "text-foreground/80"
|
|
)}
|
|
>
|
|
Colors
|
|
</Link>
|
|
<Link
|
|
href="/mcp"
|
|
className={cn(
|
|
"transition-colors hover:text-foreground/80",
|
|
pathname === "/mcp" ? "text-foreground" : "text-foreground/80"
|
|
)}
|
|
>
|
|
MCP
|
|
</Link>
|
|
</nav>
|
|
</div>
|
|
)
|
|
}
|