import { unsafeCSS, LitElement, nothing, html } from "lit";
import { customElement } from "../../decorator.js";
import compentStyle from "./integration-bar-dropdown.css.js";
import "../integration-tabs/integration-tabs.js";
import "../../components/clock/clock.js";
import "../../components/icon-button/icon-button.js";
import "../../icons/icon-palette-day-night-iec.js";
import "../../icons/icon-user.js";
import "../../icons/icon-configure.js";
import "../../icons/icon-notification.js";
import "../../icons/icon-home.js";
import { NotificationButtonStyle } from "../../components/notification-button/notification-button.js";
import { property } from "lit/decorators.js";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
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;
};
let ObcIntegrationBarDropdown = class extends LitElement {
  constructor() {
    super(...arguments);
    this.showHomeButton = false;
    this.homeButtonActivated = false;
    this.showClock = false;
    this.showNotificationButton = false;
    this.notificationButtonActivated = false;
    this.notificationCount = 0;
    this.showNotificationCount = false;
    this.showUserButton = false;
    this.userButtonActivated = false;
    this.showDimmingButton = false;
    this.dimmingButtonActivated = false;
    this.showSystemButton = false;
    this.systemButtonActivated = false;
    this.nStatusFields = 0;
  }
  renderStatusFields() {
    if (this.nStatusFields <= 0) {
      return nothing;
    }
    const result = [];
    for (let i = 0; i < this.nStatusFields; i++) {
      if (i > 0) {
        result.push(html`<div class="divider"></div>`);
      }
      result.push(html`
        <div class="status-item">
          <slot class="status-icon" name="status-icon-${i + 1}"></slot>
          <slot class="status-label" name="status-label-${i + 1}"></slot>
        </div>
      `);
    }
    return html`<div class="status">${result}</div>`;
  }
  render() {
    return html`
      <div class="wrapper">
        <div class="left-side">
          ${this.showHomeButton ? html`<obc-icon-button
                class="home-button"
                part="home-button"
                variant="integration"
                @click=${() => this.dispatchEvent(new CustomEvent("home-button-clicked"))}
                ?activated=${this.homeButtonActivated}
              >
                <obi-home></obi-home>
              </obc-icon-button>` : null}
          <slot name="vessel-selector"></slot>
          ${this.renderStatusFields()}
        </div>
        <div class="right-side">
          ${this.showNotificationButton ? html`<obc-notification-button
                @click=${() => this.dispatchEvent(
      new CustomEvent("notification-button-clicked")
    )}
                .buttonStyle=${NotificationButtonStyle.Enhanced}
                .showCount=${this.showNotificationCount}
                .count=${this.notificationCount}
                ?isActive=${this.notificationButtonActivated}
              ></obc-notification-button>` : nothing}
          ${this.showSystemButton ? html`<obc-icon-button
                class="system-button"
                part="system-button"
                variant="integration"
                @click=${() => this.dispatchEvent(new CustomEvent("system-button-clicked"))}
                ?activated=${this.systemButtonActivated}
              >
                <obi-configure></obi-configure>
              </obc-icon-button>` : null}
          ${this.showDimmingButton ? html`<obc-icon-button
                class="dimming-button"
                part="dimming-button"
                variant="integration"
                @click=${() => this.dispatchEvent(new CustomEvent("dimming-button-clicked"))}
                ?activated=${this.dimmingButtonActivated}
              >
                <obi-palette-day-night-iec></obi-palette-day-night-iec>
              </obc-icon-button>` : null}
          ${this.showUserButton ? html`<obc-icon-button
                class="user-button"
                part="user-button"
                variant="integration"
                @click=${() => this.dispatchEvent(new CustomEvent("user-button-clicked"))}
                ?activated=${this.userButtonActivated}
              >
                <obi-user></obi-user>
              </obc-icon-button>` : null}
          ${this.showClock ? html`<slot name="clock"></slot>` : null}
        </div>
      </div>
    `;
  }
};
ObcIntegrationBarDropdown.styles = unsafeCSS(compentStyle);
__decorateClass([
  property({ type: Boolean })
], ObcIntegrationBarDropdown.prototype, "showHomeButton", 2);
__decorateClass([
  property({ type: Boolean })
], ObcIntegrationBarDropdown.prototype, "homeButtonActivated", 2);
__decorateClass([
  property({ type: Boolean })
], ObcIntegrationBarDropdown.prototype, "showClock", 2);
__decorateClass([
  property({ type: Boolean })
], ObcIntegrationBarDropdown.prototype, "showNotificationButton", 2);
__decorateClass([
  property({ type: Boolean })
], ObcIntegrationBarDropdown.prototype, "notificationButtonActivated", 2);
__decorateClass([
  property({ type: Number })
], ObcIntegrationBarDropdown.prototype, "notificationCount", 2);
__decorateClass([
  property({ type: Boolean })
], ObcIntegrationBarDropdown.prototype, "showNotificationCount", 2);
__decorateClass([
  property({ type: Boolean })
], ObcIntegrationBarDropdown.prototype, "showUserButton", 2);
__decorateClass([
  property({ type: Boolean })
], ObcIntegrationBarDropdown.prototype, "userButtonActivated", 2);
__decorateClass([
  property({ type: Boolean })
], ObcIntegrationBarDropdown.prototype, "showDimmingButton", 2);
__decorateClass([
  property({ type: Boolean })
], ObcIntegrationBarDropdown.prototype, "dimmingButtonActivated", 2);
__decorateClass([
  property({ type: Boolean })
], ObcIntegrationBarDropdown.prototype, "showSystemButton", 2);
__decorateClass([
  property({ type: Boolean })
], ObcIntegrationBarDropdown.prototype, "systemButtonActivated", 2);
__decorateClass([
  property({ type: Number })
], ObcIntegrationBarDropdown.prototype, "nStatusFields", 2);
ObcIntegrationBarDropdown = __decorateClass([
  customElement("obc-integration-bar-dropdown")
], ObcIntegrationBarDropdown);
export {
  ObcIntegrationBarDropdown
};
//# sourceMappingURL=integration-bar-dropdown.js.map
