import { jsx, jsxs } from "react/jsx-runtime";
import { useLingui } from "@lingui/react";
import { styled } from "@mui/material";
import apollo_core, { FontVariantToken } from "@uipath/apollo-core";
import react from "react";
import { StatusTypes } from "../../../../../types/statusTypes.js";
import { ApBadge } from "../../../ap-badge/index.js";
import { ApTypography } from "../../../ap-typography/index.js";
import autopilot_logo from "../../assets/autopilot-logo.js";
import { useChatState } from "../../providers/chat-state-provider.js";
import { AutopilotChatMode } from "../../service/index.js";
import { AutopilotChatHeaderActions } from "./header-actions.js";
const StyledHeader = styled('div')(({ hideSeparator })=>({
        display: 'flex',
        alignItems: 'center',
        justifyContent: 'space-between',
        ...!hideSeparator && {
            margin: `0 -${apollo_core.Spacing.SpacingBase} -${apollo_core.Spacing.SpacingBase}`,
            paddingLeft: apollo_core.Spacing.SpacingBase,
            paddingBottom: apollo_core.Spacing.SpacingMicro,
            paddingRight: apollo_core.Spacing.SpacingBase,
            borderBottom: '1px solid var(--color-border-de-emp)'
        }
    }));
const StyledLogo = styled('div')(()=>({
        display: 'flex',
        alignItems: 'center',
        gap: apollo_core.Spacing.SpacingXs
    }));
function AutopilotChatHeaderComponent() {
    const { _ } = useLingui();
    const { disabledFeatures, overrideLabels, chatMode } = useChatState();
    return /*#__PURE__*/ jsxs(StyledHeader, {
        hideSeparator: disabledFeatures.headerSeparator,
        children: [
            /*#__PURE__*/ jsxs(StyledLogo, {
                children: [
                    chatMode === AutopilotChatMode.FullScreen ? /*#__PURE__*/ jsx(autopilot_logo, {}) : null,
                    /*#__PURE__*/ jsx(ApTypography, {
                        variant: FontVariantToken.fontBrandL,
                        color: 'var(--color-foreground)',
                        role: "heading",
                        "aria-level": 1,
                        children: overrideLabels.title ?? _({
                            id: 'autopilot-chat.header.title'
                        })
                    }),
                    !disabledFeatures.preview && /*#__PURE__*/ jsx(ApBadge, {
                        label: _({
                            id: 'autopilot-chat.header.preview'
                        }),
                        status: StatusTypes.INFO
                    })
                ]
            }),
            /*#__PURE__*/ jsx(AutopilotChatHeaderActions, {})
        ]
    });
}
const AutopilotChatHeader = /*#__PURE__*/ react.memo(AutopilotChatHeaderComponent);
export { AutopilotChatHeader };
