mirror of
https://github.com/hanzoai/shadcn.git
synced 2026-11-02 13:07:46 +00:00
zeekay
3163b7ed2a
- Fixed PascalCase naming for 4 navigation bar components - StatusDashboardNavigationBar (was statusdashuoardNavigationBar) - TeamSwitcherNavigationBar (was teamswitcherNavigationBar) - TwoTierNavigationBar (was twotierNavigationBar) - UnderlineNavigationBar (was underlineNavigationBar) - Applied fixes to both default and new-york variants
39 lines
909 B
TypeScript
39 lines
909 B
TypeScript
"use client"
|
|
|
|
import * as React from "react"
|
|
|
|
import { cn } from "@/lib/utils"
|
|
|
|
export interface TwoTierNavigationBarProps
|
|
extends React.HTMLAttributes<HTMLElement> {
|
|
items?: Array<{ label: string; href: string }>
|
|
}
|
|
|
|
const TwoTierNavigationBar = React.forwardRef<
|
|
HTMLElement,
|
|
TwoTierNavigationBarProps
|
|
>(({ className, items = [], ...props }, ref) => {
|
|
return (
|
|
<nav
|
|
ref={ref}
|
|
className={cn("border-b bg-background", className)}
|
|
{...props}
|
|
>
|
|
<div className="container flex h-16 items-center gap-6">
|
|
{items.map((item) => (
|
|
<a
|
|
key={item.href}
|
|
href={item.href}
|
|
className="text-sm font-medium transition-colors hover:text-primary"
|
|
>
|
|
{item.label}
|
|
</a>
|
|
))}
|
|
</div>
|
|
</nav>
|
|
)
|
|
})
|
|
TwoTierNavigationBar.displayName = "TwoTierNavigationBar"
|
|
|
|
export { TwoTierNavigationBar }
|