UNPKG

@massds/mayflower-react

Version:

React versions of Mayflower design system UI components

64 lines (63 loc) 3.74 kB
/** * Header module. * @module @massds/mayflower-react/Header * @requires module:@massds/mayflower-assets/scss/01-atoms/decorative-link * @requires module:@massds/mayflower-assets/scss/01-atoms/button-with-icon * @requires module:@massds/mayflower-assets/scss/01-atoms/button-search * @requires module:@massds/mayflower-assets/scss/01-atoms/input-typeahead * @requires module:@massds/mayflower-assets/scss/01-atoms/site-logo * @requires module:@massds/mayflower-assets/scss/02-molecules/main-nav * @requires module:@massds/mayflower-assets/scss/03-organisms/utility-nav * @requires module:@massds/mayflower-assets/scss/03-organisms/utility-panel * @requires module:@massds/mayflower-assets/scss/03-organisms/header * @requires module:@massds/mayflower-assets/scss/03-organisms/header-hamburger * @requires module:@massds/mayflower-assets/scss/02-molecules/main-nav-hamburger * @requires module:@massds/mayflower-assets/scss/03-organisms/header-mixed */ import React from 'react'; export interface HeaderProps { /** An uninstantiated component which handles displaying the site logo. */ Logo?: React.ElementType; /** An uninstantiated component which handles displaying the site logo on mobile. */ MobileLogo?: React.ElementType; /** Override default siteName rendered as the hamburger menu toggle button text and aria-label on mobile */ siteName?: string; /** An uninstantiated component which handles search functionality. */ NavSearch?: React.ElementType; /** An uninstantiated component that displays the site logo and search on desktop. */ Container?: React.ElementType; /** An uninstantiated component which handles search functionality on mobile. */ MobileNavSearch?: React.ElementType; /** An uninstantiated component which handles the display of a skip navigation link. */ SkipNav?: React.ElementType; /** An uninstantiated component which handles displaying the utility navigation at the top of the header. */ UtilityNav?: React.ElementType; /** An uninstantiated component which handles displaying the utility navigation at the top of the header on mobile. */ MobileUtilityNav?: React.ElementType; /** An uninstantiated component which handles the display of individual utility items. */ UtilityItem?: React.ElementType; /** An uninstantiated component which handles the display of individual utility items on mobile. */ MobileUtilityItem?: React.ElementType; /** An uninstantiated component which handles the display of the main navigation and its links. */ MainNav?: React.ElementType; /** An uninstantiated component which handles the display of the main navigation and its links on mobile. */ MobileMainNav?: React.ElementType; /** An uninstantiated component which handles display of individual navigation items inside of the main navigation. */ NavItem?: React.ElementType; /** An uninstantiated component which handles display of individual navigation items inside of the main navigation on mobile. */ MobileNavItem?: React.ElementType; /** An array of items used to create the menu. */ mainItems?: { href?: string; text?: string; active?: boolean; subNav?: { href?: string; text?: string; }[]; }[]; /** An array of uninstantiated components to render within the utility navigation. */ utilityItems?: React.ElementType[]; } declare const Header: ({ Logo, MobileLogo, siteName, NavSearch, MobileNavSearch, SkipNav, UtilityNav, MobileUtilityNav, UtilityItem, MobileUtilityItem, MainNav, MobileMainNav, NavItem, MobileNavItem, Container, mainItems, utilityItems }: HeaderProps) => any; export default Header;