import { Component, h, Prop } from '@stencil/core';
import benefitsEventTrackingService from '../../../services/event-tracking.service';
export class BenefitCard {
  constructor() {
    this.onBenefitButtonClick = async (event) => {
      event.preventDefault();
      if (this.benefit.url === null)
        return;
      window.open(this.benefit.url, '_blank');
      benefitsEventTrackingService.trackBenefitLinkClickedAsync(this.benefitWithId);
    };
  }
  render() {
    return (h("div", { class: "row h-100 d-flex justify-content-between no-gutters", onClick: async (event) => this.onBenefitButtonClick(event) },
      h("div", { class: "col-9 col-md-12 col-lg-10 text-left" },
        h("h5", { class: "card-title mb-1" }, this.benefit.title),
        h("h6", { class: "benefit-value-description" }, this.benefit.subtitle),
        h("small", { class: "card-text text-muted text-uppercase" }, this.benefit.description)),
      h("div", { class: "col-2 col-md-12 col-lg-2 d-flex justify-content-end align-items-center" }, this.IconElement())));
  }
  get benefit() {
    return this.benefitWithId.benefit;
  }
  IconElement() {
    var _a;
    if (this.benefit.icon !== null) {
      return h("img", { class: "img-fluid", src: (_a = this.benefit.icon) === null || _a === void 0 ? void 0 : _a.downloadUrl, alt: "" });
    }
    else {
      return h("ap-ben-icon", { class: "text-black-50 fa-3x", iconPrefix: "fad", iconId: "award" });
    }
  }
  static get is() { return "ap-ben-benefit-card"; }
  static get originalStyleUrls() { return {
    "$": ["benefit-card.scss"]
  }; }
  static get styleUrls() { return {
    "$": ["benefit-card.css"]
  }; }
  static get properties() { return {
    "benefitWithId": {
      "type": "unknown",
      "mutable": false,
      "complexType": {
        "original": "BenefitWithIdDto",
        "resolved": "{ benefitId: string; benefit: BenefitItemDto; }",
        "references": {
          "BenefitWithIdDto": {
            "location": "import",
            "path": "../../../apis/benefits-api/benefits-api.dto"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      }
    }
  }; }
}
