import { Component, Element, h, Prop, State } from "@stencil/core";
import * as translation from "./translation";
export class PayfuncLimit {
  componentWillLoad() {
    this.t = translation.create(this.element);
  }
  render() {
    const limit = typeof this.account.limit == "number" ? this.account.limit : undefined;
    const hard = typeof this.account.limit == "object" && this.account.limit.hard ? this.account.limit.hard : undefined;
    const soft = typeof this.account.limit == "object" && this.account.limit.soft ? this.account.limit.soft : undefined;
    const margin = typeof this.account.limit == "object" && this.account.limit.margin ? this.account.limit.margin : undefined;
    return limit ? (h("section", null,
      h("label", null, this.t("Credit limit")),
      h("smoothly-display", null, limit + " " + this.account.currency))) : ([
      hard && (h("section", null,
        h("label", null, this.t("Credit limit")),
        h("smoothly-display", null, hard + " " + this.account.currency))),
      soft && (h("section", null,
        h("label", null, this.t("Soft limit")),
        h("smoothly-display", null, soft + " " + this.account.currency),
        h("span", null, this.t("Automatic charge limit.")))),
      margin && (h("section", null,
        h("label", null, this.t("Margin")),
        h("smoothly-display", null, margin + " " + this.account.currency),
        h("span", null, this.t("Automatic charge margin.")))),
    ]);
  }
  static get is() { return "payfunc-limit"; }
  static get encapsulation() { return "scoped"; }
  static get originalStyleUrls() { return {
    "$": ["style.css"]
  }; }
  static get styleUrls() { return {
    "$": ["style.css"]
  }; }
  static get properties() { return {
    "account": {
      "type": "unknown",
      "mutable": false,
      "complexType": {
        "original": "Account",
        "resolved": "Account",
        "references": {
          "Account": {
            "location": "import",
            "path": "@payfunc/model"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [],
        "text": ""
      }
    }
  }; }
  static get states() { return {
    "t": {}
  }; }
  static get elementRef() { return "element"; }
}
