import { css, LitElement, html } from "lit";
import { property } from "lit/decorators.js";
import { classMap } from "lit/directives/class-map.js";
import { alarmRectifiedA } from "./icons/icon-alarm-rectified.js";
import { warningRectifiedA } from "./icons/icon-warning-rectified.js";
import { alarmSilencedB, alarmSilencedA } from "./icons/icon-alarm-silenced.js";
import { warningSilencedB, warningSilencedA } from "./icons/icon-warning-silenced.js";
import { alarmUnackB, alarmUnackA } from "./icons/icon-alarm-unack.js";
import { warningUnackB, warningUnackA } from "./icons/icon-warning-unack.js";
import "../../icons/icon-caution-color-iec.js";
import { customElement } from "../../decorator.js";
import { AlertType } from "../../types.js";
import "../../icons/icon-alarm-badge-outline.js";
import "../../icons/icon-warning-badge-outline.js";
import "../../icons/icon-caution-badge-outline.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;
};
const mapping = {
  [
    "alarm-silenced"
    /* AlarmSilenced */
  ]: {
    a: alarmSilencedA,
    b: alarmSilencedB
  },
  [
    "alarm-unack"
    /* AlarmUnack */
  ]: {
    a: alarmUnackA,
    b: alarmUnackB
  },
  [
    "alarm-rectified"
    /* AlarmRectified */
  ]: {
    a: alarmRectifiedA,
    b: alarmRectifiedA
  },
  [
    "warning-unack"
    /* WarningUnack */
  ]: {
    a: warningUnackA,
    b: warningUnackB
  },
  [
    "warning-rectified"
    /* WarningRectified */
  ]: {
    a: warningRectifiedA,
    b: warningRectifiedA
  },
  [
    "warning-silenced"
    /* WarningSilenced */
  ]: {
    a: warningSilencedA,
    b: warningSilencedB
  }
};
let ObcAlertIcon = class extends LitElement {
  get icon() {
    if (this.type === AlertType.Alarm) {
      if (this.active === false) {
        return mapping[
          "alarm-rectified"
          /* AlarmRectified */
        ];
      } else if (this.acknowledged) {
        return mapping[
          "alarm-silenced"
          /* AlarmSilenced */
        ];
      } else {
        return mapping[
          "alarm-unack"
          /* AlarmUnack */
        ];
      }
    } else {
      if (this.active === false) {
        return mapping[
          "warning-rectified"
          /* WarningRectified */
        ];
      } else if (this.acknowledged) {
        return mapping[
          "warning-silenced"
          /* WarningSilenced */
        ];
      } else {
        return mapping[
          "warning-unack"
          /* WarningUnack */
        ];
      }
    }
  }
  render() {
    if (!this.type) {
      return html`<div>No alarm</div>`;
    }
    let icon;
    if (this.outline) {
      switch (this.type) {
        case AlertType.Alarm:
          icon = html`<obi-alarm-badge-outline></obi-alarm-badge-outline>`;
          break;
        case AlertType.Warning:
          icon = html`<obi-warning-badge-outline></obi-warning-badge-outline>`;
          break;
        case AlertType.Caution:
          icon = html`<obi-caution-badge-outline></obi-caution-badge-outline>`;
          break;
      }
    } else if (this.type === AlertType.Caution) {
      icon = html`<obi-caution-color-iec usecsscolor></obi-caution-color-iec>`;
    } else if ([AlertType.Alarm, AlertType.Warning].includes(this.type)) {
      const icons = this.icon;
      const isWarning = this.type === AlertType.Warning;
      return html`
        <div
          class=${classMap({
        wrapper: true,
        warning: isWarning
      })}
        >
          <span class="a">${icons.a}</span>
          <span class="b">${icons.b}</span>
        </div>
      `;
    } else {
      return html`<div>No alarm</div>`;
    }
    return html`<div class="wrapper">${icon}</div>`;
  }
};
ObcAlertIcon.styles = css`
    .wrapper {
      height: 100%;
      width: 100%;
      position: relative;
    }
    .wrapper svg {
      height: 100%;
      width: 100%;
      position: absolute;
      top: 0;
      left: 0;
    }

    :not(.warning) {
      .a {
        opacity: var(--alarm-blink-on);
      }

      .b {
        opacity: var(--alarm-blink-off);
      }
    }

    .warning {
      .a {
        opacity: var(--warning-blink-on);
      }

      .b {
        opacity: var(--warning-blink-off);
      }
    }
  `;
__decorateClass([
  property({ type: String })
], ObcAlertIcon.prototype, "type", 2);
__decorateClass([
  property({ type: Boolean })
], ObcAlertIcon.prototype, "acknowledged", 2);
__decorateClass([
  property({ type: Boolean })
], ObcAlertIcon.prototype, "active", 2);
__decorateClass([
  property({ type: Boolean })
], ObcAlertIcon.prototype, "outline", 2);
ObcAlertIcon = __decorateClass([
  customElement("obc-alert-icon")
], ObcAlertIcon);
export {
  ObcAlertIcon
};
//# sourceMappingURL=alert-icon.js.map
