Install the shadcn-vue NavigationMenu component family at
src/components/ui/navigation-menu (NavigationMenu / NavigationMenuList
/ NavigationMenuItem / NavigationMenuTrigger / NavigationMenuContent /
NavigationMenuLink / NavigationMenuIndicator / NavigationMenuViewport
+ navigationMenuTriggerStyle cva). Files came in via the registry JSON
(www.shadcn-vue.com/r/styles/default/navigation-menu.json) because the
CLI's corepack pnpm shim conflicts with our nix-managed pnpm — handle
that more cleanly later.
Adds @vueuse/core as a runtime dependency (reactiveOmit /
useForwardProps inside the navigation-menu primitives).
Two upstream fixes applied:
1. NavigationMenuTrigger imports ChevronDown from "@lucide/vue", not
the deprecated "lucide-vue-next" the registry ships by default.
2. NavigationMenuViewport's height/width CSS variable references use
Tailwind v3 syntax — h-[--reka-navigation-menu-viewport-height] —
which renders as a literal string under Tailwind v4, collapsing
the viewport to 2px. Wrap them in var() so v4 resolves them
correctly: h-[var(--reka-navigation-menu-viewport-height)].
SiteHeader desktop nav: drop the custom openGroup ref, the
document-level click/keydown listeners and the v-show toggle in
favour of NavigationMenuTrigger + NavigationMenuContent for the four
group dropdowns (Concept / What's On / Collaborate / Reservations),
plus a flat Marketplace link styled with navigationMenuTriggerStyle.
Hover/focus/open states all use bg-muted + text-primary to preserve
the green-bg/gold-text feel from the hand-rolled nav.
Mobile menu stays hand-rolled for this commit; Sheet refactor lands
in a follow-up.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>