import React from 'react';
import classNames from 'classnames';
import { defaultRenderLogo, defaultRenderLogoAndTitle, defaultRenderCollapsedButton } from '../SiderMenu/SiderMenu';
import TopNavHeader from '../TopNavHeader';
import { clearMenuItem } from '../../utils/utils';
import { jsx as _jsx } from "react/jsx-runtime";
import { Fragment as _Fragment } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
const renderLogo = (menuHeaderRender, logoDom) => {
  if (menuHeaderRender === false) {
    return null;
  }
  if (menuHeaderRender) {
    return menuHeaderRender(logoDom, null);
  }
  return logoDom;
};
const GlobalHeader = props => {
  const {
    isMobile,
    logo,
    collapsed,
    onCollapse,
    collapsedButtonRender = defaultRenderCollapsedButton,
    rightContentRender,
    menuHeaderRender,
    onMenuHeaderClick,
    className: propClassName,
    style,
    layout,
    children,
    headerTheme = 'dark',
    splitMenus,
    menuData,
    prefixCls
  } = props;
  const baseClassName = `${prefixCls}-global-header`;
  const className = classNames(propClassName, baseClassName, {
    [`${baseClassName}-layout-${layout}`]: layout && headerTheme === 'dark'
  });
  if (layout === 'mix' && !isMobile && splitMenus) {
    const noChildrenMenuData = (menuData || []).map(item => ({
      ...item,
      children: undefined
    }));
    const clearMenuData = clearMenuItem(noChildrenMenuData);
    return /*#__PURE__*/_jsx(TopNavHeader, {
      mode: "horizontal",
      ...props,
      splitMenus: false,
      menuData: clearMenuData,
      theme: headerTheme
    });
  }
  const logoDom = /*#__PURE__*/_jsx("span", {
    className: `${baseClassName}-logo`,
    children: /*#__PURE__*/_jsx("a", {
      children: defaultRenderLogo(logo)
    })
  }, "logo");
  return /*#__PURE__*/_jsxs("div", {
    className: className,
    style: {
      ...style
    },
    children: [isMobile && renderLogo(menuHeaderRender, logoDom), isMobile && collapsedButtonRender && /*#__PURE__*/_jsx("span", {
      className: `${baseClassName}-collapsed-button`,
      onClick: () => {
        if (onCollapse) {
          onCollapse(!collapsed);
        }
      },
      children: collapsedButtonRender(collapsed)
    }), layout === 'mix' && !isMobile && /*#__PURE__*/_jsx(_Fragment, {
      children: /*#__PURE__*/_jsx("div", {
        className: `${baseClassName}-logo`,
        onClick: onMenuHeaderClick,
        children: defaultRenderLogoAndTitle({
          ...props,
          collapsed: false
        }, 'headerTitleRender')
      })
    }), /*#__PURE__*/_jsx("div", {
      style: {
        flex: 1
      },
      children: children
    }), rightContentRender && rightContentRender(props)]
  });
};
export default GlobalHeader;