import { Component, Element, h, Listen, Method, Prop, State } from "@stencil/core";
import { PaymentOptionInstallmentIs, } from "../model";
import { paymentDetailsAdd } from "../payment/options/PaymentDetails";
import * as translation from "./translation";
export class IntergiroInstallmentDetails {
  async componentWillLoad() {
    this.t = translation.create(this.element);
  }
  async getPayment(order, apiKey) {
    let result;
    if (this.option && this.selected) {
      if (!order.items || !order.currency || !order.customer)
        console.log("Error: must have items, currency, customer");
      else {
        result = {
          type: this.option.type,
          plan: this.selected,
          verify: { mode: "iframe", parent: window.location.origin },
        };
      }
    }
    return result;
  }
  onSelected(e) {
    if (typeof e.detail == "object" && typeof e.detail.value == "string" && this.option)
      this.selected = this.option.plans.find(plan => plan.length.toString() == e.detail.value);
  }
  limit(value, decimals) {
    const factor = decimals == 0 ? 1 : 100;
    return Math.round((value + Number.EPSILON) * factor) / factor;
  }
  render() {
    const t = this.t;
    if (!this.selected && Array.isArray(this.option) && this.option.length > 0)
      this.selected = this.option.plans[0];
    const rate = this.selected && this.selected.effectiveRate ? this.selected.effectiveRate * 100 : "-";
    return [
      this.option
        ? this.option.plans.map(plan => (h("smoothly-radio", { checked: this.selected == plan, name: "invoice-plan", value: plan.length.toString() }, t("$0 $1 / month in $2 months", this.currency, this.limit(plan.amount, 0), plan.length))))
        : [],
      this.selected ? (h("p", null, t("$0 $1 in initial fee and $2 $3 reccuring. Total cost is $4 $5 and the effective rate is $6%", this.currency, this.selected.fees.initial, this.currency, this.selected.fees.reaccuring, this.currency, this.limit(this.selected.total, 0), typeof rate == "number" ? this.limit(rate, 2).toString() : rate))) : ([]),
    ];
  }
  static get is() { return "ig-installment-details"; }
  static get encapsulation() { return "scoped"; }
  static get originalStyleUrls() { return {
    "$": ["style.css"]
  }; }
  static get styleUrls() { return {
    "$": ["style.css"]
  }; }
  static get properties() { return {
    "option": {
      "type": "unknown",
      "mutable": false,
      "complexType": {
        "original": "PaymentOptionInstallment",
        "resolved": "Installment | undefined",
        "references": {
          "PaymentOptionInstallment": {
            "location": "import",
            "path": "../model"
          }
        }
      },
      "required": false,
      "optional": true,
      "docs": {
        "tags": [],
        "text": ""
      }
    },
    "currency": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "Currency",
        "resolved": "\"AED\" | \"AFN\" | \"ALL\" | \"AMD\" | \"ANG\" | \"AOA\" | \"ARS\" | \"AUD\" | \"AWG\" | \"AZN\" | \"BAM\" | \"BBD\" | \"BDT\" | \"BGN\" | \"BHD\" | \"BIF\" | \"BMD\" | \"BND\" | \"BOB\" | \"BOV\" | \"BRL\" | \"BSD\" | \"BTN\" | \"BWP\" | \"BYN\" | \"BZD\" | \"CAD\" | \"CDF\" | \"CHE\" | \"CHF\" | \"CHW\" | \"CLF\" | \"CLP\" | \"CNY\" | \"COP\" | \"COU\" | \"CRC\" | \"CUC\" | \"CUP\" | \"CVE\" | \"CZK\" | \"DJF\" | \"DKK\" | \"DOP\" | \"DZD\" | \"EGP\" | \"ERN\" | \"ETB\" | \"EUR\" | \"FJD\" | \"FKP\" | \"GBP\" | \"GEL\" | \"GHS\" | \"GIP\" | \"GMD\" | \"GNF\" | \"GTQ\" | \"GYD\" | \"HKD\" | \"HNL\" | \"HRK\" | \"HTG\" | \"HUF\" | \"IDR\" | \"ILS\" | \"INR\" | \"IQD\" | \"IRR\" | \"ISK\" | \"JMD\" | \"JOD\" | \"JPY\" | \"KES\" | \"KGS\" | \"KHR\" | \"KMF\" | \"KPW\" | \"KRW\" | \"KWD\" | \"KYD\" | \"KZT\" | \"LAK\" | \"LBP\" | \"LKR\" | \"LRD\" | \"LSL\" | \"LYD\" | \"MAD\" | \"MDL\" | \"MGA\" | \"MKD\" | \"MMK\" | \"MNT\" | \"MOP\" | \"MRU\" | \"MUR\" | \"MVR\" | \"MWK\" | \"MXN\" | \"MXV\" | \"MYR\" | \"MZN\" | \"NAD\" | \"NGN\" | \"NIO\" | \"NOK\" | \"NPR\" | \"NZD\" | \"OMR\" | \"PAB\" | \"PEN\" | \"PGK\" | \"PHP\" | \"PKR\" | \"PLN\" | \"PYG\" | \"QAR\" | \"RON\" | \"RSD\" | \"RUB\" | \"RWF\" | \"SAR\" | \"SBD\" | \"SCR\" | \"SDG\" | \"SEK\" | \"SGD\" | \"SHP\" | \"SLL\" | \"SOS\" | \"SRD\" | \"SSP\" | \"STN\" | \"SVC\" | \"SYP\" | \"SZL\" | \"THB\" | \"TJS\" | \"TMT\" | \"TND\" | \"TOP\" | \"TRY\" | \"TTD\" | \"TWD\" | \"TZS\" | \"UAH\" | \"UGX\" | \"USD\" | \"USN\" | \"UYI\" | \"UYU\" | \"UYW\" | \"UZS\" | \"VES\" | \"VND\" | \"VUV\" | \"WST\" | \"XAF\" | \"XAG\" | \"XAU\" | \"XBA\" | \"XBB\" | \"XBC\" | \"XBD\" | \"XCD\" | \"XDR\" | \"XOF\" | \"XPD\" | \"XPF\" | \"XPT\" | \"XSU\" | \"XTS\" | \"XUA\" | \"XXX\" | \"YER\" | \"ZAR\" | \"ZMW\" | \"ZWL\"",
        "references": {
          "Currency": {
            "location": "import",
            "path": "isoly"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      },
      "attribute": "currency",
      "reflect": false
    },
    "selected": {
      "type": "unknown",
      "mutable": true,
      "complexType": {
        "original": "PaymentInstallmentPlan",
        "resolved": "Plan | undefined",
        "references": {
          "PaymentInstallmentPlan": {
            "location": "import",
            "path": "../model"
          }
        }
      },
      "required": false,
      "optional": true,
      "docs": {
        "tags": [],
        "text": ""
      }
    }
  }; }
  static get states() { return {
    "t": {}
  }; }
  static get methods() { return {
    "getPayment": {
      "complexType": {
        "signature": "(order: Order | Omit<Order.Creatable, \"payment\">, apiKey: string) => Promise<PaymentInstallmentCreatable | undefined>",
        "parameters": [{
            "tags": [],
            "text": ""
          }, {
            "tags": [],
            "text": ""
          }],
        "references": {
          "Promise": {
            "location": "global"
          },
          "PaymentInstallmentCreatable": {
            "location": "import",
            "path": "../model"
          },
          "Order": {
            "location": "import",
            "path": "../model"
          },
          "Omit": {
            "location": "global"
          }
        },
        "return": "Promise<PaymentInstallmentCreatable | undefined>"
      },
      "docs": {
        "text": "",
        "tags": []
      }
    }
  }; }
  static get elementRef() { return "element"; }
  static get listeners() { return [{
      "name": "smoothlySelected",
      "method": "onSelected",
      "target": undefined,
      "capture": false,
      "passive": false
    }]; }
}
paymentDetailsAdd("installment", option => {
  const result = {
    type: "installment",
    name: "Installment Plan",
    brand: option.service,
    component: (h("ig-installment-details", { ref: e => (result.element = e), option: PaymentOptionInstallmentIs(option) ? option : undefined, currency: option.currency })),
  };
  return result;
});
