'use client'
"use strict";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var __decorateClass = (decorators, target, key, kind) => {
  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
  for (var i = decorators.length - 1, decorator; i >= 0; i--)
    if (decorator = decorators[i])
      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
  if (kind && result)
    __defProp(target, key, result);
  return result;
};

// src/MenuBaseElement.ts
var MenuBaseElement_exports = {};
__export(MenuBaseElement_exports, {
  MenuBaseElement: () => MenuBaseElement
});
module.exports = __toCommonJS(MenuBaseElement_exports);
var import_lit = require("lit");
var import_ref = require("lit/directives/ref.js");
var import_decorators = require("lit/decorators.js");
var MenuBaseElement = class extends import_lit.LitElement {
  constructor() {
    super(...arguments);
    this.handleClickOutside = (event) => {
      if (!this.listRef.value || this.listRef.value.contains(event.composedPath()[0])) {
        return;
      }
      this.expanded = false;
    };
    this.additinalItems = [];
    this.expanded = false;
    this.handleToggleDrawer = (event) => {
      event.preventDefault();
      event.stopPropagation();
      this.expanded = !this.expanded;
      if (this.expanded) {
        window.addEventListener("click", this.handleClickOutside, false);
      }
    };
    this.listRef = (0, import_ref.createRef)();
  }
  updated() {
    if (this.expanded === false) {
      window.removeEventListener("click", this.handleClickOutside, false);
    }
  }
  disconnectedCallback() {
    super.disconnectedCallback();
    window.removeEventListener("click", this.handleClickOutside, false);
  }
};
MenuBaseElement.styles = import_lit.css`
    nav {
      position: relative;
      display: flex;
    }
    .navigation-drawer-controll-button {
      display: flex;
      align-items: center;
      justify-content: center;

      height: 42px;
      padding: 0;
      cursor: pointer;
      background-color: transparent;
      border: none;
      transition: background-color 0.2s;
      appearance: none;
    }
    .navigation-drawer-controll-button.navigation-drawer-controll-button--icon {
      width: 42px;
    }
    .navigation-drawer-controll-button:hover {
      background-color: rgba(0, 0, 0, 0.05);
    }
    .navigation-drawer-controll-button:active {
      background-color: rgba(0, 0, 0, 0.075);
    }

    .navigation-drawer {
      position: absolute;
      top: 100%;
      right: 0px;
      z-index: 1100;
      box-sizing: border-box;
      min-width: 200px;
      padding: 0px;
      margin: 0px;
      overflow: hidden;
      color: rgba(0, 0, 0, 0.87);
      white-space: nowrap;
      list-style: none;
      background-color: #fff;
      border-radius: 5px;
      box-shadow: 0px 1px 3px 0px rgb(0 0 0 / 20%),
        0px 1px 1px 0px rgb(0 0 0 / 14%), 0px 2px 1px -1px rgb(0 0 0 / 12%);
    }
    .navigation-drawer-controll-button[aria-expanded="false"]
      ~ .navigation-drawer {
      display: none;
    }

    .navigation-drawer li {
      border-bottom: 1px solid #eeeeee;
    }
    .navigation-drawer li:last-of-type {
      border-bottom: none;
    }
    .navigation-drawer li > a,
    .navigation-drawer li > button {
      box-sizing: border-box;
      display: block;
      width: 100%;
      padding: 0;
      padding: 0.6em 1em;
      font: inherit;
      color: inherit;
      text-align: left;
      text-decoration: none;
      cursor: pointer;
      cursor: pointer;
      background-color: transparent;
      border: none;
      transition: 0.2s;
      appearance: none;
    }
    .navigation-drawer li > a:hover,
    .navigation-drawer li > button:hover {
      background-color: #ededed;
    }
    .navigation-drawer li > a:active,
    .navigation-drawer li > button:active {
      background-color: #dadada;
    }

    .navigation-drawer li ul {
      padding: 0;
      list-style: none;
    }
    .navigation-drawer li:has(> ul) li > a {
      padding-left: 2em;
    }

    .navigation-drawer li:has(> ul) > span {
      display: block;
      padding: 0.6em 1em;
      border-bottom: 1px solid #eeeeee;
    }
  `;
__decorateClass([
  (0, import_decorators.property)({
    type: Object,
    attribute: "additional-items"
  })
], MenuBaseElement.prototype, "additinalItems", 2);
__decorateClass([
  (0, import_decorators.property)()
], MenuBaseElement.prototype, "expanded", 2);
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  MenuBaseElement
});
//# sourceMappingURL=MenuBaseElement.js.map