'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index$1 = require('./index-0b1e2673.js');
require('./_commonjsHelpers-937cd5b3.js');
const index$2 = require('./index-2eb96242.js');
const index = require('./index-36cf3884.js');

const sv = {
  Add: "Lägg till",
};

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

const styleCss = ".sc-payfunc-phone-numbers-h{display:block}smoothly-icon.sc-payfunc-phone-numbers{cursor:pointer;float:right;margin-top:-1.5em;padding-bottom:.5em;visibility:hidden}payfunc-phone-number.sc-payfunc-phone-numbers{clear:both}.sc-payfunc-phone-numbers-h:hover smoothly-icon.sc-payfunc-phone-numbers{visibility:visible}";

const PayfuncPhoneNumbers = class {
  constructor(hostRef) {
    index$1.registerInstance(this, hostRef);
    this.changed = index$1.createEvent(this, "changed", 7);
    this.editable = true;
    this.adding = false;
  }
  componentWillLoad() {
    this.t = create(this.element);
  }
  get types() {
    return index$2.PhoneNumbers.types.filter(type => index$2.PhoneNumbers.is(this.value) ? !this.value[type] : this.value ? type != "primary" : type);
  }
  get phoneNumbers() {
    return index$2.PhoneNumbers.is(this.value) ? Object.assign({}, this.value) : { primary: this.value };
  }
  onEdit(e) {
    const type = e.detail.type;
    delete e.detail.type;
    let result;
    if (!index$2.PhoneNumbers.is(this.value))
      result = e.detail.value;
    else {
      result = Object.assign({}, this.value);
      result[type] = e.detail.value;
    }
    this.changed.emit((this.value = result));
  }
  onDelete(e) {
    const type = e.detail;
    const result = Object.assign({}, this.phoneNumbers);
    delete result[type];
    this.changed.emit((this.value = result));
  }
  onAdd(e) {
    const type = e.detail.type;
    const value = e.detail.value;
    const result = this.phoneNumbers;
    result[type] = value;
    this.changed.emit((this.value = result));
    this.adding = false;
  }
  render() {
    return [
      this.adding ? (index$1.h("payfunc-phone-number-input", { onEdit: (e) => (this.adding = false), types: this.types, mode: "add", onAdd: (e) => this.onAdd(e) })) : ([]),
      this.editable && this.types.length > 0 ? (index$1.h("smoothly-icon", { name: "add-circle", toolTip: this.t("Add"), fill: "clear", size: "medium", color: "success", style: this.adding ? { display: "none" } : {}, onClick: () => (this.adding = true) })) : ([]),
      this.phoneNumbers ? (index$2.PhoneNumbers.is(this.value) ? (index$2.PhoneNumbers.map(this.value, (type, value) => [
        index$1.h("payfunc-phone-number", { value: value, type: type, editable: this.editable, onEdit: (e) => this.onEdit(e), onDelete: (e) => this.onDelete(e) }),
      ])) : (index$1.h("payfunc-phone-number", { value: this.value, editable: this.editable, onEdit: (e) => this.onEdit(e), onDelete: (e) => this.onDelete(e) }))) : ([]),
    ];
  }
  get element() { return index$1.getElement(this); }
};
PayfuncPhoneNumbers.style = styleCss;

exports.payfunc_phone_numbers = PayfuncPhoneNumbers;
