var __extends = (this && this.__extends) || (function () {
    var extendStatics = function (d, b) {
        extendStatics = Object.setPrototypeOf ||
            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
import * as classnames from "classnames";
import * as React from "react";
import Logo from "../Logo";
import { FlexBox, Justify } from "../flex";
import { TopBarButton } from "./TopBarButton";
import "./index.less";
import Menu from "../Menu";
// Defined as an array first as a convenience to make automatic enumeration of all themes easier in
// the demo code.
export var TopBarThemes = ["default", "plain", "a11y"];
/**
 * Global page-level header component.
 */
var TopBar = /** @class */ (function (_super) {
    __extends(TopBar, _super);
    function TopBar() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    TopBar.prototype.render = function () {
        var _a = this.props, children = _a.children, className = _a.className, title = _a.title, customLogo = _a.customLogo, theme = _a.theme;
        // If the last element is a "rounded" TopBarButton we need to add some additional padding to the right side.
        // To determine this we need to inspect the children;
        var needsRightPadding = false;
        var childrenArray = React.Children.toArray(children);
        if (childrenArray.length) {
            var lastItem = childrenArray[childrenArray.length - 1];
            var lastTrigger = lastItem.type === Menu ? lastItem.props.trigger : lastItem;
            if (lastTrigger && lastTrigger.type === TopBarButton && lastTrigger.props.round) {
                needsRightPadding = true;
            }
        }
        return (React.createElement(FlexBox, { alignItems: "center", role: "banner", className: classnames("dewey--TopBar", className, needsRightPadding && "dewey--TopBar--rightPadding", "dewey--TopBar--theme--" + theme) },
            React.createElement(TopBarButton, { "aria-label": this.props.logoAriaLabel, href: this.props.logoHref, onClick: this.props.onLogoClick, className: "dewey-TopBar--logoLink", "data-testid": "topBarLogoLink" }, customLogo || (React.createElement(Logo, { className: "dewey--TopBar--logo", svgClassName: "dewey--TopBar--logo--mobile" }))),
            title && (React.createElement("h1", { className: "dewey--TopBar--title", title: title }, title)),
            React.createElement(FlexBox, { alignItems: "center", justify: Justify.END, grow: true }, children)));
    };
    TopBar.defaultProps = {
        theme: "default",
        logoAriaLabel: "Clever Home",
    };
    TopBar.Button = TopBarButton;
    return TopBar;
}(React.PureComponent));
export { TopBar };
