import Link from 'next/link';
import { Logo } from '../../01-atoms';
import { Avatar, Container, Menu } from '../../02-molecules';
import { SecondMenu } from './SecondMenu';
import { BellNotification } from '../../02-molecules/BellNotifications/BellNotification';
/**
 * Header component for rendering the header section of the application.
 *
 * @component
 * @example
 * // Example usage of Header component
 * <Header
 *   homeHref="/"
 *   primaryMenu={{ primary menu props here }}
 *   secondMenu={{ second menu props here }}
 *   avatar={{ avatar props here }}
 * />
 *
 * @param {Object} props - The properties of the Header component.
 * @param {string} [props.homeHref='/'] - The URL for the home link.
 * @param {ComponentProps<typeof Menu>['menu']} [props.primaryMenu] - The primary menu configuration.
 * @param {ComponentProps<typeof Menu>['menu']} [props.secondMenu] - The secondary menu configuration.
 * @param {Omit<AvatarProps, 'className' | 'position'>} [props.avatar] - The avatar properties.
 * @param {}
 *
 * @returns {ReactNode} The rendered Header component.
 */
export function Header({ homeHref = '/', primaryMenu, secondMenu, avatar, bellNotifications, }) {
    return (<Container as="header" className="relative flex flex-row justify-between py-2">
      <div className="flex items-center gap-4">
        <div>
          <Link href={homeHref}>
            <Logo id="logo"/>
          </Link>
        </div>
        {!!secondMenu && <SecondMenu menu={secondMenu}/>}
        {!!primaryMenu && (<div>
            <Menu menu={primaryMenu} orientation="horizontal"/>
          </div>)}
      </div>
      <div className="flex items-center gap-3">
        {!!bellNotifications && <BellNotification {...bellNotifications}/>}
        {!!avatar && <Avatar {...avatar} position="right"/>}
      </div>
    </Container>);
}
//# sourceMappingURL=Header.jsx.map