"use strict";
var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.HeaderAccount = HeaderAccount;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const avatar_1 = __importDefault(require("../avatar"));
const core_1 = require("../core");
const list_1 = __importDefault(require("../list"));
const popover_1 = __importDefault(require("../popover"));
const utils_1 = require("../utils");
const context_1 = require("./context");
const headerAccountUserInfo_1 = __importDefault(require("./headerAccountUserInfo"));
/** Disables popper's dynamic re-positioning */
/** Displays user account information and helpful links, like settings or logout. */
function HeaderAccount(props) {
    var _a, _b;
    const { contentProps, options = {}, sections, triggerProps, userInfo } = props, rest = __rest(props, ["contentProps", "options", "sections", "triggerProps", "userInfo"]);
    const { isMobile } = (0, context_1.useHeaderContext)();
    const styles = (0, core_1.useStyleConfig)('Header', (0, context_1.useHeaderContext)()).account;
    const name = (0, utils_1.isObject)(userInfo) ? userInfo.displayName : '';
    const variant = (_b = (_a = styles === null || styles === void 0 ? void 0 : styles.trigger) === null || _a === void 0 ? void 0 : _a.variant) !== null && _b !== void 0 ? _b : 'solidDarkBlue';
    const offsetX = isMobile ? 64 : 39;
    return ((0, jsx_runtime_1.jsxs)(popover_1.default, Object.assign({ isLazy: false, offset: [offsetX, 16], placement: "bottom-end" }, rest, { children: [(0, jsx_runtime_1.jsx)(popover_1.default.Trigger, Object.assign({ as: avatar_1.default, className: "vui-headerAccountTrigger", isInteractive: true, ml: 1, name: name, role: "button", size: "lg", title: "Account", variant: variant }, styles.trigger, triggerProps)), (0, jsx_runtime_1.jsxs)(popover_1.default.Content, Object.assign({ borderRadius: 0, className: "vui-headerAccountContent", column: true }, styles.content, { w: isMobile ? 280 : 320 }, contentProps, { children: [(0, utils_1.isJsx)(userInfo) ? userInfo : userInfo && (0, jsx_runtime_1.jsx)(headerAccountUserInfo_1.default, Object.assign({}, userInfo)), (0, utils_1.isJsx)(sections)
                        ? sections
                        : sections && ((0, jsx_runtime_1.jsx)(list_1.default, { className: "vui-headerAccountList", mb: 2, children: sections.map(({ heading, links }, index) => ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(list_1.default.Divider, {}), heading && (0, jsx_runtime_1.jsx)(list_1.default.Heading, { text: heading }), links === null || links === void 0 ? void 0 : links.map((_a, index) => {
                                        var { icon, url } = _a, rest = __rest(_a, ["icon", "url"]);
                                        return ((0, jsx_runtime_1.jsx)(list_1.default.Item, Object.assign({ iconLeft: icon, linkProps: { href: url } }, rest), index));
                                    })] }, index))) }))] }))] })));
}
HeaderAccount.displayName = 'HeaderAccount';
exports.default = HeaderAccount;
//# sourceMappingURL=headerAccount.js.map