import { Component, h, Prop } from "@stencil/core";
import { createStyleSheet } from "../../../styling/JSS";
const style = {
  SubText: {
    fontSize: "var(--sl-font-size-small)",
    color: "var(--sqm-text-subdued)",
    margin: "0",
  },
  RedeemBadge: {
    "&::part(base)": {
      fontSize: "var(--sl-font-size-small)",
      padding: "4px 8px",
      textAlign: "center",
      maxWidth: "170px",
      whiteSpace: "pre-line",
      background: "var(--sqm-informative-color-icon)",
      color: "var(--sl-color-white)",
    },
  },
  DangerBadge: {
    "&::part(base)": {
      fontSize: "var(--sl-font-size-small)",
      padding: "4px 8px",
      textAlign: "center",
      maxWidth: "170px",
      whiteSpace: "pre-line",
      background: "var(--sqm-danger-color-icon)",
      color: "var(--sl-color-white)",
    },
  },
  WarningBadge: {
    "&::part(base)": {
      fontSize: "var(--sl-font-size-small)",
      padding: "4px 8px",
      textAlign: "center",
      maxWidth: "170px",
      whiteSpace: "pre-line",
      background: "var(--sqm-warning-color-icon)",
      color: "var(--sl-color-white)",
    },
  },
  SuccessBadge: {
    "&::part(base)": {
      fontSize: "var(--sl-font-size-small)",
      padding: "4px 8px",
      textAlign: "center",
      maxWidth: "170px",
      whiteSpace: "pre-line",
      background: "var(--sqm-success-color-icon)",
      color: "var(--sl-color-white)",
    },
  },
};
const sheet = createStyleSheet(style);
const styleString = sheet.toString();
export class ReferralTableStatusCell {
  render() {
    const sheet = createStyleSheet(style);
    const styleString = sheet.toString();
    const getBadgeType = (fraudStatus) => {
      if (fraudStatus === "PENDING")
        return "warning";
      if (fraudStatus === "DENIED")
        return "danger";
      if (this.converted)
        return "success";
      return "warning";
    };
    const getBadgeCSSClass = (badgeType) => {
      switch (badgeType) {
        case "primary":
          return sheet.classes.RedeemBadge;
        case "danger":
          return sheet.classes.DangerBadge;
        case "success":
          return sheet.classes.SuccessBadge;
        case "warning":
        case "info":
          return sheet.classes.WarningBadge;
        default:
          return sheet.classes.WarningBadge;
      }
    };
    return (h("div", null,
      h("style", { type: "text/css" }, styleString),
      h("sl-badge", { pill: true, type: getBadgeType(this.fraudStatus), class: getBadgeCSSClass(getBadgeType(this.fraudStatus)) }, this.statusText),
      this.statusSubText ? (h("p", { class: sheet.classes.SubText }, this.statusSubText)) : null));
  }
  static get is() { return "sqm-referral-table-status-cell"; }
  static get encapsulation() { return "shadow"; }
  static get properties() { return {
    "statusText": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "status-text",
      "reflect": false
    },
    "fraudStatus": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "FraudStatus",
        "resolved": "\"APPROVED\" | \"DENIED\" | \"PENDING\"",
        "references": {
          "FraudStatus": {
            "location": "import",
            "path": "../../../saasquatch"
          }
        }
      },
      "required": false,
      "optional": true,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "fraud-status",
      "reflect": false
    },
    "converted": {
      "type": "boolean",
      "mutable": false,
      "complexType": {
        "original": "boolean",
        "resolved": "boolean",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "converted",
      "reflect": false
    },
    "statusSubText": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "status-sub-text",
      "reflect": false
    }
  }; }
}
