'use strict';

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

const index$1 = require('./index-140bcbcd.js');
require('./Item-00ce8c24.js');
const index$2 = require('./index-ac98852d.js');
require('./Credentials-8e4749ab.js');
require('./Token-8c5ba5d9.js');
const index = require('./index-d3079b93.js');
require('./_commonjsHelpers-537d719a.js');
require('./index-09251373.js');
require('./TextDecoder-753156f3.js');

const sv$1 = {
  details: "detaljer",
  "excluding VAT": "exklusive moms",
  Edit: "Redigera",
  Cancel: "Avbryt",
  Save: "Spara",
  "Paid from balance": "Betalat från saldo",
};

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

const styleCss$1 = ".sc-ig-item-h{display:block}[hidden].sc-ig-item-h{display:none}[editable].sc-ig-item-h{padding-right:1em}.sc-ig-item-h>form.sc-ig-item>ol.sc-ig-item{padding:0;margin:0}.sc-ig-item-h>form.sc-ig-item>ol.sc-ig-item>li.sc-ig-item{display:-ms-flexbox;display:flex;-ms-flex-align:stretch;align-items:stretch}.sc-ig-item-h>form.sc-ig-item>ol.sc-ig-item>li.sc-ig-item>*.sc-ig-item{white-space:nowrap}.sc-ig-item-h>form.sc-ig-item>ol.sc-ig-item>li.sc-ig-item>*.sc-ig-item:first-child{overflow:hidden;text-overflow:ellipsis}.sc-ig-item-h>form.sc-ig-item>ol.sc-ig-item>li.sc-ig-item>*.sc-ig-item:last-child{margin-left:auto}.sc-ig-item-h>form.sc-ig-item>smoothly-submit.sc-ig-item,.sc-ig-item-h>form.sc-ig-item>smoothly-icon.sc-ig-item,.sc-ig-item-h:hover>form.sc-ig-item>smoothly-popup.sc-ig-item{display:block;margin-right:-2em;float:right;cursor:pointer;border:none}.sc-ig-item-h>form.sc-ig-item>smoothly-popup.sc-ig-item{display:none}.sc-ig-item-h>form.sc-ig-item>smoothly-submit.sc-ig-item{margin-right:-4em;margin-top:0.6em}.sc-ig-item-h>form.sc-ig-item>smoothly-icon.sc-ig-item{margin-top:0.9em}.sc-ig-item-h>form.sc-ig-item>ol.sc-ig-item>li.sc-ig-item>smoothly-input.sc-ig-item:nth-of-type(3){-ms-flex-positive:2;flex-grow:2;width:50%}.sc-ig-item-h>form.sc-ig-item>ol.sc-ig-item>li.sc-ig-item>smoothly-input.sc-ig-item:nth-of-type(1),.sc-ig-item-h>ol.sc-ig-item>li.sc-ig-item>smoothly-input.sc-ig-item:nth-of-type(2){-ms-flex-positive:1;flex-grow:1;width:20%}";

