Mega menu
A grouped site menu that opens a full-width panel with pointer, keyboard, and touch parity.
Implementation
1"use client";2 3import {4 useEffect,5 useId,6 useRef,7 useState,8 type HTMLAttributes,9 type CSSProperties,10 type KeyboardEvent,11 type ReactNode,12} from "react";13import { ChevronDown } from "lucide-react";14 15export type MegaMenuLink = {16 label: string;17 href: string;18 description?: string;19 meta?: string;20};21 22export type MegaMenuGroup = {23 id: string;24 title: string;25 links: MegaMenuLink[];26};27 28export type MegaMenuProps = Omit<