BlocksNav() — ui Function Reference

Architecture documentation for the BlocksNav() function in blocks-nav.tsx from the ui codebase.

Function tsx ComponentRegistry UIPrimitives

Entity Profile

ComponentRegistry→ UIPrimitives→ BlocksNav() — ui Function Reference

Dependency Diagram

graph TD
  19d75f01_a385_6f94_d1e9_022feb03858a["BlocksNav()"]
  768b46f7_e79c_41ca_561a_e511d2500870["blocks-nav.tsx"]
  19d75f01_a385_6f94_d1e9_022feb03858a -->|defined in| 768b46f7_e79c_41ca_561a_e511d2500870
  style 19d75f01_a385_6f94_d1e9_022feb03858a fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

deprecated/www/components/blocks-nav.tsx lines 9–32

export function BlocksNav() {
  const pathname = usePathname()

  return (
    <div className="relative overflow-hidden">
      <ScrollArea className="max-w-none">
        <div className="flex items-center">
          <BlocksNavLink
            category={{ name: "Featured", slug: "", hidden: false }}
            isActive={pathname === "/blocks"}
          />
          {registryCategories.map((category) => (
            <BlocksNavLink
              key={category.slug}
              category={category}
              isActive={pathname === `/blocks/${category.slug}`}
            />
          ))}
        </div>
        <ScrollBar orientation="horizontal" className="invisible" />
      </ScrollArea>
    </div>
  )
}