const IntergiroItem = class {
  constructor(hostRef) {
    index$1.registerInstance(this, hostRef);
    this.edit = index$1.createEvent(this, "edit", 7);
    this.mode = "display";
    this.editable = false;
  }
  componentWillLoad() {
    this.t = create$1(this.element);
  }
  update(e) {
    if (index$2.Item.is(this.item)) {
      const updated = {
        quantity: Number(e.detail.quantity),
        unit: e.detail.unit,
        name: e.detail.name,
        price: Number(e.detail.price.slice(0, -4)),
        vat: Number(e.detail.vat),
      };
      this.item = Object.assign(Object.assign({}, this.item), updated);
    }
    else
      this.item = e.detail.price;
    this.edit.emit(this.item);
    this.mode = "display";
  }
  render() {
    var _a;
    return (index$1.h("form", null, this.mode == "display" && this.editable ? (index$1.h("smoothly-popup", null, index$1.h("smoothly-icon", { name: "ellipsis-vertical-outline", size: "small" }), index$1.h("div", { color: "light", slot: "popup" }, index$1.h("smoothly-icon", { size: "small", name: "pencil-outline", toolTip: this.t("Edit"), onClick: () => (this.mode = "edit") })))) : this.mode == "edit" ? ([
      index$1.h("smoothly-icon", { name: "close-circle", toolTip: this.t("Cancel"), fill: "clear", size: "small", color: "medium", onClick: () => (this.mode = "display") }),
      index$1.h("smoothly-submit", { prevent: true, onSubmit: (e) => this.update(e) }, index$1.h("smoothly-icon", { name: "checkmark-circle", toolTip: this.t("Save"), fill: "clear", size: "small", color: "success" })),
    ]) : ([]), index$1.h("ol", null, index$1.h("li", null, index$2.Item.is(this.item) ? (this.mode == "display" ? ([
      index$1.h("span", null, this.item.quantity, " ", this.item.unit, " ", this.t((_a = this.item.name) !== null && _a !== void 0 ? _a : "")),
      index$1.h("smoothly-display", { type: "price", value: index$2.Item.amount(this.item), currency: this.currency }),
    ]) : ([
      index$1.h("smoothly-input", { type: "price", name: "quantity", value: this.item.quantity }, this.t("Quantity")),
      index$1.h("smoothly-input", { type: "text", name: "unit", value: this.item.unit }, this.t("Unit")),
      index$1.h("smoothly-input", { type: "text", name: "name", value: this.item.name }, this.t("Name")),
      index$1.h("smoothly-input", { type: "price", name: "vat", value: this.item.vat }, this.t("VAT")),
      index$1.h("smoothly-input", { type: "price", name: "price", value: this.item.price, currency: this.currency }, this.t("Price")),
    ])) : this.mode == "display" ? (index$1.h("smoothly-display", { type: "price", value: index$2.Item.amount(this.item), currency: this.currency })) : (index$1.h("smoothly-input", { type: "price", name: "price", value: this.item, currency: this.currency }, this.t("Price")))))));
  }
  get element() { return index$1.getElement(this); }
};
IntergiroItem.style = styleCss$1;

const sv = {
  Total: "Totalt",
  VAT: "moms",
  Quantity: "Antal",
  Name: "Namn",
  Unit: "Enhet",
  Price: "Pris",
};

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

const styleCss = ".sc-ig-items-list-h{display:block}[hidden].sc-ig-items-list-h{display:none}.sc-ig-items-list-h>li.sc-ig-items-list{display:-ms-flexbox;display:flex;-ms-flex-align:stretch;align-items:stretch}.sc-ig-items-list-h>li.sc-ig-items-list>*.sc-ig-items-list:first-child{overflow:hidden;text-overflow:ellipsis}.sc-ig-items-list-h>li.sc-ig-items-list>*.sc-ig-items-list:last-child{margin-left:auto}.sc-ig-items-list-h>li.total.sc-ig-items-list{border-top:solid 1px rgb(var(--smoothly-color-contrast));margin-top:0.2em;padding-top:0.2em;font-weight:600}.sc-ig-items-list-h>li.vat.sc-ig-items-list{font-size:85%}[editable].sc-ig-items-list-h>li.total.sc-ig-items-list,[editable].sc-ig-items-list-h>li.vat.sc-ig-items-list{margin-right:1em}";

const IntergiroItemsList = class {
  constructor(hostRef) {
    index$1.registerInstance(this, hostRef);
    this.changed = index$1.createEvent(this, "changed", 7);
    this.editable = false;
  }
  componentWillLoad() {
    this.t = create(this.element);
  }
  edited(e, index) {
    const items = this.items;
    if (index && Array.isArray(items)) {
      items[index] = e.detail;
      this.items = [...items];
    }
    else
      this.items = e.detail;
    this.changed.emit(this.items);
  }
  render() {
    const t = this.t;
    const vat = index$2.Item.vat(this.items);
    return [
      Array.isArray(this.items) ? (this.items.map((item, index) => (index$1.h("ig-item", { onEdit: (e) => this.edited(e, index), editable: this.editable, item: item, currency: this.currency })))) : (index$1.h("ig-item", { onEdit: (e) => this.edited(e), editable: this.editable, item: this.items, currency: this.currency })),
      index$1.h("li", { class: "total" }, index$1.h("span", null, t("Total")), index$1.h("smoothly-display", { type: "price", value: index$2.Item.amount(this.items), currency: this.currency })),
      vat != undefined ? (index$1.h("li", { class: "vat" }, index$1.h("span", null, t("VAT")), index$1.h("smoothly-display", { type: "price", value: vat, currency: this.currency }))) : (""),
    ];
  }
  get element() { return index$1.getElement(this); }
};
IntergiroItemsList.style = styleCss;

exports.ig_item = IntergiroItem;
exports.ig_items_list = IntergiroItemsList;
