import { r as registerInstance, h, H as Host } from './core-095fd691.js';
var BceMenu = /** @class */ (function () {
    function class_1(hostRef) {
        var _this = this;
        registerInstance(this, hostRef);
        this.vertical = false;
        this.right = false;
        this.toggleDesktop = false;
        this.active = false;
        this.close = function () {
            _this.active = false;
        };
    }
    class_1.prototype.handleResize = function () {
        var _this = this;
        requestAnimationFrame(function () {
            if (window.innerWidth < 1024) {
                _this.active = false;
            }
            else if (window.innerWidth > 1024 && !_this.toggleDesktop) {
                _this.active = true;
            }
        });
    };
    class_1.prototype.toggleMenu = function () {
        this.active = !this.active;
    };
    class_1.prototype.componentDidLoad = function () {
        if (!this.toggleDesktop && window.innerWidth > 1024) {
            this.active = true;
        }
    };
    class_1.prototype.render = function () {
        return (h(Host, { class: this.right ? 'right' : 'left', active: this.active }, window.innerWidth < 1024 ? (h("bce-icon", { onClick: this.close, raw: 'times-circle', pre: 'fas', size: '3x' })) : (''), h("div", { class: {
                menu: true,
                horizontal: !this.vertical,
                verticle: this.vertical
            } }, h("slot", null))));
    };
    Object.defineProperty(class_1, "style", {
        get: function () { return "bce-menu{--bce-color-l:var(--bce-color-dark-l);--bce-color-n:var(--bce-color-dark-n);--bce-color-d:var(--bce-color-dark-d);--bce-color-t:var(--bce-color-dark-t);background-color:var(--bce-color-n);width:100%;height:100%;z-index:6;display:none}bce-menu>bce-icon{position:absolute;top:2rem;right:1.25rem;color:#fff;z-index:6}bce-menu>.menu{display:-ms-flexbox;display:flex;position:absolute;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;top:0;left:0;bottom:0;right:0;z-index:5;font-size:1.5rem;background-color:var(--bce-color-n)}bce-menu>div>a{margin:1rem;text-decoration:none;text-transform:uppercase}bce-menu>div>a,bce-menu>div>a:active,bce-menu>div>a:hover{color:var(--bce-color-t)}\@media screen and (min-width:1024px){bce-menu .menu{position:relative;-ms-flex-pack:start;justify-content:flex-start;-ms-flex-align:start;align-items:flex-start;font-size:1.2rem;top:0}bce-menu.left{-webkit-animation:slide-in-l .3s ease-in-out;animation:slide-in-l .3s ease-in-out}bce-menu.right{-ms-flex-order:1;order:1;-webkit-animation:slide-in-r .3s ease-in-out;animation:slide-in-r .3s ease-in-out}bce-menu.horizontal{-ms-flex-direction:row;flex-direction:row}bce-menu.verticale{-ms-flex-direction:column;flex-direction:column}}bce-menu[active]{display:-ms-flexbox;display:flex}\@-webkit-keyframes slide-in-r{0%{-webkit-transform:translateX(100%);transform:translateX(100%)}to{-webkit-transform:translateX(0);transform:translateX(0)}}\@keyframes slide-in-r{0%{-webkit-transform:translateX(100%);transform:translateX(100%)}to{-webkit-transform:translateX(0);transform:translateX(0)}}\@-webkit-keyframes slide-in-l{0%{-webkit-transform:translateX(-100%);transform:translateX(-100%)}to{-webkit-transform:translateX(0);transform:translateX(0)}}\@keyframes slide-in-l{0%{-webkit-transform:translateX(-100%);transform:translateX(-100%)}to{-webkit-transform:translateX(0);transform:translateX(0)}}"; },
        enumerable: true,
        configurable: true
    });
    return class_1;
}());
export { BceMenu as bce_menu };
