import { unsafeCSS, LitElement, nothing, html } from "lit";
import { property } from "lit/decorators.js";
import { customElement } from "../../decorator.js";
import componentStyle from "./notification-message-item.css.js";
import { ObcTopbarMessageItemType, ObcTopbarMessageItemSize } from "../topbar-message-item/topbar-message-item.js";
import "../../icons/icon-notification-filled.js";
import "../../icons/icon-close-google.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;
};
var ObcNotificationMessageItemType = /* @__PURE__ */ ((ObcNotificationMessageItemType2) => {
  ObcNotificationMessageItemType2["Simple"] = "simple";
  ObcNotificationMessageItemType2["WithButton"] = "with-button";
  ObcNotificationMessageItemType2["WithIconButton"] = "with-icon-button";
  ObcNotificationMessageItemType2["Inactive"] = "inactive";
  return ObcNotificationMessageItemType2;
})(ObcNotificationMessageItemType || {});
var ObcNotificationMessageItemSize = /* @__PURE__ */ ((ObcNotificationMessageItemSize2) => {
  ObcNotificationMessageItemSize2["Regular"] = "regular";
  ObcNotificationMessageItemSize2["Tall"] = "tall";
  return ObcNotificationMessageItemSize2;
})(ObcNotificationMessageItemSize || {});
let ObcNotificationMessageItem = class extends LitElement {
  constructor() {
    super(...arguments);
    this.title = "";
    this.description = "";
    this.time = "";
    this.timeSecondary = "";
    this.actionLabel = "View";
    this.type = "simple";
    this.size = "regular";
    this.showTitle = true;
    this.showDescription = true;
    this.showTimestamp = true;
    this.hasTimestamp2 = false;
    this.hasSecondaryIcon = false;
    this.large = false;
    this.empty = false;
    this.emptyText = "No active notification";
  }
  get mappedType() {
    if (this.empty || this.type === "inactive") {
      return ObcTopbarMessageItemType.Inactive;
    }
    switch (this.type) {
      case "with-button":
        return ObcTopbarMessageItemType.WithButton;
      case "with-icon-button":
        return ObcTopbarMessageItemType.WithIconButton;
      case "simple":
        return ObcTopbarMessageItemType.Simple;
      default:
        return ObcTopbarMessageItemType.Simple;
    }
  }
  get mappedSize() {
    if (this.large) {
      return ObcTopbarMessageItemSize.Tall;
    }
    return this.size === "tall" ? ObcTopbarMessageItemSize.Tall : ObcTopbarMessageItemSize.Regular;
  }
  /**
   * Fired when the notification item is clicked (excluding the action area).
   * @event message-click
   */
  handleMessageClick() {
    this.dispatchEvent(new CustomEvent("message-click"));
  }
  /**
   * Fired when the action button or icon is clicked.
   * @event action-click
   */
  handleActionClick() {
    this.dispatchEvent(new CustomEvent("action-click"));
  }
  render() {
    return html`
      <obc-topbar-message-item
        .type=${this.mappedType}
        .size=${this.mappedSize}
        .showTitle=${this.showTitle}
        .showDescription=${this.showDescription}
        .showTimestamp=${this.showTimestamp}
        .hasTimestamp2=${this.hasTimestamp2}
        .hasSecondaryIcon=${this.hasSecondaryIcon}
        @message-click=${this.handleMessageClick}
        @action-click=${this.handleActionClick}
      >
        <obi-notification-filled slot="primary-icon"></obi-notification-filled>

        ${this.hasSecondaryIcon ? html`<slot name="secondary-icon" slot="secondary-icon"></slot>` : nothing}
        ${this.title && this.showTitle ? html`<span slot="title">${this.title}</span>` : nothing}
        ${this.description && this.showDescription ? html`<span slot="description">${this.description}</span>` : nothing}
        ${this.time && this.showTimestamp ? html`<span slot="time">${this.time}</span>` : nothing}
        ${this.timeSecondary && this.hasTimestamp2 ? html`<span slot="time-secondary">${this.timeSecondary}</span>` : nothing}
        ${this.type === "with-button" ? html`<span slot="action-text">${this.actionLabel}</span>` : this.type === "with-icon-button" ? html`<obi-close-google slot="action-icon"></obi-close-google>` : nothing}

        <span slot="empty">${this.emptyText}</span>
      </obc-topbar-message-item>
    `;
  }
};
ObcNotificationMessageItem.styles = unsafeCSS(componentStyle);
__decorateClass([
  property({ type: String })
], ObcNotificationMessageItem.prototype, "title", 2);
__decorateClass([
  property({ type: String })
], ObcNotificationMessageItem.prototype, "description", 2);
__decorateClass([
  property({ type: String })
], ObcNotificationMessageItem.prototype, "time", 2);
__decorateClass([
  property({ type: String })
], ObcNotificationMessageItem.prototype, "timeSecondary", 2);
__decorateClass([
  property({ type: String })
], ObcNotificationMessageItem.prototype, "actionLabel", 2);
__decorateClass([
  property({ type: String })
], ObcNotificationMessageItem.prototype, "type", 2);
__decorateClass([
  property({ type: String })
], ObcNotificationMessageItem.prototype, "size", 2);
__decorateClass([
  property({ type: Boolean, attribute: false })
], ObcNotificationMessageItem.prototype, "showTitle", 2);
__decorateClass([
  property({ type: Boolean, attribute: false })
], ObcNotificationMessageItem.prototype, "showDescription", 2);
__decorateClass([
  property({ type: Boolean, attribute: false })
], ObcNotificationMessageItem.prototype, "showTimestamp", 2);
__decorateClass([
  property({ type: Boolean })
], ObcNotificationMessageItem.prototype, "hasTimestamp2", 2);
__decorateClass([
  property({ type: Boolean })
], ObcNotificationMessageItem.prototype, "hasSecondaryIcon", 2);
__decorateClass([
  property({ type: Boolean })
], ObcNotificationMessageItem.prototype, "large", 2);
__decorateClass([
  property({ type: Boolean })
], ObcNotificationMessageItem.prototype, "empty", 2);
__decorateClass([
  property({ type: String })
], ObcNotificationMessageItem.prototype, "emptyText", 2);
ObcNotificationMessageItem = __decorateClass([
  customElement("obc-notification-message-item")
], ObcNotificationMessageItem);
export {
  ObcNotificationMessageItem,
  ObcNotificationMessageItemSize,
  ObcNotificationMessageItemType
};
//# sourceMappingURL=notification-message-item.js.map
