import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { forwardRef } from 'react';
import { CrossOutlineMd } from '../../../icons/CrossOutlineMd';
import { MenuOnOutlineMd } from '../../../icons/MenuOnOutlineMd';
import { QuitOutlineMd } from '../../../icons/QuitOutlineMd';
import { Button } from '../../Button';
import { Product } from '../../Product';
import { Profile } from '../../Profile';
import { cva } from '../../utils/cva';
import { getInertProps } from '../../utils/getInertProps';
import { dashboardLayoutHeaderClassnames } from './constants';
import { ExitButton, HeaderContent, HeaderContentSection, HeaderRoot, HeaderSection, MobileNotificationListWrapper, MobileSidebarTogglerWrapper, PriorityFeatureWrapper, ProductSwitcherWrapper, ProfileWrapper, } from './styles';
import { useLogic } from './useLogic';
const headerPriorityFeature = cva('', {
    variants: {
        feature: {
            menuOrg: dashboardLayoutHeaderClassnames.priorityFeatureMenuOrg,
            profile: dashboardLayoutHeaderClassnames.priorityFeatureProfile,
        },
        isPinned: {
            true: dashboardLayoutHeaderClassnames.mobileSidebarPriorityFeatureVisible,
        },
        featureInSidebar: {
            true: dashboardLayoutHeaderClassnames.featureInSidebar,
        },
        hasNotificationList: {
            true: dashboardLayoutHeaderClassnames.hasNotificationList,
        },
    },
});
/**
 * Основной header приложения
 */
export const Header = forwardRef((props, ref) => {
    const { productSwitcher: ProductSwitcher, product, profile, menuOrganization: menuOrganizationProp, notificationList, children, } = props;
    const { isShowExitButton, isShowProfile, isFocusedMode, isMobile, collapsedIn, onToggleSidebar, isLoading, mobileHeaderPriorityFeature, headerStyle, isPinned, } = useLogic(props);
    const menuOrganization = menuOrganizationProp?.();
    return (_jsx(HeaderRoot, { ref: ref, "$isFocusedMode": isFocusedMode, ...getInertProps(!isMobile && isFocusedMode), className: dashboardLayoutHeaderClassnames.root, style: headerStyle, children: _jsxs(HeaderContent, { children: [_jsx(MobileSidebarTogglerWrapper, { className: dashboardLayoutHeaderClassnames.mobileSidebarButton, children: _jsx(Button, { startIcon: collapsedIn ? _jsx(CrossOutlineMd, {}) : _jsx(MenuOnOutlineMd, {}), variant: "text", onClick: () => onToggleSidebar(), title: "\u041F\u0435\u0440\u0435\u043A\u043B\u044E\u0447\u0438\u0442\u044C \u0431\u043E\u043A\u043E\u0432\u043E\u0435 \u043C\u0435\u043D\u044E" }) }), _jsxs(HeaderSection, { children: [ProductSwitcher && (_jsx(ProductSwitcherWrapper, { children: _jsx(ProductSwitcher, {}) })), _jsx(Product, { ...product })] }), _jsxs(HeaderContentSection, { className: headerPriorityFeature({
                        feature: mobileHeaderPriorityFeature,
                    }), children: [children, notificationList, menuOrganization && (_jsxs(PriorityFeatureWrapper, { className: headerPriorityFeature({
                                feature: mobileHeaderPriorityFeature,
                                isPinned,
                                featureInSidebar: mobileHeaderPriorityFeature === 'profile',
                                hasNotificationList: Boolean(notificationList),
                            }), children: [mobileHeaderPriorityFeature === 'profile' &&
                                    notificationList && (_jsx(MobileNotificationListWrapper, { children: notificationList })), menuOrganization] })), profile && (_jsxs(PriorityFeatureWrapper, { className: headerPriorityFeature({
                                feature: mobileHeaderPriorityFeature,
                                isPinned,
                                featureInSidebar: mobileHeaderPriorityFeature === 'menuOrg',
                                hasNotificationList: Boolean(notificationList),
                            }), children: [mobileHeaderPriorityFeature === 'menuOrg' &&
                                    notificationList && (_jsx(MobileNotificationListWrapper, { children: notificationList })), _jsx(ProfileWrapper, { className: dashboardLayoutHeaderClassnames.profile, "$isShow": isShowProfile, children: _jsx(Profile, { isLoading: isLoading, ...profile }) })] })), _jsx(ExitButton, { "$isShow": isShowExitButton, onClick: profile?.exitButton?.onClick, title: "\u0412\u044B\u0445\u043E\u0434", variant: "text", children: _jsx(QuitOutlineMd, {}) })] })] }) }));
});
