/*---------------------------------------------------------------------------------------------
 * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
 * See LICENSE.md in the project root for license terms and full copyright notice.
 *--------------------------------------------------------------------------------------------*/
/** @packageDocumentation
 * @module Backstage
 */
import classnames from "classnames";
import * as React from "react";
import { Key } from "ts-key-enum";
import { SafeAreaInsetsHelpers } from "../base/SafeAreaInsets.js";
import "./Backstage.scss";
/** Backstage component of 9-Zone UI app.
 * @internal
 */
export class Backstage extends React.PureComponent {
    static defaultProps = {
        showOverlay: true,
    };
    componentDidMount() {
        document.addEventListener("keydown", this._onEsc, false);
    }
    componentWillUnmount() {
        document.removeEventListener("keydown", this._onEsc, false);
    }
    render() {
        const overlayClassName = classnames("nz-backstage-backstage_overlay", this.props.isOpen && "nz-open", this.props.showOverlay && "nz-overlay");
        const backstageClassName = classnames("nz-backstage-backstage", this.props.isOpen && "nz-open", this.props.safeAreaInsets &&
            SafeAreaInsetsHelpers.getCssClassNames(this.props.safeAreaInsets), this.props.className);
        return (React.createElement(React.Fragment, null,
            React.createElement("div", { className: overlayClassName, onClick: this._onClose, role: "presentation" }),
            React.createElement("div", { className: backstageClassName, style: this.props.style },
                this.props.header && (React.createElement("div", { className: "nz-header" }, this.props.header)),
                React.createElement("ul", { role: "menu" }, this.props.children),
                this.props.footer && (React.createElement("div", { className: "nz-footer" }, this.props.footer)))));
    }
    _onClose = () => {
        this.props.onClose && this.props.onClose();
    };
    _onEsc = (event) => {
        if (this.props.isOpen && event.key === Key.Escape.valueOf()) {
            this._onClose();
        }
    };
}
//# sourceMappingURL=Backstage.js.map