import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import Avatar from '../avatar';
import Box from '../box';
import { useStyleConfig, vui } from '../core';
import T from '../t';
import { cs } from '../utils';
import { useHeaderContext } from './context';
/** Displays user information, like username and company name, within HeaderAccount part. */
export const HeaderAccountUserInfo = vui((props, ref) => {
    const { children, className, color, companyName, displayName, isApplication, role, ...rest } = props;
    const styles = useStyleConfig('Header', useHeaderContext());
    const localColor = color || styles.accountUserInfo.color || 'darkBlue.main';
    return (_jsx(Box, { className: cs('vui-headerAccountUserInfo', className), p: 2, pb: 1, ref: ref, spaceX: 2, ...styles.accountUserInfo, ...rest, lineHeight: isApplication ? '18px' : 'inherit', pr: isApplication ? 0 : 'inherit', textAlign: isApplication ? 'right' : 'inherit', children: children ?? (_jsxs(_Fragment, { children: [!isApplication && (_jsx(Avatar, { className: "vui-headerAccountUserInfoAvatar", name: displayName, size: "xl", variant: "solidDarkBlue" })), _jsxs(Box, { column: true, rowGap: role ? 0 : 0.5, children: [displayName && (_jsx(T, { color: localColor, fontSize: isApplication ? '12px' : 'inherit', isTruncated: true, pr: 1, title: displayName, weight: "demi", children: displayName })), companyName && (_jsx(T, { color: localColor, fontSize: isApplication ? '12px' : 'inherit', isTruncated: true, pr: 1, title: companyName, children: companyName })), role && (_jsx(T, { color: localColor, fontSize: isApplication ? '12px' : 'inherit', isTruncated: true, opacity: 0.65, pr: 1, title: role, children: role }))] })] })) }));
});
HeaderAccountUserInfo.displayName = 'HeaderAccountUserInfo';
export default HeaderAccountUserInfo;
//# sourceMappingURL=headerAccountUserInfo.js.map