import { r as registerInstance, h, g as getElement } from './index-aeac5cad.js';
import './_commonjsHelpers-91fffb88.js';
import { d as dist } from './index-fdd60c34.js';
import { d as dist$1 } from './index-31b724c4.js';

const sv = {
  "Upcoming payments": "Kommande betalningar",
};

function create(language) {
  return dist.create({
    sv,
  }, language);
}

const styleCss = ".sc-payfunc-future-due-dates-h{display:block}[hidden].sc-payfunc-future-due-dates-h{display:none}.sc-payfunc-future-due-dates-h>table.sc-payfunc-future-due-dates{border:1px solid rgb(var(--smoothly-medium-color));width:100%;height:100%}tr.sc-payfunc-future-due-dates:first-of-type{border-bottom:1px solid rgb(var(--smoothly-medium-color));font-weight:bold}td.sc-payfunc-future-due-dates{padding:.3em}";

const PayfuncFutureDueDates = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
  }
  componentWillLoad() {
    this.t = create(this.element);
  }
  render() {
    return [
      h("table", null, h("tr", { color: "light" }, h("td", null, this.t("Upcoming payments"))), this.dates
        ? this.dates.map(date => (h("tr", null, h("td", null, dist$1.DateTime.localize(dist$1.DateTime.parse(date)).slice(0, 10)))))
        : []),
    ];
  }
  get element() { return getElement(this); }
};
PayfuncFutureDueDates.style = styleCss;

export { PayfuncFutureDueDates as payfunc_future_due_dates };
