MainNavigation

Wrapper component that renders both DesktopNavigation and MobileNavigation with CSLP support.

Props

Prop	Type	Required	Default	Description
`headerData`	`HeaderData & { mainNavigationCslp?: Navigation }`	Yes	-	Header configuration data with navigation CSLP
`utilityNavData`	`UtilityNavItem[]`	No	-	Utility navigation links
`showSearch`	`boolean`	No	`true`	Whether to show search bar
`cslp`	`CSLPFieldMapping`	No	-	CSLP mapping for main_navigation field

Usage

1import { MainNavigation } from '@/components/organisms/MainNavigation';
2
3<MainNavigation 
4  headerData={headerData}
5  utilityNavData={utilityLinks}
6  showSearch={true}
7  cslp={cslp?.main_navigation}
8/>

import { MainNavigation } from '@/components/organisms/MainNavigation';

<MainNavigation 
  headerData={headerData}
  utilityNavData={utilityLinks}
  showSearch={true}
  cslp={cslp?.main_navigation}
/>

Features

Responsive: Renders appropriate navigation for screen size
Desktop: Shows DesktopNavigation on large screens
Mobile: Shows MobileNavigation on small/medium screens
CSLP support: Wraps navigation with CSLP attributes for Live Preview
Unified API: Single component for both navigation types

CSLP

Navigation wrapper receives CSLP from cslp prop
Individual links receive CSLP via linksCslp prop
CSLP attributes only applied in preview mode

Notes

Wraps DesktopNavigation and MobileNavigation
Both components receive the same headerData
Utility nav data only used by MobileNavigation
Navigation CSLP extracted from headerData.mainNavigationCslp?.$