import { useMemo } from "react"; import { buildLocalizedHref, getDirection, LanguageToggle, type Locale, } from "../LanguageSwitcher"; import { Brand } from "./Brand"; import { DesktopNav } from "./DesktopNav"; import { MobileNav } from "./MobileNav"; import { getDefaultNavItems, getNavigationStrings } from "./nav-items"; import { cx } from "./styles"; import type { NavItem, NavigationStrings, NavSurface } from "./types"; export interface NavigationProps { /** Reading locale. Drives the copy, the default hrefs and the arrow keys. */ locale?: Locale; /** Current pathname, e.g. "/ar/contact". Used for aria-current="page". */ pathname: string; /** Query string, carried across a language switch. */ search?: string; /** Fragment, carried across a language switch. */ hash?: string; /** * The navigation tree. The app shell feeds this from the Strapi * site-settings single type; omitting it renders the typed default IA. */ items?: readonly NavItem[]; /** Which tier-2 surface the bar paints. `:root` is dark, so dark is default. */ surface?: NavSurface; /** Override any of the navigation's own strings (e.g. from the CMS). */ strings?: Partial; /** Where the logo links. Defaults to the locale home, "/en" or "/ar". */ homeHref?: string; showLanguageSwitcher?: boolean; /** Stick the bar to the top of the viewport. */ sticky?: boolean; className?: string; } /** * The SHARP-ER site navigation - Figma frame 20:236. * * Three slots, spread across the bar: the wordmark at the inline start, the * mega-menu groups in the middle, and the language globe at the inline end. * Everything is laid out with logical properties, so the Arabic bar mirrors * (logo right, globe left) from `` alone - there is no separate * Arabic component, which is what variants 334:526 and 334:764 show. * * Below the xl breakpoint the bar collapses to wordmark + hamburger (20:220) * and the whole tree moves into a full-screen drawer. * * EU VISIBILITY: the updated design has no funding badge in the bar - the * Actions slot holds the language globe alone. The mandatory "Funded by the * European Union" lockup is carried by