hemfixarna-web-components 1.8.5 → 1.8.7

package/dist/cjs/hemfixarna-address_15.cjs.entry.js

@@ -0,0 +1,2180 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-e6926623.js');
+const index$1 = require('./index-6cce99a1.js');
+const index$2 = require('./index-dc8e80e4.js');
+
+const hideField = (field) => {
+  return field.split(' ').reduce((acc, curr) => {
+    if (curr.length <= 2) {
+      return acc + curr.slice(0, 1) + '* ';
+    }
+    else {
+      return acc + curr.slice(0, 1) + '*'.repeat(curr.length - 2) + curr.slice(-1) + ' ';
+    }
+  }, '');
+};
+
+const scrollToTop = (el) => {
+  if (!el)
+    return;
+  el.scrollTo({
+    top: 0,
+    behavior: 'smooth',
+  });
+};
+
+const HemfixarnaAddress = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.handleSubmit = (e) => {
+      e.preventDefault();
+      const streetValid = this.street.length > 0;
+      if (!streetValid) {
+        this.streetError = 'Ange en gatuadress';
+      }
+      const zipValid = this.zip.length > 0;
+      const zipIsNumber = /^\s*\d[\d\s]*$/.test(this.zip);
+      if (!zipIsNumber) {
+        this.zipError = 'Postnummer får endast innehålla siffror';
+      }
+      if (!zipValid) {
+        this.zipError = 'Ange ett postnummer';
+      }
+      const townValid = /^[^\d\s]{2,}$/.test(this.town);
+      if (!townValid) {
+        this.townError = 'Ange en ort';
+      }
+      if (streetValid && zipValid && townValid && zipIsNumber) {
+        index$1.state.user = Object.assign(Object.assign({}, index$1.state.user), { street: this.street, zip: this.zip, town: this.town });
+        index$1.state.checkoutStep = 2;
+        index$1.state.checkoutEdit = false;
+        const el = this.el.closest('.hemfixarna_content');
+        scrollToTop(el);
+      }
+    };
+    this.handleChangeStreet = (e) => {
+      this.streetError = null;
+      this.street = this.street === index$1.state.user.street ? '' : e.target.value;
+    };
+    this.handleChangeZip = (e) => {
+      this.zipError = null;
+      this.zip = this.zip === index$1.state.user.zip ? '' : e.target.value;
+    };
+    this.handleChangeTown = (e) => {
+      this.townError = null;
+      this.town = this.town === index$1.state.user.town ? '' : e.target.value;
+    };
+    this.render = () => {
+      return (index.h("form", { class: "hemfixarna_address", onSubmit: e => this.handleSubmit(e) }, index.h("div", null, index.h("input", { class: `${this.street.length ? 'input_active' : ''}`, onInput: this.handleChangeStreet, type: "text", name: "street", value: this.street === index$1.state.user.street ? hideField(this.street) : this.street }), index.h("label", { htmlFor: "street" }, "Gatuaddress ")), this.streetError && index.h("span", null, this.streetError), index.h("div", null, index.h("input", { class: `${this.zip.length ? 'input_active' : ''}`, onInput: this.handleChangeZip, type: "tel", name: "zip", value: this.zip === index$1.state.user.zip ? hideField(this.zip) : this.zip }), index.h("label", { htmlFor: "zip" }, "Postnummer ")), this.zipError && index.h("span", null, this.zipError), index.h("div", null, index.h("input", { class: `${this.town.length ? 'input_active' : ''}`, onInput: this.handleChangeTown, type: "text", name: "town", value: this.town === index$1.state.user.town ? hideField(this.town) : this.town }), index.h("label", { htmlFor: "town" }, "Ort ")), this.townError && index.h("span", null, this.townError), index.h("input", { type: "submit", value: "Forts\u00E4tt" })));
+    };
+    this.street = '';
+    this.streetError = null;
+    this.zip = '';
+    this.zipError = null;
+    this.town = '';
+    this.townError = null;
+  }
+  componentWillLoad() {
+    if (index$1.state.user) {
+      this.street = index$1.state.user.street;
+      this.zip = index$1.state.user.zip;
+      this.town = index$1.state.user.town;
+    }
+  }
+  get el() { return index.getElement(this); }
+};
+
+const getRutPrice = (price) => {
+  return Math.ceil(price / 2);
+};
+const getRotPrice = (price) => {
+  return Math.ceil(price / 2);
+};
+const getGreenPrice = (price) => {
+  return Math.ceil(price * 0.5);
+};
+const getProductPrice = (product, price, amount = 1) => {
+  if (product.rot && index$1.state.rot) {
+    return getRotPrice((price || product.price) * amount);
+  }
+  else if (product.rut && index$1.state.rut) {
+    return getRutPrice((price || product.price) * amount);
+  }
+  else if (product.green && index$1.state.green) {
+    return getGreenPrice((price || product.price) * amount);
+  }
+  else {
+    return (price || product.price) * amount;
+  }
+};
+const getProductPriceWithRotAndRut = (product) => {
+  if (product.rot) {
+    return getRotPrice(product.price);
+  }
+  else if (product.rut && index$1.state.rut) {
+    return getRutPrice(product.price);
+  }
+  else {
+    return product.price;
+  }
+};
+const getPartPrice = (part, product, amount = 1) => {
+  if (product.rot && index$1.state.rot) {
+    return getRotPrice(part.price * amount);
+  }
+  else if (product.rut && index$1.state.rut) {
+    return getRutPrice(part.price * amount);
+  }
+  else if (product.green && index$1.state.green) {
+    return getGreenPrice(part.price * amount);
+  }
+  else {
+    return part.price * amount;
+  }
+};
+const groupCartItemsByStartFee = (cart) => {
+  return cart.reduce((groups, item) => {
+    var _a;
+    const startFeeID = ((_a = item.start_fee_obj) === null || _a === void 0 ? void 0 : _a.ID) || null;
+    if (!groups[startFeeID]) {
+      groups[startFeeID] = [];
+    }
+    groups[startFeeID].push(item);
+    return groups;
+  }, {});
+};
+const calculateStartFee = (cart = index$1.state.cart) => {
+  const uniqueStartFees = new Set();
+  let totalRut = 0;
+  let totalRot = 0;
+  let totalGreen = 0;
+  let totalDefault = 0;
+  cart.forEach(item => {
+    const startFee = item.start_fee_obj;
+    if (startFee && !uniqueStartFees.has(startFee.ID)) {
+      uniqueStartFees.add(startFee.ID);
+      if (item.rut) {
+        totalRut += index$1.state.rut ? getRutPrice(startFee.price) : startFee.price;
+      }
+      if (item.rot) {
+        totalRot += index$1.state.rot ? getRotPrice(startFee.price) : startFee.price;
+      }
+      if (item.green) {
+        totalGreen += index$1.state.green ? getGreenPrice(startFee.price) : startFee.price;
+      }
+      if (!item.rut && !item.rot && !item.green) {
+        totalDefault += startFee.price;
+      }
+    }
+  });
+  const appliedDiscounts = [totalRut > 0, totalRot > 0, totalGreen > 0];
+  return {
+    rut: totalRut,
+    rot: totalRot,
+    green: totalGreen,
+    default: totalDefault,
+    length: appliedDiscounts.filter(Boolean).length,
+  };
+};
+const getItemPrice = (item) => {
+  const partsPrice = item.parts.reduce((acc, curr) => {
+    return acc + curr.price * curr.amount;
+  }, 0);
+  return getProductPrice(item, item.price * item.amount + partsPrice);
+};
+const calculateRot = () => {
+  const totalWithRot = index$1.state.cart.reduce((acc, curr) => {
+    return curr.rot ? acc + getItemPrice(curr) : acc;
+  }, 0) + (index$1.state.cart.some(item => item.rot) ? calculateStartFee().rot : 0);
+  const totalWithoutRot = index$1.state.cart.reduce((acc, curr) => {
+    var _a;
+    const partsPrice = curr.parts.reduce((acc, part) => {
+      return acc + part.price * part.amount;
+    }, 0);
+    const startFee = ((_a = curr.start_fee_obj) === null || _a === void 0 ? void 0 : _a.price) || 0;
+    if (curr.rot) {
+      if (!acc.startFeeApplied) {
+        acc.startFeeApplied = true;
+        acc.amount += curr.price * curr.amount + partsPrice + startFee;
+      }
+      else {
+        acc.amount += curr.price * curr.amount + partsPrice;
+      }
+    }
+    return acc;
+  }, { amount: 0, startFeeApplied: false }).amount;
+  return totalWithoutRot - totalWithRot;
+};
+const calculateGreenDiscount = () => {
+  const totalWithGreen = index$1.state.cart.reduce((acc, curr) => {
+    return curr.green ? acc + getItemPrice(curr) : acc;
+  }, 0) + (index$1.state.cart.some(item => item.green) ? calculateStartFee().green : 0);
+  const totalWithoutGreen = index$1.state.cart.reduce((acc, curr) => {
+    var _a;
+    const partsPrice = curr.parts.reduce((acc, part) => {
+      return acc + part.price * part.amount;
+    }, 0);
+    const startFee = ((_a = curr.start_fee_obj) === null || _a === void 0 ? void 0 : _a.price) || 0;
+    if (curr.green) {
+      if (!acc.startFeeApplied) {
+        acc.startFeeApplied = true;
+        acc.amount += curr.price * curr.amount + partsPrice + startFee;
+      }
+      else {
+        acc.amount += curr.price * curr.amount + partsPrice;
+      }
+    }
+    return acc;
+  }, { amount: 0, startFeeApplied: false }).amount;
+  return totalWithoutGreen - totalWithGreen;
+};
+const calculateRut = () => {
+  const totalWithRut = index$1.state.cart.reduce((acc, curr) => {
+    return curr.rut ? acc + getItemPrice(curr) : acc;
+  }, 0) + (index$1.state.cart.some(item => item.rut) ? calculateStartFee().rut : 0);
+  const totalWithoutRut = index$1.state.cart.reduce((acc, curr) => {
+    var _a;
+    const partsPrice = curr.parts.reduce((acc, part) => {
+      return acc + part.price * part.amount;
+    }, 0);
+    const startFee = ((_a = curr.start_fee_obj) === null || _a === void 0 ? void 0 : _a.price) || 0;
+    if (curr.rut) {
+      if (!acc.startFeeApplied) {
+        acc.startFeeApplied = true;
+        acc.amount += curr.price * curr.amount + partsPrice + startFee;
+      }
+      else {
+        acc.amount += curr.price * curr.amount + partsPrice;
+      }
+    }
+    return acc;
+  }, { amount: 0, startFeeApplied: false }).amount;
+  return totalWithoutRut - totalWithRut;
+};
+const getTotalPrice = () => {
+  return index$1.state.cart.reduce((acc, curr) => acc + getItemPrice(curr), 0) + calculateStartFee().rot + calculateStartFee().rut + calculateStartFee().green + calculateStartFee().default;
+};
+
+const isProduct = (category) => {
+  return category.post_name !== undefined;
+};
+const isBusiness = (partner) => {
+  return Object.values(index$2.Business).includes(partner);
+};
+
+const HemfixarnaBox = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.post = undefined;
+    this.category = undefined;
+    this.icon = undefined;
+    this.postTitle = undefined;
+  }
+  setTaxonomy(taxonomy) {
+    if (taxonomy) {
+      if ((taxonomy === null || taxonomy === void 0 ? void 0 : taxonomy.taxonomy) === 'service_cat') {
+        index$1.state.selectedCategory = taxonomy;
+        index$1.state.step = 2;
+      }
+      else if ((taxonomy === null || taxonomy === void 0 ? void 0 : taxonomy.post_type) === 'service') {
+        index$1.state.selectedService = taxonomy;
+        index$1.state.step = 3;
+      }
+      else if ((taxonomy === null || taxonomy === void 0 ? void 0 : taxonomy.post_type) === 'ikea_product') {
+        index$1.state.selectedProduct = taxonomy;
+        index$1.state.step = 4;
+      }
+      const el = this.el.closest('.hemfixarna_content');
+      scrollToTop(el);
+    }
+  }
+  setProduct() {
+    index$1.state.selectedProduct = this.category;
+    index$1.state.step = 4;
+    index$1.state.selectedCustomerCategory = null;
+    const el = this.el.closest('.hemfixarna_content');
+    scrollToTop(el);
+  }
+  render() {
+    return this.category ? (index.h(index.Fragment, null, isProduct(this.category) ? (index.h("li", { onClick: () => this.setProduct() }, index.h("img", { class: "hemfixarna_logo", height: 82, src: this.category.icon, alt: this.category.post_name }), index.h("div", null, index.h("p", null, this.category.title), !this.category.invoice ? index.h("p", { class: "price" }, "Fr\u00E5n ", getProductPrice(this.category), "kr") : null))) : (index.h("li", { onClick: () => (index$1.state.selectedCustomerCategory = this.category) }, index.h("img", { class: "hemfixarna_logo", height: 82, src: this.category.icon, alt: this.category.name }), index.h("div", null, index.h("p", null, this.category.name)))))) : (index.h("li", { onClick: () => this.setTaxonomy(this.post) }, this.post.icon && index.h("img", { class: "hemfixarna_logo", height: 82, src: this.icon, alt: this.postTitle }), index.h("div", null, index.h("p", null, this.postTitle), index$1.state.step === 3 && index.h("p", { class: "price" }, "Fr\u00E5n ", getProductPrice(this.post), "kr"))));
+  }
+  get el() { return index.getElement(this); }
+};
+
+const HemfixarnaBreadcrumbs = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.triggerScrollTotop = () => {
+      const el = this.el.nextSibling;
+      scrollToTop(el);
+    };
+    this.closeModal = undefined;
+  }
+  getCartLength() {
+    return index$1.state.cart.reduce((acc, curr) => acc + curr.amount, 0);
+  }
+  handleCartClick() {
+    var _a;
+    if ((_a = index$1.state.cart) === null || _a === void 0 ? void 0 : _a.length) {
+      index$1.state.step = 5;
+      this.triggerScrollTotop();
+    }
+  }
+  handleHomePageClick() {
+    index$1.state.step = 1;
+    index$1.state.parentCategory = null;
+    index$1.state.selectedCustomerCategory = null;
+    this.triggerScrollTotop();
+    setTimeout(() => {
+      index$1.state.selectedCategory = null;
+      index$1.state.selectedProduct = null;
+      index$1.state.maleri = null;
+      index$1.state.selectedService = null;
+    }, 200);
+  }
+  render() {
+    const logo = index.getAssetPath(`./assets/hemfixarna.svg`);
+    const close = index.getAssetPath(`./assets/close.svg`);
+    const cart = index.getAssetPath(`./assets/cart.svg`);
+    const back = index.getAssetPath(`./assets/back.svg`);
+    return (index.h("div", null, index.h("div", { class: "hemfixarna_crumbs" }, index.h("div", { class: "hemfixarna_crumbs--links" }, index.h("img", { onClick: () => this.handleHomePageClick(), src: logo, width: 110 }), index.h("img", { onClick: () => this.closeModal(), class: "close", src: close, width: 32 }), index.h("div", null, index.h("button", { onClick: () => this.handleHomePageClick() }, "Alla tj\u00E4nster"))), index.h("div", { class: "hemfixarna_crumbs--right" }, index.h("hemfixarna-contact", null), index.h("div", { onClick: () => this.handleCartClick(), class: `cart ${this.getCartLength() > 0 ? 'cart_active' : ''}` }, index.h("img", { src: cart, width: 24 }), index.h("span", null, this.getCartLength())))), [3, 4].includes(index$1.state.step) && !index$1.state.customer && (index.h("button", { class: "hemfixarna_crumbs--back", onClick: () => {
+        index$1.state.step = index$1.state.step === 4 ? 3 : 2;
+      } }, index.h("img", { width: 24, src: back, alt: "back arrow" }), index.h("span", null, "Se allt ", index$1.state.step === 4 ? index$1.state.selectedService.post_title : index$1.state.selectedCategory.name))), !index$1.state.parentCategory && index$1.state.step && index$1.state.selectedCustomerCategory && (index.h("button", { class: "hemfixarna_crumbs--back", onClick: () => {
+        index$1.state.step = 1;
+        index$1.state.selectedCustomerCategory = null;
+        index$1.state.selectedProduct = null;
+        index$1.state.maleri = null;
+      } }, index.h("img", { width: 24, src: back, alt: "back arrow" }), index.h("span", null, "Se alla tj\u00E4nster"))), index$1.state.parentCategory && index$1.state.step < 5 && (index.h("button", { class: "hemfixarna_crumbs--back", onClick: () => {
+        index$1.state.step = 1;
+        index$1.state.selectedCustomerCategory = index$1.state.parentCategory;
+        index$1.state.selectedProduct = null;
+        index$1.state.maleri = null;
+      } }, index.h("img", { width: 24, src: back, alt: "back arrow" }), index.h("span", null, "Se allt ", index$1.state.parentCategory.name)))));
+  }
+  get el() { return index.getElement(this); }
+};
+
+const HemfixarnaCart = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+  }
+  render() {
+    const back = index.getAssetPath(`./assets/back.svg`);
+    return (index.h("div", { class: "hemfixarna_cart" }, index.h("div", { class: "hemfixarna_cart--left" }, index.h("h2", null, index$1.state.checkoutStep === 2 && !index$1.state.checkoutEdit && (index.h("button", { onClick: () => {
+        index$1.state.checkoutStep = 1;
+      } }, index.h("img", { width: 24, src: back, alt: "back arrow" }))), "Din bokning"), index.h("hemfixarna-orderrows", null)), index.h("div", { class: "hemfixarna_cart--right" }, index.h("h2", null, index$1.state.checkoutStep === 2 && !index$1.state.checkoutEdit && (index.h("button", { onClick: () => {
+        index$1.state.checkoutStep = 1;
+      } }, index.h("img", { width: 24, src: back, alt: "back arrow" }))), "Dina uppgifter"), index.h("hemfixarna-checkout", null), index.h("hemfixarna-info", null))));
+  }
+};
+
+const livePreviewUrl = 'hemfixarna-partner.vercel.app';
+const getDefaultApiUrl = () => {
+  if (window.location.href.includes('vercel.app') && !window.location.href.includes(livePreviewUrl)) {
+    return 'https://hemfixare.dev.afonso.se';
+  }
+  else {
+    return 'https://hemfixarna.se';
+  }
+};
+const getApiUrl = () => {
+  if (typeof process !== 'undefined' && process.env && "https://hemfixare.dev.afonso.se") {
+    return "https://hemfixare.dev.afonso.se";
+  }
+  return getDefaultApiUrl();
+};
+const getDefaultCreditSafeApiUrl = () => {
+  if (window.location.href.includes('vercel.app')) {
+    return 'https://hemfixare-lookup-dev.vercel.app/api';
+  }
+  else {
+    return 'https://hemfixare-lookup.vercel.app/api';
+  }
+};
+const getCreditSafeApiUrl = () => {
+  if (typeof process !== 'undefined' && process.env && "https://hemfixare-lookup-dev.vercel.app/api") {
+    return "https://hemfixare-lookup-dev.vercel.app/api";
+  }
+  return getDefaultCreditSafeApiUrl();
+};
+
+const base$2 = `${getApiUrl()}/wp-json/headless`;
+async function fetchWithType(request, options) {
+  const response = await fetch(request, options);
+  const body = await response.json();
+  return body;
+}
+const getCustomer = async (slug) => {
+  try {
+    const res = await fetch(`${base$2}/customer/${slug}`);
+    return await res.json();
+  }
+  catch (error) {
+    console.log(error);
+  }
+};
+const loginCustomer = async ({ id, password }) => {
+  try {
+    const res = await fetch(`${base$2}/customer/login`, {
+      method: 'POST',
+      body: JSON.stringify({ id, password }),
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    });
+    return res.status;
+  }
+  catch (error) {
+    console.log(error);
+  }
+};
+const getOptions = async () => {
+  try {
+    const res = await fetch(`${base$2}/webcoptions`);
+    return (await res.json());
+  }
+  catch (error) {
+    console.log(error);
+  }
+};
+const getRut = async () => {
+  try {
+    const data = await fetchWithType(`${base$2}/rut`);
+    return data;
+  }
+  catch (error) {
+    console.log(error);
+  }
+};
+const getRot = async () => {
+  try {
+    const res = await fetch(`${base$2}/rot`);
+    return (await res.json());
+  }
+  catch (error) {
+    console.log(error);
+  }
+};
+const getGreenDiscount = async () => {
+  try {
+    const res = await fetch(`${base$2}/green-discount`);
+    return await res.json();
+  }
+  catch (error) {
+    console.log(error);
+  }
+};
+const postOrder = async (data) => {
+  try {
+    const res = await fetch(`${base$2}/weborder`, {
+      method: 'POST',
+      body: JSON.stringify(data),
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    });
+    return (await res.json());
+  }
+  catch (error) {
+    console.log(error);
+  }
+};
+
+const base$1 = `${getApiUrl()}/wp-json/felix`;
+const postPerson = async (felixOrder) => {
+  try {
+    return await fetchWithType(`${base$1}/createperson`, {
+      method: 'POST',
+      body: JSON.stringify(felixOrder),
+      headers: {
+        'Content-Type': 'application/json',
+      },
+    });
+  }
+  catch (error) {
+    console.log(error);
+  }
+};
+
+const HemfixarnaCheckout = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.handleChangeDate = (e) => {
+      this.dateError = null;
+      this.date = e.target.value;
+    };
+    this.handleChangeTerms = () => {
+      this.generalError = null;
+    };
+    this.sendOrder = async () => {
+      var _a, _b, _c, _d;
+      if (this.loading)
+        return;
+      this.loading = true;
+      const startFees = index$1.state.cart
+        .filter(item => item.start_fee_obj)
+        .map(item => {
+        var _a, _b, _c;
+        return ({
+          ID: (_a = item.start_fee_obj) === null || _a === void 0 ? void 0 : _a.ID,
+          title: (_b = item.start_fee_obj) === null || _b === void 0 ? void 0 : _b.title,
+          price: (_c = item.start_fee_obj) === null || _c === void 0 ? void 0 : _c.price,
+          rut: item.rut ? 1 : 0,
+          rot: item.rot ? 1 : 0,
+          green: item.green ? 1 : 0,
+        });
+      });
+      let order = {
+        firstName: index$1.state.creditSafeUser.firstName,
+        lastName: index$1.state.creditSafeUser.lastName,
+        street: index$1.state.user.street,
+        zip: index$1.state.user.zip,
+        town: index$1.state.user.town,
+        ssn: index$1.state.user.ssn,
+        email: index$1.state.user.email,
+        phone: index$1.state.user.phone,
+        url: `${index$1.state.business === index$2.Business.string ? 'string' : index$1.state.business}-webk`,
+        date: this.date,
+        products: [
+          ...index$1.state.cart.map(item => {
+            const parts = item.parts.map(part => ({
+              id: String(part.id),
+              name: part.name,
+              quantity: part.amount,
+              rut: 0,
+              rot: 0,
+              start_fee_id: item.start_fee_obj ? item.start_fee_obj.ID : null,
+            }));
+            return [
+              {
+                id: String(item.id),
+                name: item.name,
+                quantity: item.amount,
+                rot: item.rot ? 1 : 0,
+                rut: item.rut ? 1 : 0,
+                start_fee_id: item.start_fee_obj ? item.start_fee_obj.ID : null,
+              },
+              ...parts,
+            ];
+          }),
+        ].flat(),
+        start_fees: startFees,
+        creditSafe: index$1.state.creditSafeUser,
+        customer: index$1.state.business,
+        id_source: index$1.state.customer.source ? index$1.state.customer.source.fieldData.So01_Name : '',
+        id_sub_source: this.selectedSubSource ? this.selectedSubSource : '',
+        seller_id: (_a = this.sellerID) !== null && _a !== void 0 ? _a : '',
+        referral_id: (_b = this.RefferalID) !== null && _b !== void 0 ? _b : '',
+      };
+      const felixOrder = await postPerson(order);
+      if (!felixOrder || !((_d = (_c = felixOrder.response) === null || _c === void 0 ? void 0 : _c.scriptResult) === null || _d === void 0 ? void 0 : _d.includes('OK'))) {
+        order = Object.assign(Object.assign({}, order), { felixStatus: 'error' });
+      }
+      else {
+        order = Object.assign(Object.assign({}, order), { felixStatus: 'success' });
+      }
+      try {
+        const { data: orderConfirm, status } = await postOrder(order);
+        if (orderConfirm && status && status === 200) {
+          index$1.state.step = 6;
+          const el = this.el.closest('.hemfixarna_content');
+          scrollToTop(el);
+        }
+        else {
+          this.generalError = 'Något gick fel, försök igen senare';
+        }
+      }
+      catch (error) {
+        this.generalError = 'Något gick fel, försök igen senare';
+      }
+      this.loading = false;
+    };
+    this.handleSubmit = (e) => {
+      var _a;
+      e.preventDefault();
+      this.generalError = null;
+      const validDate = this.date.length > 0;
+      if (!validDate) {
+        this.dateError = 'Ange ett giltigt datum';
+      }
+      const checkBoxes = Array.from(this.el.querySelectorAll('input[type="checkbox"]'));
+      const notValidTerms = checkBoxes.find(i => !i.checked);
+      if (notValidTerms) {
+        this.generalError = 'Du måste godkänna villkoren';
+      }
+      if (index$1.state.customer.source && index$1.state.selectSource) {
+        if (!this.sellerID) {
+          this.generalError = 'Ange säljare';
+          return;
+        }
+        if (((_a = index$1.state.customer.source.sub_sources) === null || _a === void 0 ? void 0 : _a.length) && !this.selectedSubSource) {
+          this.generalError = 'Välj underkälla';
+          return;
+        }
+      }
+      if (validDate && !notValidTerms) {
+        this.sendOrder();
+      }
+    };
+    this.render = () => {
+      var _a;
+      const dateLogo = index.getAssetPath(`./assets/date.svg`);
+      const down = index.getAssetPath(`./assets/down.svg`);
+      const loading = index.getAssetPath(`./assets/spinner.gif`);
+      if (index$1.state.checkoutEdit) {
+        return index.h("hemfixarna-address", null);
+      }
+      else if (index$1.state.checkoutStep === 1) {
+        return index.h("hemfixarna-getuser", null);
+      }
+      else if (index$1.state.checkoutStep === 2) {
+        return (index.h("div", { class: "mb-2" }, index.h("div", { class: "hemfixarna_addressinfo" }, index.h("div", null, index.h("p", null, hideField(index$1.state.user.firstName)), index.h("p", null, hideField(index$1.state.user.lastName)), index.h("p", null, index$1.state.user.email), index.h("p", null, index$1.state.user.phone)), index.h("div", null, index.h("p", null, hideField(index$1.state.user.street)), index.h("p", null, hideField(index$1.state.user.zip)), index.h("p", null, hideField(index$1.state.user.town))), index.h("button", { onClick: () => (index$1.state.checkoutEdit = true) }, "Beh\u00F6ver du \u00E4ndra adressen?")), index.h("form", { onSubmit: e => this.handleSubmit(e) }, index.h("div", null, index.h("img", { src: dateLogo, width: 24 }), index.h("input", { class: `${this.date.length ? 'input_active' : ''}`, min: new Date().toISOString().split('T')[0], onChange: e => this.handleChangeDate(e), type: "date", name: "date", value: this.date }), index.h("label", { htmlFor: "date" }, "Tidigaste datum f\u00F6r hembes\u00F6k"), index.h("img", { src: down, width: 24 })), this.dateError && index.h("span", null, this.dateError), index$1.state.customer.source && index$1.state.selectSource ? (index.h(index.Fragment, null, index.h("p", null, "Inloggad som:", index.h("strong", null, " ", index$1.state.customer.source.fieldData.So01_Name)), index.h("label", null, "S\u00E4ljare (S\u00E4ljarId)", index.h("input", { type: "text", value: this.sellerID, onChange: e => (this.sellerID = e.target.value) })), index.h("label", null, "PartnerOrderID (RefferalID)", index.h("input", { type: "text", value: this.RefferalID, onChange: e => (this.RefferalID = e.target.value) })), ((_a = index$1.state.customer.source.sub_sources) === null || _a === void 0 ? void 0 : _a.length) ? (index.h("div", null, index.h("select", { onChange: e => (this.selectedSubSource = e.target.value) }, index.h("option", { disabled: true, selected: true, value: "null" }, "V\u00E4lj underk\u00E4lla"), index$1.state.customer.source.sub_sources.map(sub => (index.h("option", { value: sub['So_SubSource::Sus01_Name'] }, sub['So_SubSource::Sus01_Name'])))))) : (index.h("p", null, "Det finns inga underk\u00E4llor att v\u00E4lja")))) : null, index.h("label", { class: "hemfixarna_checkbox" }, index.h("input", { onChange: () => this.handleChangeTerms(), type: "checkbox" }), index.h("span", { innerHTML: index$1.state.options.terms })), index$1.state.cart
+          .filter(i => { var _a; return (_a = i.terms_checkout) === null || _a === void 0 ? void 0 : _a.length; })
+          .map(item => (index.h(index.Fragment, null, index.h("label", { class: "hemfixarna_checkbox" }, index.h("input", { onChange: () => this.handleChangeTerms(), type: "checkbox" }), index.h("span", null, item.terms_checkout))))), this.generalError && index.h("span", null, this.generalError), index.h("div", { class: this.loading ? 'loading' : '' }, index.h("input", { type: "submit", value: this.loading ? '' : 'Skicka bokning' }), index.h("img", { width: 20, height: 20, src: loading, alt: "spinner" })))));
+      }
+    };
+    this.date = '';
+    this.dateError = null;
+    this.generalError = null;
+    this.loading = false;
+    this.enteredPin = '';
+    this.selectedSubSource = null;
+    this.partnerOrderId = null;
+    this.sellerID = null;
+    this.RefferalID = null;
+  }
+  componentWillLoad() {
+    if (Boolean(index$1.state.user && index$1.state.user.street)) {
+      index$1.state.checkoutStep = 2;
+    }
+  }
+  get el() { return index.getElement(this); }
+};
+
+const hemfixarnaCss = "@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&display=swap\");\n@keyframes fadeIn {\n  from {\n    opacity: 0;\n  }\n  to {\n    opacity: 1;\n  }\n}\n* {\n  box-sizing: border-box;\n}\n\n:host {\n  font-family: \"Inter\", sans-serif;\n}\n:host input[type=text] {\n  padding: 16px;\n  width: 100%;\n  font-size: 16px;\n  border: 1px solid #fcd9c9;\n}\n:host .mb-2 {\n  margin-bottom: 32px;\n}\n:host button {\n  color: #474444;\n}\n:host form {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  position: relative;\n}\n:host form button {\n  position: absolute;\n  right: 0;\n  top: -1rem;\n}\n:host form img {\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  pointer-events: none;\n}\n:host form img:first-of-type {\n  left: 16px;\n}\n:host form img:last-of-type {\n  right: 16px;\n}\n:host form span {\n  margin-top: -8px;\n  color: #ec6632;\n}\n:host form p {\n  text-align: center;\n}\n:host form p {\n  margin: 0;\n}\n:host form div {\n  position: relative;\n}\n:host form div label {\n  pointer-events: none;\n  position: absolute;\n  left: 16px;\n  top: 50%;\n  transform: translateY(-50%);\n  background: #fff;\n  padding: 4px;\n  transition: 0.2s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n}\n:host form div input {\n  padding: 16px;\n  width: 100%;\n  font-size: 16px;\n  border: 1px solid #fcd9c9;\n}\n:host form div input:focus ~ label,\n:host form div .input_active ~ label {\n  top: 0;\n  transform: translateY(-50%);\n  background: linear-gradient(180deg, #faf1e8 50%, #fff 50%);\n}\n:host form select {\n  padding: 0.75rem 1rem;\n  width: 100%;\n}\n:host h1 {\n  font-size: 24px;\n  font-weight: 400;\n  line-height: 32px;\n  letter-spacing: -3%;\n  text-align: left;\n  margin: 0 0 8px;\n}\n:host h2 {\n  margin: 0 0 24px;\n  font-weight: 700;\n  font-size: 20px;\n  line-height: 28px;\n  letter-spacing: -3%;\n}\n:host p {\n  font-size: 16px;\n  font-weight: 400;\n  line-height: 24px;\n  letter-spacing: -3%;\n}\n:host .hemfixarna {\n  width: 100%;\n  /* Hide default HTML checkbox */\n  /* The slider */\n}\n:host .hemfixarna_source {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n}\n:host .hemfixarna_source img {\n  width: 20px;\n}\n:host .hemfixarna_source--pw {\n  max-width: 300px !important;\n}\n:host .hemfixarna_source--pw input[type=password] {\n  padding: 0.5rem;\n}\n:host .hemfixarna_source--pw form {\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n:host .hemfixarna_contact {\n  display: flex;\n  gap: 16px;\n}\n:host .hemfixarna_contact a {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  color: #474444;\n  text-decoration: none;\n  font-weight: 600;\n  font-size: 13px;\n}\n:host .hemfixarna_contact a:hover {\n  text-decoration: underline;\n}\n:host .hemfixarna_contact--horizontal span {\n  display: none;\n}\n@media (min-width: 769px) {\n  :host .hemfixarna_contact--horizontal span {\n    display: initial;\n  }\n}\n:host .hemfixarna_painting {\n  opacity: 0;\n  padding: 0 1rem;\n  animation: fadeIn 0.5s forwards 0.3s;\n}\n:host .hemfixarna_painting > h2,\n:host .hemfixarna_painting p {\n  text-align: center;\n  padding: 0 16px;\n}\n:host .hemfixarna_painting > h2 {\n  margin: 0 0 8px;\n}\n:host .hemfixarna_partnerlogo {\n  max-height: 50px;\n  min-height: 45px;\n  object-fit: contain;\n  max-width: 150px;\n}\n@media (min-width: 769px) {\n  :host .hemfixarna_partnerlogo {\n    max-width: 200px;\n  }\n}\n:host .hemfixarna_nav {\n  position: absolute;\n  top: 0;\n  width: 100dvw;\n  left: 0;\n  height: 80px;\n  z-index: 9999;\n}\n:host .hemfixarna_nav--links {\n  display: none !important;\n}\n@media (min-width: 769px) {\n  :host .hemfixarna_nav--links {\n    display: flex !important;\n  }\n}\n:host .hemfixarna_nav--links a {\n  color: #ec6632;\n  text-decoration: none;\n  border: 1px solid rgba(255, 255, 255, 0.3);\n  border-radius: 56px;\n  padding: 8px 32px;\n  text-transform: capitalize;\n}\n:host .hemfixarna_nav > div {\n  position: relative;\n  overflow: hidden;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 0 16px;\n}\n@media (min-width: 769px) {\n  :host .hemfixarna_nav > div {\n    padding: 0 32px;\n  }\n}\n:host .hemfixarna_nav > div > div {\n  display: flex;\n  gap: 32px;\n  justify-content: space-between;\n}\n:host .hemfixarna_nav > div > img {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  top: 0;\n  left: 0;\n  z-index: -1;\n}\n:host .hemfixarna_nav a {\n  text-decoration: none;\n}\n:host .hemfixarna_nav p {\n  color: #474444;\n}\n:host .hemfixarna_nav p.with-bg {\n  color: #fff;\n}\n:host .hemfixarna_standalone .hemfixarna_backdrop {\n  background: #fffaf2;\n  opacity: 1;\n}\n:host .hemfixarna_standalone .hemfixarna_modal {\n  top: 80px;\n  transform: translateX(-50%);\n  border: none;\n  height: calc(100dvh - 80px);\n  opacity: 0;\n}\n:host .hemfixarna_standalone .hemfixarna_modal--open {\n  opacity: 1;\n}\n:host .hemfixarna .switch {\n  position: relative;\n  display: inline-block;\n  width: 40px;\n  height: 20px;\n}\n:host .hemfixarna .switch input {\n  opacity: 0;\n  width: 0;\n  height: 0;\n}\n:host .hemfixarna .slider {\n  position: absolute;\n  cursor: pointer;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background-color: #ccc;\n  -webkit-transition: 0.4s;\n  transition: 0.4s;\n  border-radius: 34px;\n}\n:host .hemfixarna .slider:before {\n  position: absolute;\n  content: \"\";\n  height: 18px;\n  width: 18px;\n  left: 2px;\n  bottom: 1px;\n  background-color: white;\n  -webkit-transition: 0.4s;\n  transition: 0.4s;\n  border-radius: 50%;\n}\n:host .hemfixarna input:checked + .slider {\n  background-color: #fcd9c9;\n}\n:host .hemfixarna input:focus + .slider {\n  box-shadow: 0 0 1px #fcd9c9;\n}\n:host .hemfixarna input:checked + .slider:before {\n  -webkit-transform: translateX(18px);\n  -ms-transform: translateX(18px);\n  transform: translateX(18px);\n  background: #ec6632;\n}\n:host .hemfixarna_maleribox {\n  background: #fff;\n  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n  width: 100%;\n  min-height: 132px;\n  padding: 24px;\n  display: flex;\n  align-items: center;\n  gap: 24px;\n  text-align: left;\n}\n:host .hemfixarna_maleribox:hover {\n  transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n  filter: brightness(1.02);\n  transform: scale(1.01);\n  box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_checkbox {\n  display: grid;\n  grid-template-columns: 40px auto;\n  font-size: 16px;\n  font-weight: 400;\n  line-height: 24px;\n  letter-spacing: -3%;\n}\n:host .hemfixarna_checkbox > span {\n  transform: translateY(6px);\n}\n:host .hemfixarna_checkbox span,\n:host .hemfixarna_checkbox span p {\n  color: #474444;\n  font-size: 14px;\n}\n:host .hemfixarna_checkbox p {\n  text-align: left;\n}\n:host .hemfixarna_info {\n  display: flex;\n  flex-direction: column;\n  gap: 24px;\n  padding: 32px;\n  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n  border-radius: 4px;\n  border: 1px solid #fcd9c9;\n}\n:host .hemfixarna_info h2 {\n  margin: 0;\n}\n@media (min-width: 769px) {\n  :host .hemfixarna_info {\n    position: sticky;\n    top: 0;\n  }\n}\n:host .hemfixarna_infomodal {\n  position: absolute;\n  top: 40%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 100%;\n  max-width: 80%;\n  background: #fffaf2;\n  border: 1px solid #fcd9c9;\n  padding: 32px;\n  z-index: 99;\n  border-radius: 4px;\n  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n}\n:host .hemfixarna_infomodal p,\n:host .hemfixarna_infomodal h4 {\n  margin: 0;\n}\n:host .hemfixarna_infomodal button {\n  background: #ec6632;\n  color: #fff;\n  border-radius: 60px;\n  font-size: 16px;\n  padding: 8px 16px;\n}\n:host .hemfixarna_addressinfo {\n  padding: 16px 16px 64px;\n  border: 1px solid #fcd9c9;\n  position: relative;\n  margin-bottom: 32px;\n  display: grid;\n  grid-template-columns: 1fr;\n  gap: 8px;\n}\n@media (min-width: 769px) {\n  :host .hemfixarna_addressinfo {\n    grid-template-columns: 1fr 1fr;\n  }\n}\n:host .hemfixarna_addressinfo button {\n  position: absolute;\n  bottom: 16px;\n  right: 16px;\n  font-weight: 500;\n  text-underline-offset: 2px;\n  text-decoration: underline;\n}\n:host .hemfixarna_part {\n  background: #fff;\n  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n  display: grid;\n  padding: 16px;\n  grid-template-columns: auto 75px;\n}\n:host .hemfixarna_counter {\n  display: flex;\n  align-items: center;\n}\n:host .hemfixarna_counter span {\n  padding: 0 8px;\n}\n:host .hemfixarna_counter img {\n  cursor: pointer;\n}\n:host .hemfixarna_counter img:not(.disabled):hover {\n  transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n  filter: brightness(1.02);\n  transform: scale(1.01);\n  box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_description {\n  display: grid;\n  gap: 16px;\n}\n:host .hemfixarna_description ul {\n  list-style: disc;\n  padding-right: 12px;\n  transform: translateX(12px);\n}\n:host .hemfixarna_description--hidden {\n  max-height: 140px;\n  overflow: hidden;\n  position: relative;\n  cursor: pointer;\n}\n:host .hemfixarna_description--hidden::after {\n  content: \"\";\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  height: 128px;\n  background: linear-gradient(180deg, rgba(255, 253, 250, 0), rgba(255, 253, 250, 0.46) 50%, #faf1e8);\n}\n:host .hemfixarna_terms {\n  font-size: 14px;\n}\n:host .hemfixarna_terms a {\n  color: inherit;\n}\n:host .hemfixarna_logo {\n  height: 64px;\n}\n:host .hemfixarna_box {\n  padding: 16px;\n  display: flex;\n  align-items: center;\n  width: 100%;\n  box-sizing: border-box;\n  border-radius: 4px;\n  gap: 16px 8px;\n  border-radius: 4px;\n  gap: 16px 8px;\n}\n:host .hemfixarna_box p,\n:host .hemfixarna_box span {\n  font-size: 15px;\n}\n:host .hemfixarna_box .underline {\n  text-decoration: underline;\n  text-underline-offset: 2px;\n}\n:host .hemfixarna_box .pointer {\n  cursor: pointer;\n}\n:host .hemfixarna_box .p-s {\n  font-size: 12px;\n}\n:host .hemfixarna_box > div {\n  display: grid;\n  gap: 8px;\n}\n:host .hemfixarna_box--standard {\n  background: #fffaf2;\n  border: 1px solid #fcd9c9;\n}\n:host .hemfixarna_box--alternative, :host .hemfixarna_box--alternative_2, :host .hemfixarna_box--alternative_3 {\n  background: transparent;\n  border: 1px solid #e3e3e3;\n}\n:host .hemfixarna_box--alternative_2, :host .hemfixarna_box--alternative_3 {\n  box-shadow: 0px 2px 16px 0px rgba(0, 0, 0, 0.0784313725);\n}\n:host .hemfixarna_box--alternative_3 {\n  justify-content: center;\n}\n:host .hemfixarna_altbtn {\n  display: flex !important;\n  flex-direction: column;\n  gap: 8px;\n  align-items: center;\n  margin-left: auto;\n}\n:host .hemfixarna_btn {\n  margin-left: auto;\n}\n:host .hemfixarna_btn, :host .hemfixarna_buy,\n:host .hemfixarna input[type=submit] {\n  border: none;\n  border-radius: 60px;\n  font-weight: 600;\n  letter-spacing: 0.5px;\n  line-height: 20px;\n  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_btn:not(.disabled):hover, :host .hemfixarna_buy:not(.disabled):hover,\n:host .hemfixarna input[type=submit]:not(.disabled):hover {\n  transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n  filter: brightness(1.02);\n  transform: scale(1.01);\n  box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna div:has(> input[type=submit]) {\n  position: relative;\n}\n:host .hemfixarna div:has(> input[type=submit]) input {\n  cursor: pointer;\n}\n:host .hemfixarna div:has(> input[type=submit]) img {\n  display: none;\n}\n:host .hemfixarna .loading {\n  cursor: default;\n  opacity: 0.6;\n}\n:host .hemfixarna .loading > img {\n  display: initial !important;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n}\n:host .hemfixarna_btn {\n  font-size: 14px;\n  background: #c84e18;\n  color: #fff;\n  padding: 16px 24px;\n  white-space: nowrap;\n  position: relative;\n}\n:host .hemfixarna_btn span {\n  position: absolute;\n  background: #fff;\n  border-radius: 100%;\n  width: 24px;\n  height: 24px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-weight: 600;\n  font-size: 13px;\n  line-height: 11px;\n  top: -6px;\n  right: -12px;\n}\n:host .hemfixarna_btn span {\n  background: #25a710;\n  color: #fff;\n  right: 0 !important;\n}\n:host .hemfixarna_buy,\n:host .hemfixarna input[type=submit] {\n  font-size: 21px;\n  background: #25a710;\n  color: #fff;\n  padding: 16px 24px;\n}\n:host .hemfixarna .disabled {\n  opacity: 0.5;\n  cursor: default;\n}\n:host .hemfixarna_modal {\n  position: fixed;\n  background: #faf1e8;\n  border: 1px solid #fcd9c9;\n  border-radius: 4px;\n  top: 50%;\n  left: 50%;\n  z-index: 1000;\n  transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n  transform: translate(-50%, -50%) scale(0.7);\n  opacity: 0;\n  height: 92%;\n  width: 92%;\n  max-width: 920px;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n:host .hemfixarna_modal--open {\n  opacity: 1;\n  transform: translate(-50%, -50%) scale(1);\n}\n:host .hemfixarna_backdrop {\n  z-index: 999;\n  position: fixed;\n  background: #474444;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  right: 0;\n  opacity: 0;\n  transition: transform 0.1s cubic-bezier(0.465, 0.183, 0.153, 0.946), opacity 0.1s cubic-bezier(0.465, 0.183, 0.153, 0.946);\n}\n:host .hemfixarna_backdrop--open {\n  opacity: 0.3;\n}\n:host .hemfixarna_order {\n  position: absolute;\n  top: -1px;\n  left: -1px;\n  right: -1px;\n  bottom: -1px;\n  background-repeat: no-repeat !important;\n  background-size: cover !important;\n  background-position: center !important;\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  padding: 48px 32px 64px;\n}\n@media (max-width: 768px) {\n  :host .hemfixarna_order {\n    grid-template-columns: 1fr;\n    grid-template-rows: 0 auto;\n  }\n}\n:host .hemfixarna_order > div:last-of-type {\n  background: #fffaf2;\n  padding: 32px;\n  display: flex;\n  flex-direction: column;\n  max-height: 100%;\n  overflow: auto;\n}\n:host .hemfixarna_order img {\n  cursor: pointer;\n}\n:host .hemfixarna_order button {\n  margin: 16px 0;\n  padding: 0;\n  text-decoration: underline;\n  text-underline-offset: 2px;\n  font-size: 14px;\n  font-weight: 600;\n}\n:host .hemfixarna_cart {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 32px;\n}\n@media (max-width: 768px) {\n  :host .hemfixarna_cart {\n    grid-template-columns: 1fr;\n    gap: 0;\n  }\n}\n:host .hemfixarna_cart--right h2, :host .hemfixarna_cart--left h2 {\n  display: flex;\n  align-items: center;\n}\n:host .hemfixarna_cart--right h2 img, :host .hemfixarna_cart--left h2 img {\n  margin-top: 3.2px;\n}\n@media (min-width: 769px) {\n  :host .hemfixarna_cart--left h2 button {\n    display: none;\n  }\n}\n@media (max-width: 768px) {\n  :host .hemfixarna_cart--right h2 button {\n    display: none;\n  }\n}\n:host .hemfixarna_cart--startfee {\n  display: flex;\n  justify-content: space-between;\n}\n:host .hemfixarna_cart--rutrot {\n  display: flex;\n  justify-content: space-between;\n}\n:host .hemfixarna_cart--rutrot div {\n  display: flex;\n  gap: 16px;\n  align-items: center;\n}\n:host .hemfixarna_cart--additional {\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 16px;\n  border-top: 1px solid #fcd9c9;\n}\n:host .hemfixarna_cart--additional p {\n  font-size: 14px;\n  position: relative;\n}\n:host .hemfixarna_cart--additional p strong {\n  text-decoration: underline;\n  text-underline-offset: 2px;\n  cursor: pointer;\n}\n:host .hemfixarna_cart--additional p img {\n  position: absolute;\n  top: 50%;\n  transform: translateY(-50%);\n  right: -20px;\n  cursor: pointer;\n}\n:host .hemfixarna_cart--price {\n  border-top: 1px solid #fcd9c9;\n  padding: 16px;\n  display: flex;\n  justify-content: space-between;\n}\n:host .hemfixarna_cart--price h3 {\n  margin: 0;\n}\n:host .hemfixarna_cart--item {\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n  padding: 16px 0;\n  border-top: 1px solid #fcd9c9;\n}\n:host .hemfixarna_cart--item span {\n  font-size: 12px;\n}\n:host .hemfixarna_cart--item > div {\n  display: flex;\n  justify-content: space-between;\n}\n:host .hemfixarna_cart--item > div > div {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n}\n:host .hemfixarna_cart--item > div button {\n  color: #ec6632;\n}\n:host .hemfixarna_cart--group {\n  border-radius: 16px;\n  background: #fefaf6;\n  margin-bottom: 16px;\n  padding: 10px 20px;\n}\n:host .hemfixarna_cart--group ul li:first-of-type {\n  border-top: 0;\n}\n:host .hemfixarna_categories {\n  display: flex;\n  flex-direction: column;\n  gap: 24px;\n}\n:host .hemfixarna_categories--wrapper {\n  gap: 32px;\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n}\n@media (max-width: 768px) {\n  :host .hemfixarna_categories--wrapper {\n    grid-template-columns: 1fr;\n  }\n}\n:host .hemfixarna_categories li {\n  position: relative;\n  background: #fff;\n  border-radius: 4px;\n  min-height: 132px;\n  padding: 24px;\n  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n  display: flex;\n  align-items: center;\n  gap: 24px;\n  cursor: pointer;\n}\n:host .hemfixarna_categories li:hover {\n  transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n  filter: brightness(1.02);\n  transform: scale(1.01);\n  box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_categories li > button {\n  height: 100%;\n  width: 100%;\n}\n:host .hemfixarna_categories li .price {\n  font-weight: 700;\n}\n:host .hemfixarna_content {\n  height: 100%;\n  overflow: auto;\n  padding: 0 32px 64px;\n}\n:host .hemfixarna_content--5 {\n  padding-top: 16px;\n}\n:host .hemfixarna_content--painting {\n  padding: 0;\n  overflow: initial;\n}\n:host .hemfixarna_crumbs {\n  position: relative;\n  padding: 16px 24px;\n  border-bottom: 1px solid #fcd9c9;\n  display: flex;\n  justify-content: space-between;\n}\n:host .hemfixarna_crumbs--back {\n  padding: 16px 24px 8px;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  box-shadow: none !important;\n}\n:host .hemfixarna_crumbs--back:hover {\n  transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n  filter: brightness(1.02);\n  transform: scale(1.01);\n  box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_crumbs img {\n  cursor: pointer;\n}\n:host .hemfixarna_crumbs .close {\n  position: absolute;\n  right: -16px;\n  top: -16px;\n  z-index: 9;\n  -webkit-transform: translate3d(0, 0, 0);\n}\n:host .hemfixarna_crumbs .cart {\n  display: flex;\n  padding-left: 16px;\n  position: relative;\n}\n:host .hemfixarna_crumbs .cart img {\n  cursor: inherit;\n}\n:host .hemfixarna_crumbs .cart span {\n  position: absolute;\n  background: #fff;\n  border-radius: 100%;\n  width: 24px;\n  height: 24px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-weight: 600;\n  font-size: 13px;\n  line-height: 11px;\n  top: -6px;\n  right: -12px;\n}\n:host .hemfixarna_crumbs .cart_active {\n  cursor: pointer;\n}\n:host .hemfixarna_crumbs .cart_active span {\n  background: #25a710;\n  color: #fff;\n}\n:host .hemfixarna_crumbs--links {\n  display: flex;\n  align-items: center;\n  gap: 16px;\n  overflow: auto;\n}\n@media (min-width: 769px) {\n  :host .hemfixarna_crumbs--links {\n    -ms-overflow-style: none;\n  }\n  :host .hemfixarna_crumbs--links::-webkit-scrollbar {\n    display: none;\n  }\n  :host .hemfixarna_crumbs--links::-webkit-scrollbar-button {\n    display: none;\n  }\n}\n:host .hemfixarna_crumbs--right {\n  display: flex;\n  align-items: center;\n}\n:host .hemfixarna_crumbs button {\n  white-space: nowrap;\n  background: #f1ded6;\n  border-radius: 64px;\n  padding: 12px 16px;\n  font-size: 12px;\n  font-weight: 600;\n  letter-spacing: 0.3px;\n  box-shadow: none !important;\n}\n:host .hemfixarna_crumbs button:not(.active):hover {\n  transition: 0.1s all cubic-bezier(0.465, 0.183, 0.153, 0.946);\n  filter: brightness(1.02);\n  transform: scale(1.01);\n  box-shadow: 0px 8px 16px 2px rgba(0, 0, 0, 0.0392156863);\n}\n@media (max-width: 768px) {\n  :host .hemfixarna_crumbs button {\n    display: none;\n  }\n}\n:host .hemfixarna_crumbs .active {\n  background: #fffaf2;\n  cursor: default;\n}\n:host .hemfixarna_features {\n  gap: 12px !important;\n}\n:host .hemfixarna_features li {\n  display: flex;\n  gap: 16px;\n  align-items: center;\n}\n:host .hemfixarna_address {\n  margin-bottom: 16px;\n}\n:host .hemfixarna_product {\n  display: grid;\n  gap: 16px;\n}\n:host .hemfixarna_product--link {\n  font-weight: 700;\n  color: #474444;\n  text-underline-offset: 4px;\n}\n:host .hemfixarna_product--left {\n  gap: 32px;\n}\n:host .hemfixarna_product--right {\n  gap: 32px;\n}\n:host .hemfixarna_product--price {\n  margin-top: 4px;\n  font-weight: 700;\n}\n:host .hemfixarna_product--total {\n  text-align: center;\n  margin: -16px 0;\n  font-size: 21px;\n  line-height: 28px;\n}\n:host .hemfixarna_product--item {\n  background: #fff;\n  padding: 16px;\n  display: grid;\n  grid-template-columns: auto 75px;\n  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.0392156863);\n}\n:host .hemfixarna_product--grid {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: 32px;\n}\n@media (max-width: 768px) {\n  :host .hemfixarna_product--grid {\n    grid-template-columns: 1fr;\n  }\n}\n:host .hemfixarna_product--grid > div {\n  display: flex;\n  flex-direction: column;\n}\n:host .hemfixarna_product--grid ul {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n:host .hemfixarna_product p {\n  margin: 0;\n}\n:host .hemfixarna_product--top {\n  display: flex;\n  gap: 32px;\n}\n:host .hemfixarna_product--top img {\n  object-fit: contain;\n}\n:host .hemfixarna_product--top > div {\n  width: 100%;\n}\n:host .hemfixarna_product--top > div h1 {\n  max-width: 80%;\n}\n@media (max-width: 768px) {\n  :host .hemfixarna_product--top > div h1 {\n    max-width: 100%;\n  }\n}\n:host .hemfixarna_product--top h4 {\n  margin-bottom: 8px;\n}\n:host h5,\n:host p {\n  margin: 0;\n}\n:host input[type=submit] {\n  cursor: pointer;\n}\n:host input[type=date] ~ label {\n  left: 56px;\n}\n:host input[type=date] {\n  border: 1px solid #fcd9c9;\n  padding-left: 64px;\n}\n:host input[type=checkbox] {\n  height: 18px;\n  width: 18px;\n  border: 1px solid #fcd9c9;\n}\n:host input[type=checkbox]:checked {\n  background: red;\n}\n:host input[type=date]::-webkit-calendar-picker-indicator {\n  background: transparent;\n  bottom: 0;\n  color: transparent;\n  cursor: pointer;\n  height: auto;\n  left: 0;\n  position: absolute;\n  right: 0;\n  top: 0;\n  width: auto;\n}\n:host button,\n:host a {\n  cursor: pointer;\n  background: none;\n  border: none;\n}\n:host ul {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}";
+
+const HemfixarnaComponent = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.triggerScrollTotop = () => {
+      const el = this.el.shadowRoot.querySelector('.hemfixarna_content');
+      scrollToTop(el);
+    };
+    this.modal = false;
+    this.showModal = false;
+    this.product = null;
+    this.id = undefined;
+    this.slug = undefined;
+    this.business = undefined;
+    this.widgetStyle = index$2.WidgetStyle.standard;
+    this.buttonColor = undefined;
+    this.buttonBg = undefined;
+    this.proppedProduct = null;
+    this.loginSourceError = null;
+  }
+  loadCategoryOrProduct(id) {
+    this.proppedProduct = null;
+    if (id.startsWith('c-')) {
+      const categories = [...index$1.state.customer.categories, ...index$1.state.customer.categories.map(c => { var _a; return (_a = c.sub_categories) !== null && _a !== void 0 ? _a : []; })].flat();
+      const category = categories.find(c => c && c.id === id.replace('c-', ''));
+      if (category) {
+        index$1.state.selectedCustomerCategory = category;
+        index$1.state.step = 2;
+      }
+    }
+    else {
+      const products = index$1.state.customer.categories
+        .map(c => (c.show_products ? c.products : c.sub_categories ? c.sub_categories.map(c => c.products) : []))
+        .flat()
+        .flat();
+      const product = products.find(p => p && p.fields.ID === parseInt(id));
+      if (product) {
+        index$1.state.selectedProduct = product.fields;
+        index$1.state.step = 4;
+        this.proppedProduct = product.fields;
+      }
+    }
+  }
+  async watchIdChange(id) {
+    if (id && index$1.state.customer) {
+      if (id === 'maleri') {
+        index$1.state.maleri = true;
+        index$1.state.step = 4;
+      }
+      else {
+        this.loadCategoryOrProduct(id);
+      }
+    }
+  }
+  async componentWillLoad() {
+    index$1.state.business = this.business;
+    const cart = window.sessionStorage.getItem(`hemfixarna-${this.business}-cart`);
+    if (cart) {
+      index$1.state.cart = JSON.parse(cart);
+    }
+    const user = window.sessionStorage.getItem(`hemfixarna-${this.business}-user`);
+    if (user) {
+      index$1.state.user = JSON.parse(user);
+    }
+    const creditSafeUser = window.sessionStorage.getItem(`hemfixarna-${this.business}-creditSafeUser`);
+    if (creditSafeUser) {
+      index$1.state.creditSafeUser = JSON.parse(creditSafeUser);
+    }
+    const [options, rut, rot, greenDiscount] = await Promise.all([getOptions(), getRut(), getRot(), getGreenDiscount()]);
+    try {
+      const customer = await getCustomer(this.business);
+      if ((customer === null || customer === void 0 ? void 0 : customer.code) === 'not_found') {
+        console.warn('customer not found');
+      }
+      else if (customer) {
+        index$1.state.customer = customer;
+        const id = this.id || this.slug;
+        if (id) {
+          if (id === 'maleri') {
+            index$1.state.maleri = true;
+            index$1.state.step = 4;
+          }
+          else {
+            this.loadCategoryOrProduct(id);
+          }
+        }
+      }
+    }
+    catch (error) {
+      console.warn('customer not found');
+    }
+    index$1.state.rotOptions = rot;
+    index$1.state.rutOptions = rut;
+    index$1.state.greenOptions = greenDiscount;
+    index$1.state.options = options;
+    if (localStorage.getItem('select_source')) {
+      index$1.state.selectSource = true;
+    }
+  }
+  // Open close modal && click outside event
+  openModal() {
+    if (this.id) {
+      if (this.id === 'maleri') {
+        index$1.state.maleri = true;
+        index$1.state.step = 4;
+      }
+      else {
+        index$1.state.maleri = false;
+        this.loadCategoryOrProduct(this.id);
+      }
+    }
+    this.modal = true;
+    setTimeout(() => {
+      this.showModal = true;
+    }, 50);
+  }
+  closeModal() {
+    this.showModal = false;
+    setTimeout(() => {
+      this.modal = false;
+    }, 200);
+  }
+  handleClick(e) {
+    if ((e === null || e === void 0 ? void 0 : e.composedPath()[0]).classList.contains('hemfixarna_backdrop')) {
+      this.closeModal();
+    }
+    const infomodal = this.el.shadowRoot.querySelector('.hemfixarna_infomodal');
+    if (infomodal) {
+      const isClickInside = infomodal.contains(e.composedPath()[0]);
+      if (!isClickInside) {
+        index$1.state.modal = null;
+      }
+    }
+  }
+  async handleLogin() {
+    this.loginSourceError = null;
+    const passwordInput = this.el.shadowRoot.querySelector('input[type="password"]');
+    const password = passwordInput.value;
+    try {
+      const status = await loginCustomer({ id: index$1.state.customer.ID, password: password });
+      if (status === 200) {
+        index$1.state.showSourcePasswordPrompt = false;
+        index$1.state.selectSource = true;
+      }
+      else {
+        this.loginSourceError = 'Fel lösenord';
+      }
+    }
+    catch (error) {
+      console.log(error);
+      this.loginSourceError = 'Fel lösenord';
+    }
+  }
+  getCartLength() {
+    return index$1.state.cart.reduce((acc, curr) => acc + curr.amount, 0);
+  }
+  render() {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+    const logo = index.getAssetPath(`./assets/hemfixarna.svg`);
+    const pensel = index.getAssetPath(`./assets/pensel.svg`);
+    const monteringLogo = index.getAssetPath(`./assets/montering.svg`);
+    return (index.h("div", { class: `hemfixarna hemfixarna-${this.business}` }, index.h("div", { class: `hemfixarna_box hemfixarna_box--${this.widgetStyle}` }, [index$2.WidgetStyle.alternative_2, index$2.WidgetStyle.alternative_3].includes(this.widgetStyle) ? (index.h("img", { src: this.id === 'maleri' ? pensel : monteringLogo, alt: "montering logo", width: 32, height: 32 })) : null, index.h("div", null, index.h("div", null, index.h("p", { onClick: () => this.openModal(), class: `pointer ${[index$2.WidgetStyle.alternative_2, index$2.WidgetStyle.alternative_3].includes(this.widgetStyle) && index$1.state.selectedProduct ? 'underline' : ''}` }, this.id === 'maleri' ? (index.h("span", null, "Ber\u00E4kna fast pris p\u00E5 m\u00E5leri & tapetsering h\u00E4r")) : (index.h(index.Fragment, null, !index$1.state.selectedCustomerCategory && !this.product && !this.proppedProduct ? (index.h(index.Fragment, null, ((_a = index$1.state.customer) === null || _a === void 0 ? void 0 : _a.widget_title) ? (index.h("span", null, index$1.state.customer.widget_title)) : (index.h("span", null, "Montering/Installation - ", index.h("strong", { class: "underline" }, "se priser h\u00E4r"))))) : (index.h(index.Fragment, null, ((_b = this.product) === null || _b === void 0 ? void 0 : _b.title) || ((_c = this.proppedProduct) === null || _c === void 0 ? void 0 : _c.title) || ((_d = index$1.state.selectedCustomerCategory) === null || _d === void 0 ? void 0 : _d.widget_title) || (index.h("span", null, "Montering", index.h("wbr", null), "/Installation ", (_f = (_e = index$1.state.selectedCustomerCategory) === null || _e === void 0 ? void 0 : _e.name) !== null && _f !== void 0 ? _f : 'på plats', " - ", index.h("strong", { class: "underline" }, "se priser h\u00E4r"))), this.proppedProduct && !((_g = this.product) === null || _g === void 0 ? void 0 : _g.invoice) && !((_h = this.proppedProduct) === null || _h === void 0 ? void 0 : _h.invoice) ? (index.h("span", null, ' från', " ", index.h("strong", null, getProductPriceWithRotAndRut(this.proppedProduct || this.product), "kr"))) : null)))))), this.widgetStyle === index$2.WidgetStyle.standard ? index.h("img", { src: logo, width: 104 }) : null, this.widgetStyle === index$2.WidgetStyle.alternative ? (index.h("span", { class: "p-s" }, "Utf\u00F6rs av ", index.h("strong", null, "Hemfixarna"))) : null), [index$2.WidgetStyle.standard, index$2.WidgetStyle.alternative].includes(this.widgetStyle) ? (index.h("button", { onClick: () => this.openModal(), class: "hemfixarna_btn", style: {
+        color: ((_j = this.buttonColor) === null || _j === void 0 ? void 0 : _j.startsWith('#')) || !((_k = this.buttonColor) === null || _k === void 0 ? void 0 : _k.length) ? this.buttonColor : `#${this.buttonColor}`,
+        backgroundColor: ((_l = this.buttonBg) === null || _l === void 0 ? void 0 : _l.startsWith('#')) || !((_m = this.buttonBg) === null || _m === void 0 ? void 0 : _m.length) ? this.buttonBg : `#${this.buttonBg}`,
+      } }, "Best\u00E4ll h\u00E4r", this.getCartLength() > 0 && index.h("span", null, this.getCartLength()))) : null, index$2.WidgetStyle.alternative_2 === this.widgetStyle ? (index.h("div", { class: "hemfixarna_altbtn" }, index.h("strong", { class: "p-s" }, "Utf\u00F6rs av"), index.h("img", { src: logo, alt: "hemfixarna logo", width: 98 }))) : null), this.modal && (index.h("div", null, index.h("div", { class: `hemfixarna_modal ${this.showModal ? 'hemfixarna_modal--open' : ''}` }, index$1.state.modal && (index.h("div", { class: "hemfixarna_infomodal" }, index$1.state.modal.title && index.h("h2", null, index$1.state.modal.title), index.h("p", { innerHTML: index$1.state.modal.text }), index.h("div", null, index.h("button", { onClick: () => (index$1.state.modal = null) }, "St\u00E4ng")))), index$1.state.showSourcePasswordPrompt ? (index.h("div", { class: "hemfixarna_source--pw hemfixarna_infomodal" }, index.h("form", { onSubmit: e => {
+        e.preventDefault();
+        this.handleLogin();
+      } }, index.h("input", { type: "password", placeholder: "L\u00F6senord" }), index.h("input", { type: "submit", value: "Logga in" }), this.loginSourceError && index.h("span", null, "Fel l\u00F6senord")))) : null, index$1.state.customer && index.h("hemfixarna-breadcrumbs", { closeModal: () => this.closeModal() }), index.h("div", { class: `hemfixarna_content hemfixarna_content--${index$1.state.step} ${index$1.state.step === 4 && index$1.state.maleri ? 'hemfixarna_content--painting' : ''}` }, index$1.state.step < 4 && index.h("hemfixarna-start", null), index$1.state.step === 4 && index.h("hemfixarna-product", null), index$1.state.step === 5 && index.h("hemfixarna-cart", null), index$1.state.step === 6 && index.h("hemfixarna-order", null))), index.h("div", { class: `hemfixarna_backdrop ${this.showModal ? 'hemfixarna_backdrop--open' : ''}` })))));
+  }
+  static get assetsDirs() { return ["assets"]; }
+  get el() { return index.getElement(this); }
+  static get watchers() { return {
+    "id": ["watchIdChange"]
+  }; }
+};
+HemfixarnaComponent.style = hemfixarnaCss;
+
+const HemfixarnaInfo$1 = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.vertical = false;
+  }
+  render() {
+    return (index.h("div", { class: `hemfixarna_contact ${this.vertical ? 'hemfixarna_contact--vertical' : 'hemfixarna_contact--horizontal'}` }, index$1.state.customer.source ? (index.h("div", { onClick: () => {
+        if (!index$1.state.selectSource) {
+          index$1.state.showSourcePasswordPrompt = true;
+        }
+      }, class: "hemfixarna_source" }, index$1.state.selectSource ? (index.h("svg", { viewBox: "0 0 1024 1024", fill: "#C84E18", height: "1em", width: "1em" }, index.h("path", { d: "M832 464H332V240c0-30.9 25.1-56 56-56h248c30.9 0 56 25.1 56 56v68c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-68c0-70.7-57.3-128-128-128H388c-70.7 0-128 57.3-128 128v224h-68c-17.7 0-32 14.3-32 32v384c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V496c0-17.7-14.3-32-32-32zM540 701v53c0 4.4-3.6 8-8 8h-40c-4.4 0-8-3.6-8-8v-53a48.01 48.01 0 1156 0z" }))) : (index.h("svg", { viewBox: "0 0 1024 1024", fill: "#C84E18", height: "1em", width: "1em" }, index.h("path", { d: "M832 464h-68V240c0-70.7-57.3-128-128-128H388c-70.7 0-128 57.3-128 128v224h-68c-17.7 0-32 14.3-32 32v384c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V496c0-17.7-14.3-32-32-32zM540 701v53c0 4.4-3.6 8-8 8h-40c-4.4 0-8-3.6-8-8v-53a48.01 48.01 0 1156 0zm152-237H332V240c0-30.9 25.1-56 56-56h248c30.9 0 56 25.1 56 56v224z" }))))) : null, index.h("a", { href: "tel:0770-220 720" }, index.h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M7 4V20H17V4H7ZM6 2H18C18.5523 2 19 2.44772 19 3V21C19 21.5523 18.5523 22 18 22H6C5.44772 22 5 21.5523 5 21V3C5 2.44772 5.44772 2 6 2ZM12 17C12.5523 17 13 17.4477 13 18C13 18.5523 12.5523 19 12 19C11.4477 19 11 18.5523 11 18C11 17.4477 11.4477 17 12 17Z", fill: "#C84E18" })), index.h("span", null, "0770-220 720")), index.h("a", { href: "https://hemfixarna.se/kundservice/", target: "_blank" }, index.h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("g", { "clip-path": "url(#clip0_1001_894)" }, index.h("path", { d: "M21 12.22C21 6.73 16.74 3 12 3C7.31 3 3 6.65 3 12.28C2.4 12.62 2 13.26 2 14V16C2 17.1 2.9 18 4 18H5V11.9C5 8.03 8.13 4.9 12 4.9C15.87 4.9 19 8.03 19 11.9V19H11V21H19C20.1 21 21 20.1 21 19V17.78C21.59 17.47 22 16.86 22 16.14V13.84C22 13.14 21.59 12.53 21 12.22Z", fill: "#C84E18" }), index.h("path", { d: "M9 14C9.55228 14 10 13.5523 10 13C10 12.4477 9.55228 12 9 12C8.44772 12 8 12.4477 8 13C8 13.5523 8.44772 14 9 14Z", fill: "#C84E18" }), index.h("path", { d: "M15 14C15.5523 14 16 13.5523 16 13C16 12.4477 15.5523 12 15 12C14.4477 12 14 12.4477 14 13C14 13.5523 14.4477 14 15 14Z", fill: "#C84E18" }), index.h("path", { d: "M18 11.03C17.52 8.18 15.04 6 12.05 6C9.01997 6 5.75997 8.51 6.01997 12.45C8.48997 11.44 10.35 9.24 10.88 6.56C12.19 9.19 14.88 11 18 11.03Z", fill: "#C84E18" })), index.h("defs", null, index.h("clipPath", { id: "clip0_1001_894" }, index.h("rect", { width: "24", height: "24", fill: "white" })))), index.h("span", null, "Kundservice"))));
+  }
+};
+
+const hemfixarnaDemoCss = "@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&display=swap\"); :host{font-family:\"Inter\", sans-serif}:host .hemfixarna_widgetstyles label{cursor:pointer}:host .hemfixarna_widgetstyles>div{display:flex;gap:1rem}:host .hemfixarna_widgetstyles h5{margin:1rem 0}:host .hemfixarna_example{margin-bottom:16px;background:#000;padding:16px;color:#fff;display:flex;justify-content:space-between;cursor:pointer;max-width:500px;box-sizing:border-box;position:relative}:host .hemfixarna_example--tooltip{background:#000;top:-48px;font-size:16px;left:40%;color:white;padding:8px;position:absolute;opacity:0}:host .hemfixarna_example--tooltip::after{content:\"\";position:absolute;top:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:#000 transparent transparent transparent}:host .hemfixarna_example:hover .hemfixarna_example--tooltip{opacity:1}:host .hemfixarna_example p{font-size:14px}:host .hemfixarna_example img{filter:invert(1)}:host .hemfixarna_install{display:grid;gap:8px;margin-top:16px}:host .hemfixarna_product--label{background:#e1e0f5}:host .hemfixarna_categories{max-height:100%;overflow:auto;position:relative}:host .hemfixarna_categories--label{display:flex;align-items:center;justify-content:space-between;padding:8px}:host .hemfixarna_categories--label button{background:#3f3a92;border:none;font-weight:600;padding:3.2px 9.6px;border-radius:10px;margin-right:8px;color:#ece8e8}:host .hemfixarna_categories--label button:active{transform:scale(0.95)}:host .hemfixarna_categories--label--big{font-weight:600;border-bottom:1px solid black}:host p{margin:0}:host span{color:darkolivegreen;font-size:10px}:host button{cursor:pointer}:host>div:not(.hemfixarna_hosted){grid-template-columns:1fr 1fr}:host .hemfixarna_hosted .hemfixarna_scripts{display:none}:host>div{display:grid;gap:32px;width:100%;height:100vh;place-items:center;overflow:hidden;padding:16px 32px;box-sizing:border-box}:host>div>*{width:100%}:host>div>div{max-width:500px}:host>div ul{margin:0;padding:0;list-style:none}:host>div ul ul{gap:1px;display:grid}:host>div ul li{padding-left:16px;background:#fff}";
+
+const MyComponent = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.debounce = null;
+    this.cdnLink = '<script type="module" src="https://cdn.jsdelivr.net/npm//hemfixarna-web-components@latest/dist/hemfixarna-components/hemfixarna-components.esm.js"></script>';
+    this.selectedSlug = undefined;
+    this.selectedID = undefined;
+    this.tooltipText = 'Kopiera till urklipp';
+    this.tree = null;
+    this.customer = null;
+    this.widgetStyle = index$2.WidgetStyle.standard;
+    this.buttonBg = '';
+    this.buttonColor = '';
+    this.partner = undefined;
+    this.colorAccessibility = undefined;
+    this.loggedIn = false;
+    this.loginError = false;
+  }
+  debouncedFunction() {
+    if (this.debounce !== null) {
+      clearTimeout(this.debounce);
+      this.debounce = null;
+    }
+    this.debounce = window.setTimeout(() => {
+      this.checkColorAccessibility();
+      this.debounce = null;
+    }, 1500);
+  }
+  async checkColorAccessibility() {
+    const defaultTextColor = '#fff';
+    const defaultBgColor = '#c84e18';
+    const firstColor = this.buttonBg.length ? (this.buttonBg.startsWith('#') ? this.buttonBg : `#${this.buttonBg}`) : defaultBgColor;
+    const secondColor = this.buttonColor.length ? (this.buttonColor.startsWith('#') ? this.buttonColor : `#${this.buttonColor}`) : defaultTextColor;
+    try {
+      const response = await fetch('https://www.aremycolorsaccessible.com/api/are-they', {
+        mode: 'cors',
+        method: 'POST',
+        body: JSON.stringify({ colors: [firstColor, secondColor] }),
+      });
+      if (!response) {
+        throw new Error('Network response was not ok');
+      }
+      const json = await response.json();
+      if (json && (json)) {
+        this.colorAccessibility = json;
+      }
+    }
+    catch (error) {
+      console.warn('Error fetching color accessibility:', error);
+    }
+  }
+  getColor(rating) {
+    switch (rating) {
+      case 'AAA':
+        return 'green';
+      case 'AA':
+        return 'orange';
+      case 'A':
+        return 'yellow';
+      case 'Fail':
+        return 'red';
+      default:
+        return 'black';
+    }
+  }
+  async componentWillLoad() {
+    const partner = window.location.pathname.replace('/', '');
+    if (!isBusiness(partner) && partner)
+      return;
+    this.partner = partner ? partner : index$2.Business.kund;
+    const customer = await getCustomer(this.partner);
+    if (customer.code !== 'not_found' && customer) {
+      this.customer = customer;
+      if (!this.customer.password_protected || window.localStorage.getItem(`${this.customer.ID}-loggedin`)) {
+        this.loggedIn = true;
+      }
+    }
+  }
+  getExample() {
+    return `<hemfixarna-component business="${this.partner}"${this.selectedSlug ? ` slug="${this.selectedSlug}" ` : ''}${this.selectedID ? ` id="${this.selectedID}" ` : ''} ${this.widgetStyle === index$2.WidgetStyle.standard ? '' : `widget-style="${this.widgetStyle}"`} ${this.buttonColor.length ? `button-color="${this.buttonColor}"` : ''} ${this.buttonBg.length ? `button-bg="${this.buttonBg}"` : ''}></hemfixarna-component>`;
+  }
+  copyExample() {
+    navigator.clipboard.writeText(this.getExample());
+    this.tooltipText = 'Snippet kopierad';
+    setTimeout(() => {
+      this.tooltipText = 'Kopiera till urklipp';
+    }, 2000);
+  }
+  copyCdn() {
+    navigator.clipboard.writeText(this.cdnLink);
+    this.tooltipText = 'Text kopierad';
+    setTimeout(() => {
+      this.tooltipText = 'Kopiera till urklipp';
+    }, 2000);
+  }
+  copyNpmInstall() {
+    navigator.clipboard.writeText('npm i hemfixarna-web-components');
+    this.tooltipText = 'Text kopierad';
+    setTimeout(() => {
+      this.tooltipText = 'Kopiera till urklipp';
+    }, 2000);
+  }
+  showMaleri() {
+    var _a;
+    const allCategories = (_a = this.customer) === null || _a === void 0 ? void 0 : _a.categories.map(c => (c.sub_categories ? c.sub_categories : c)).flat();
+    return allCategories === null || allCategories === void 0 ? void 0 : allCategories.some(c => c.add_painting);
+  }
+  async handleLogin() {
+    const shadowHost = document.querySelector('hemfixarna-demo');
+    const shadowRoot = shadowHost.shadowRoot;
+    const passwordInput = shadowRoot.querySelector('input[type="password"]');
+    const password = passwordInput.value;
+    this.loginError = false;
+    try {
+      const status = await loginCustomer({ id: this.customer.ID, password: password });
+      if (status === 200) {
+        this.loggedIn = true;
+        window.localStorage.setItem(`${this.customer.ID}-loggedin`, 'true');
+      }
+      else {
+        this.loginError = true;
+      }
+    }
+    catch (error) {
+      console.log(error);
+      this.loginError = true;
+    }
+  }
+  render() {
+    var _a;
+    const copy = index.getAssetPath(`./assets/copy.png`);
+    return this.customer ? (index.h(index.Fragment, null, this.loggedIn ? (index.h("div", { class: ((_a = this.customer) === null || _a === void 0 ? void 0 : _a.at_hemfixarna) ? 'hemfixarna_hosted' : '' }, index.h("div", { class: "hemfixarna_scripts" }, index.h("div", { onClick: () => this.copyExample(), class: "hemfixarna_example" }, index.h("p", null, this.getExample()), index.h("img", { src: copy, height: 20 }), index.h("span", { class: "hemfixarna_example--tooltip" }, this.tooltipText)), index.h("hemfixarna-component", { business: this.partner, buttonBg: this.buttonBg, buttonColor: this.buttonColor, widgetStyle: this.widgetStyle, id: this.selectedID }), index.h("div", { class: "hemfixarna_install" }, index.h("div", { onClick: () => this.copyCdn(), class: "hemfixarna_example" }, index.h("p", null, this.cdnLink), index.h("span", { class: "hemfixarna_example--tooltip" }, this.tooltipText), index.h("img", { src: copy, height: 20 }))), index.h("div", { class: "hemfixarna_widgetstyles" }, index.h("h5", null, "Widget styles"), index.h("div", null, Object.values(index$2.WidgetStyle).map(style => (index.h("label", { key: style }, index.h("input", { type: "radio", value: style, checked: this.widgetStyle === style, onChange: () => (this.widgetStyle = style) }), style)))), index.h("div", null, index.h("div", null, index.h("h5", null, "Button background color"), index.h("input", { type: "text", value: this.buttonBg, onInput: e => (this.buttonBg = e.target.value) })), index.h("div", null, index.h("h5", null, "Button text color"), index.h("input", { type: "text", value: this.buttonColor, onInput: e => (this.buttonColor = e.target.value) })))), index.h("span", null, "Write an hexa code no # needed"), this.colorAccessibility ? (index.h("div", null, index.h("h5", null, "Tillg\u00E4nglighetsrapport"), index.h("div", null, index.h("strong", null, "Liten text:"), index.h("span", { style: { color: this.getColor(this.colorAccessibility.small) } }, this.colorAccessibility.small), index.h("br", null), index.h("strong", null, "Fet text:"), index.h("span", { style: { color: this.getColor(this.colorAccessibility.bold) } }, this.colorAccessibility.bold), index.h("br", null), index.h("strong", null, "Stor text:"), index.h("span", { style: { color: this.getColor(this.colorAccessibility.large) } }, this.colorAccessibility.large), index.h("br", null), index.h("strong", null, "Kontrastf\u00F6rh\u00E5llande:"), " ", this.colorAccessibility.contrast))) : null), index.h("ul", { class: "hemfixarna_categories" }, index.h("div", null, this.customer.logo ? (index.h("div", { style: { width: '100%', display: 'flex', justifyContent: 'center' } }, index.h("img", { style: { maxWidth: '250px', height: 'auto', margin: '0 auto 2rem' }, src: this.customer.logo.url, alt: this.customer.post_title }))) : null, this.showMaleri() ? (index.h("li", null, index.h("div", { class: "hemfixarna_categories--label hemfixarna_categories--label--big" }, index.h("div", null, index.h("p", null, "M\u00E5leriverktyget"), index.h("span", null, "maleri")), index.h("div", null, index.h("button", { onClick: () => navigator.clipboard.writeText('maleri') }, "Kopiera ID"), this.customer.at_hemfixarna ? (index.h("button", { onClick: () => navigator.clipboard.writeText(`${getApiUrl()}/partner/${this.customer.post_name}?id=maleri`) }, "Kopiera URL")) : (index.h("button", { onClick: () => (this.selectedID = 'maleri') }, "Ladda m\u00E5leri")))))) : null, this.customer.categories.map(c => (index.h("li", null, index.h("div", { class: "hemfixarna_categories--label hemfixarna_categories--label--big" }, index.h("div", null, index.h("p", null, c.name), index.h("span", null, `c-${c.id}`)), index.h("div", null, index.h("button", { onClick: () => navigator.clipboard.writeText(`c-${c.id}`) }, "Kopiera ID"), this.customer.at_hemfixarna ? (index.h("button", { onClick: () => navigator.clipboard.writeText(`${getApiUrl()}/partner/${this.customer.post_name}?id=c-${c.id}`) }, "Kopiera URL")) : (index.h("button", { onClick: () => (this.selectedID = `c-${c.id}`) }, "Ladda kategori")))), c.show_products && c.products ? (index.h("ul", null, c.products.map(p => (index.h("li", null, index.h("div", { class: "hemfixarna_categories--label hemfixarna_product--label" }, index.h("div", null, index.h("p", null, p.fields.title), index.h("span", null, p.fields.ID)), index.h("div", null, index.h("button", { onClick: () => navigator.clipboard.writeText(String(p.fields.ID)) }, "Kopiera ID"), this.customer.at_hemfixarna ? (index.h("button", { onClick: () => navigator.clipboard.writeText(`${getApiUrl()}/partner/${this.customer.post_name}?id=${p.fields.ID}`) }, "Kopiera URL")) : (index.h("button", { onClick: () => (this.selectedID = String(p.fields.ID)) }, "Ladda produkt"))))))))) : (index.h("ul", null, c.sub_categories &&
+      c.sub_categories.map(sc => (index.h("li", null, index.h("div", { class: "hemfixarna_categories--label" }, index.h("div", null, index.h("p", null, sc.name), index.h("span", null, `c-${sc.id}`)), index.h("div", null, index.h("button", { onClick: () => navigator.clipboard.writeText(`c-${sc.id}`) }, "Kopiera ID"), this.customer.at_hemfixarna ? (index.h("button", { onClick: () => navigator.clipboard.writeText(`${getApiUrl()}/partner/${this.customer.post_name}?id=c-${c.id}`) }, "Kopiera URL")) : (index.h("button", { onClick: () => (this.selectedID = `c-${sc.id}`) }, "Ladda kategori")))), index.h("ul", null, sc.products.map(p => (index.h("li", null, index.h("div", { class: "hemfixarna_categories--label hemfixarna_product--label" }, index.h("div", null, index.h("p", null, p.fields.title), index.h("span", null, p.fields.ID)), index.h("div", null, index.h("button", { onClick: () => navigator.clipboard.writeText(String(p.fields.ID)) }, "Kopiera ID"), this.customer.at_hemfixarna ? (index.h("button", { onClick: () => navigator.clipboard.writeText(`${getApiUrl()}/partner/${this.customer.post_name}?id=${p.fields.ID}`) }, "Kopiera URL")) : (index.h("button", { onClick: () => (this.selectedID = String(p.fields.ID)) }, "Ladda produkt")))))))))))))))))))) : (index.h("div", null, index.h("form", { onSubmit: e => {
+        e.preventDefault();
+        this.handleLogin();
+      }, style: {
+        display: 'flex',
+        flexDirection: 'column',
+        gap: '1rem',
+        maxWidth: '300px',
+        margin: 'auto',
+        padding: '20px',
+        border: '1px solid #ccc',
+        borderRadius: '5px',
+        gridColumn: 'span 2',
+      } }, index.h("input", { type: "password", placeholder: "L\u00F6senord" }), index.h("button", { type: "submit" }, "Logga in"), this.loginError && index.h("span", null, "Fel l\u00F6senord")))))) : (index.h("h1", { style: {
+        textAlign: 'center',
+        margin: 'auto',
+        padding: '20px',
+        fontSize: '24px',
+        fontWeight: 'bold',
+        color: 'red',
+      } }, "No customer found"));
+  }
+  static get watchers() { return {
+    "buttonBg": ["debouncedFunction"],
+    "buttonColor": ["debouncedFunction"]
+  }; }
+};
+MyComponent.style = hemfixarnaDemoCss;
+
+// src/errors.ts
+var PersonnummerError = class extends Error {
+  constructor() {
+    super("Invalid swedish personal identity number");
+  }
+};
+
+// src/utils.ts
+var compareAsc = (dateLeft, dateRight) => {
+  const diff = dateLeft.getTime() - dateRight.getTime();
+  return diff < 0 ? -1 : diff > 0 ? 1 : diff;
+};
+var diffInYears = (dateLeft, dateRight) => {
+  const sign = compareAsc(dateLeft, dateRight);
+  const yearDiff = Math.abs(dateLeft.getFullYear() - dateRight.getFullYear());
+  dateLeft.setFullYear(dateLeft.getFullYear() - sign * yearDiff);
+  const isLastYearNotFull = compareAsc(dateLeft, dateRight) === -sign;
+  const result = sign * (yearDiff - +isLastYearNotFull);
+  return result === 0 ? 0 : result;
+};
+var luhn = (str) => {
+  let sum = 0;
+  str += "";
+  for (let i = 0, l = str.length; i < l; i++) {
+    let v = parseInt(str[i]);
+    v *= 2 - i % 2;
+    if (v > 9) {
+      v -= 9;
+    }
+    sum += v;
+  }
+  return Math.ceil(sum / 10) * 10 - sum;
+};
+var testDate = (year, month, day) => {
+  month -= 1;
+  const date = new Date(year, month, day);
+  return !(date.getFullYear() !== year || date.getMonth() !== month || date.getDate() !== day);
+};
+
+// src/index.ts
+var Personnummer = class {
+  /**
+   * Personnummer constructor.
+   *
+   * @param {string} pin
+   * @param {object} options
+   */
+  constructor(pin, options) {
+    /**
+     * Personnummer century.
+     *
+     * @var {string}
+     */
+    this._century = "";
+    /**
+     * Personnummer full year.
+     *
+     * @var {string}
+     */
+    this._fullYear = "";
+    /**
+     * Personnummer year.
+     *
+     * @var {string}
+     */
+    this._year = "";
+    /**
+     * Personnummer month.
+     *
+     * @var {string}
+     */
+    this._month = "";
+    /**
+     * Personnummer day.
+     *
+     * @var {string}
+     */
+    this._day = "";
+    /**
+     * Personnummer seperator.
+     *
+     * @var {string}
+     */
+    this._sep = "";
+    /**
+     * Personnumer first three of the last four numbers.
+     *
+     * @var {string}
+     */
+    this._num = "";
+    /**
+     * The last number of the personnummer.
+     *
+     * @var {string}
+     */
+    this._check = "";
+    this.parse(pin, {
+      allowCoordinationNumber: true,
+      allowInterimNumber: false,
+      ...options
+    });
+  }
+  /**
+   * Get century.
+   *
+   * @return {string}
+   */
+  get century() {
+    return this._century;
+  }
+  /**
+   * Get age.
+   *
+   * @return {string}
+   */
+  get fullYear() {
+    return this._fullYear;
+  }
+  /**
+   * Get age.
+   *
+   * @return {string}
+   */
+  get year() {
+    return this._year;
+  }
+  /**
+   * Get month.
+   *
+   * @return {string}
+   */
+  get month() {
+    return this._month;
+  }
+  /**
+   * Get day.
+   *
+   * @return {string}
+   */
+  get day() {
+    return this._day;
+  }
+  /**
+   * Get sep.
+   *
+   * @return {string}
+   */
+  get sep() {
+    return this._sep;
+  }
+  /**
+   * Get num.
+   *
+   * @return {string}
+   */
+  get num() {
+    return this._num;
+  }
+  /**
+   * Get check.
+   *
+   * @return {string}
+   */
+  get check() {
+    return this._check;
+  }
+  /**
+   * Parse personnummer.
+   *
+   * @param {string} pin
+   * @param {object} options
+   *
+   * @return {Personnummer}
+   */
+  static parse(pin, options) {
+    return new Personnummer(pin, options);
+  }
+  /**
+   * Validate a Swedish personal identity number.
+   *
+   * @param {string} str
+   * @param {object} options
+   *
+   * @return {boolean}
+   */
+  static valid(pin, options) {
+    try {
+      Personnummer.parse(pin, options);
+      return true;
+    } catch (e) {
+      return false;
+    }
+  }
+  /**
+   * Parse personnummer and set class properties.
+   *
+   * @param {string} pin
+   * @param {object} options
+   */
+  parse(pin, options) {
+    if (pin.length < 10 || pin.length > 13) {
+      throw new PersonnummerError();
+    }
+    const reg = /^(\d{2}){0,1}(\d{2})(\d{2})(\d{2})([+-]?)((?!000)\d{3}|[TRSUWXJKLMN]\d{2})(\d)$/;
+    const match = reg.exec(pin);
+    if (!match) {
+      throw new PersonnummerError();
+    }
+    const century = match[1];
+    const year = match[2];
+    const month = match[3];
+    const day = match[4];
+    const sep = match[5];
+    const num = match[6];
+    const check = match[7];
+    if (typeof century === "undefined" || !century.length) {
+      const d = /* @__PURE__ */ new Date();
+      let baseYear = 0;
+      if (sep === "+") {
+        this._sep = "+";
+        baseYear = d.getFullYear() - 100;
+      } else {
+        this._sep = "-";
+        baseYear = d.getFullYear();
+      }
+      this._century = ("" + (baseYear - (baseYear - parseInt(year)) % 100)).substr(0, 2);
+    } else {
+      this._century = century;
+      if ((/* @__PURE__ */ new Date()).getFullYear() - parseInt(century + year, 10) < 100) {
+        this._sep = "-";
+      } else {
+        this._sep = "+";
+      }
+    }
+    this._year = year;
+    this._fullYear = this._century + year;
+    this._month = month;
+    this._day = day;
+    this._num = num;
+    this._check = check;
+    if (!this.valid()) {
+      throw new PersonnummerError();
+    }
+    if (!(options == null ? void 0 : options.allowCoordinationNumber) && this.isCoordinationNumber()) {
+      throw new PersonnummerError();
+    }
+    if (!(options == null ? void 0 : options.allowInterimNumber) && this.isInterimNumber()) {
+      throw new PersonnummerError();
+    }
+  }
+  /**
+   * Validate a Swedish personal identity number.
+   *
+   * @return {boolean}
+   */
+  valid() {
+    const valid = luhn(
+      this.year + this.month + this.day + this.num.replace(/[TRSUWXJKLMN]/, "1")
+    ) === +this.check && !!this.check;
+    if (valid && testDate(parseInt(this.century + this.year), +this.month, +this.day)) {
+      return valid;
+    }
+    return valid && testDate(parseInt(this.century + this.year), +this.month, +this.day - 60);
+  }
+  /**
+   * Format a Swedish personal identity number as one of the official formats,
+   * A long format or a short format.
+   *
+   * If the input number could not be parsed a empty string will be returned.
+   *
+   * @param {boolean} longFormat
+   *
+   * @return {string}
+   */
+  format(longFormat = false) {
+    if (longFormat) {
+      return `${this.century}${this.year}${this.month}${this.day}${this.num}${this.check}`;
+    }
+    return `${this.year}${this.month}${this.day}${this.sep}${this.num}${this.check}`;
+  }
+  /**
+   * Get age from a Swedish personal identity number.
+   *
+   * @return {number}
+   */
+  getAge() {
+    const date = this.getDate();
+    return diffInYears(new Date(Date.now()), date);
+  }
+  /**
+   * Get date from a Swedish personal identity number.
+   *
+   * @return {Date}
+   */
+  getDate() {
+    let ageDay = +this.day;
+    if (this.isCoordinationNumber()) {
+      ageDay -= 60;
+    }
+    const ageDate = this.century + this.year + "-" + this.month + "-" + (ageDay < 10 ? "0" + ageDay : ageDay);
+    return new Date(ageDate);
+  }
+  /**
+   * Check if a Swedish personal identity number is a interim number or not.
+   *
+   * @return {boolean}
+   */
+  isInterimNumber() {
+    return /[TRSUWXJKLMN]/.test(this.num[0]);
+  }
+  /**
+   * Check if a Swedish personal identity number is a coordination number or not.
+   *
+   * @return {boolean}
+   */
+  isCoordinationNumber() {
+    return testDate(
+      parseInt(this.century + this.year),
+      +this.month,
+      +this.day - 60
+    );
+  }
+  /**
+   * Check if a Swedish personal identity number is for a female.
+   *
+   * @return {boolean}
+   */
+  isFemale() {
+    return !this.isMale();
+  }
+  /**
+   * Check if a Swedish personal identity number is for a male.
+   *
+   * @return {boolean}
+   */
+  isMale() {
+    const sexDigit = parseInt(this.num.substr(-1));
+    return sexDigit % 2 === 1;
+  }
+};
+var src_default = Personnummer;
+
+function createCommonjsModule(fn, basedir, module) {
+	return module = {
+		path: basedir,
+		exports: {},
+		require: function (path, base) {
+			return commonjsRequire();
+		}
+	}, fn(module, module.exports), module.exports;
+}
+
+function commonjsRequire () {
+	throw new Error('Dynamic requires are not currently supported by @rollup/plugin-commonjs');
+}
+
+var utf8 = createCommonjsModule(function (module, exports) {
+// tslint:disable:no-bitwise
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.utf8 = void 0;
+exports.utf8 = {
+    encode: encode,
+    decode: decode,
+};
+function encode(unicodeText) {
+    unicodeText = unicodeText.replace(/\r\n/g, "\n");
+    var result = "";
+    for (var i = 0; i < unicodeText.length; i++) {
+        var char = unicodeText.charCodeAt(i);
+        if (char < 128) {
+            result += String.fromCharCode(char);
+        }
+        else if (char > 127 && char < 2048) {
+            result += String.fromCharCode((char >> 6) | 192);
+            result += String.fromCharCode((char & 63) | 128);
+        }
+        else {
+            result += String.fromCharCode((char >> 12) | 224);
+            result += String.fromCharCode(((char >> 6) & 63) | 128);
+            result += String.fromCharCode((char & 63) | 128);
+        }
+    }
+    return result;
+}
+function decode(utf8Text) {
+    var result = "";
+    var i = 0;
+    var char1 = 0;
+    var char2 = 0;
+    var char3 = 0;
+    while (i < utf8Text.length) {
+        char1 = utf8Text.charCodeAt(i);
+        if (char1 < 128) {
+            result += String.fromCharCode(char1);
+            i++;
+        }
+        else if (char1 > 191 && char1 < 224) {
+            char2 = utf8Text.charCodeAt(i + 1);
+            result += String.fromCharCode(((char1 & 31) << 6) | (char2 & 63));
+            i += 2;
+        }
+        else {
+            char2 = utf8Text.charCodeAt(i + 1);
+            char3 = utf8Text.charCodeAt(i + 2);
+            result += String.fromCharCode(((char1 & 15) << 12) | ((char2 & 63) << 6) | (char3 & 63));
+            i += 3;
+        }
+    }
+    return result;
+}
+});
+
+var md5 = createCommonjsModule(function (module, exports) {
+// tslint:disable:no-bitwise
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generate = void 0;
+
+function generate(unicodeText) {
+    var x = [];
+    var k;
+    var AA;
+    var BB;
+    var CC;
+    var DD;
+    var a;
+    var b;
+    var c;
+    var d;
+    var S11 = 7;
+    var S12 = 12;
+    var S13 = 17;
+    var S14 = 22;
+    var S21 = 5;
+    var S22 = 9;
+    var S23 = 14;
+    var S24 = 20;
+    var S31 = 4;
+    var S32 = 11;
+    var S33 = 16;
+    var S34 = 23;
+    var S41 = 6;
+    var S42 = 10;
+    var S43 = 15;
+    var S44 = 21;
+    var utf8Text = utf8.utf8.encode(unicodeText);
+    x = convertToWordArray(utf8Text);
+    a = 0x67452301;
+    b = 0xefcdab89;
+    c = 0x98badcfe;
+    d = 0x10325476;
+    for (k = 0; k < x.length; k += 16) {
+        AA = a;
+        BB = b;
+        CC = c;
+        DD = d;
+        a = FF(a, b, c, d, x[k + 0], S11, 0xd76aa478);
+        d = FF(d, a, b, c, x[k + 1], S12, 0xe8c7b756);
+        c = FF(c, d, a, b, x[k + 2], S13, 0x242070db);
+        b = FF(b, c, d, a, x[k + 3], S14, 0xc1bdceee);
+        a = FF(a, b, c, d, x[k + 4], S11, 0xf57c0faf);
+        d = FF(d, a, b, c, x[k + 5], S12, 0x4787c62a);
+        c = FF(c, d, a, b, x[k + 6], S13, 0xa8304613);
+        b = FF(b, c, d, a, x[k + 7], S14, 0xfd469501);
+        a = FF(a, b, c, d, x[k + 8], S11, 0x698098d8);
+        d = FF(d, a, b, c, x[k + 9], S12, 0x8b44f7af);
+        c = FF(c, d, a, b, x[k + 10], S13, 0xffff5bb1);
+        b = FF(b, c, d, a, x[k + 11], S14, 0x895cd7be);
+        a = FF(a, b, c, d, x[k + 12], S11, 0x6b901122);
+        d = FF(d, a, b, c, x[k + 13], S12, 0xfd987193);
+        c = FF(c, d, a, b, x[k + 14], S13, 0xa679438e);
+        b = FF(b, c, d, a, x[k + 15], S14, 0x49b40821);
+        a = GG(a, b, c, d, x[k + 1], S21, 0xf61e2562);
+        d = GG(d, a, b, c, x[k + 6], S22, 0xc040b340);
+        c = GG(c, d, a, b, x[k + 11], S23, 0x265e5a51);
+        b = GG(b, c, d, a, x[k + 0], S24, 0xe9b6c7aa);
+        a = GG(a, b, c, d, x[k + 5], S21, 0xd62f105d);
+        d = GG(d, a, b, c, x[k + 10], S22, 0x2441453);
+        c = GG(c, d, a, b, x[k + 15], S23, 0xd8a1e681);
+        b = GG(b, c, d, a, x[k + 4], S24, 0xe7d3fbc8);
+        a = GG(a, b, c, d, x[k + 9], S21, 0x21e1cde6);
+        d = GG(d, a, b, c, x[k + 14], S22, 0xc33707d6);
+        c = GG(c, d, a, b, x[k + 3], S23, 0xf4d50d87);
+        b = GG(b, c, d, a, x[k + 8], S24, 0x455a14ed);
+        a = GG(a, b, c, d, x[k + 13], S21, 0xa9e3e905);
+        d = GG(d, a, b, c, x[k + 2], S22, 0xfcefa3f8);
+        c = GG(c, d, a, b, x[k + 7], S23, 0x676f02d9);
+        b = GG(b, c, d, a, x[k + 12], S24, 0x8d2a4c8a);
+        a = HH(a, b, c, d, x[k + 5], S31, 0xfffa3942);
+        d = HH(d, a, b, c, x[k + 8], S32, 0x8771f681);
+        c = HH(c, d, a, b, x[k + 11], S33, 0x6d9d6122);
+        b = HH(b, c, d, a, x[k + 14], S34, 0xfde5380c);
+        a = HH(a, b, c, d, x[k + 1], S31, 0xa4beea44);
+        d = HH(d, a, b, c, x[k + 4], S32, 0x4bdecfa9);
+        c = HH(c, d, a, b, x[k + 7], S33, 0xf6bb4b60);
+        b = HH(b, c, d, a, x[k + 10], S34, 0xbebfbc70);
+        a = HH(a, b, c, d, x[k + 13], S31, 0x289b7ec6);
+        d = HH(d, a, b, c, x[k + 0], S32, 0xeaa127fa);
+        c = HH(c, d, a, b, x[k + 3], S33, 0xd4ef3085);
+        b = HH(b, c, d, a, x[k + 6], S34, 0x4881d05);
+        a = HH(a, b, c, d, x[k + 9], S31, 0xd9d4d039);
+        d = HH(d, a, b, c, x[k + 12], S32, 0xe6db99e5);
+        c = HH(c, d, a, b, x[k + 15], S33, 0x1fa27cf8);
+        b = HH(b, c, d, a, x[k + 2], S34, 0xc4ac5665);
+        a = II(a, b, c, d, x[k + 0], S41, 0xf4292244);
+        d = II(d, a, b, c, x[k + 7], S42, 0x432aff97);
+        c = II(c, d, a, b, x[k + 14], S43, 0xab9423a7);
+        b = II(b, c, d, a, x[k + 5], S44, 0xfc93a039);
+        a = II(a, b, c, d, x[k + 12], S41, 0x655b59c3);
+        d = II(d, a, b, c, x[k + 3], S42, 0x8f0ccc92);
+        c = II(c, d, a, b, x[k + 10], S43, 0xffeff47d);
+        b = II(b, c, d, a, x[k + 1], S44, 0x85845dd1);
+        a = II(a, b, c, d, x[k + 8], S41, 0x6fa87e4f);
+        d = II(d, a, b, c, x[k + 15], S42, 0xfe2ce6e0);
+        c = II(c, d, a, b, x[k + 6], S43, 0xa3014314);
+        b = II(b, c, d, a, x[k + 13], S44, 0x4e0811a1);
+        a = II(a, b, c, d, x[k + 4], S41, 0xf7537e82);
+        d = II(d, a, b, c, x[k + 11], S42, 0xbd3af235);
+        c = II(c, d, a, b, x[k + 2], S43, 0x2ad7d2bb);
+        b = II(b, c, d, a, x[k + 9], S44, 0xeb86d391);
+        a = addUnsigned(a, AA);
+        b = addUnsigned(b, BB);
+        c = addUnsigned(c, CC);
+        d = addUnsigned(d, DD);
+    }
+    return wordToHex(a) + wordToHex(b) + wordToHex(c) + wordToHex(d);
+}
+exports.generate = generate;
+function rotateLeft(lValue, iShiftBits) {
+    return (lValue << iShiftBits) | (lValue >>> (32 - iShiftBits));
+}
+function addUnsigned(lX, lY) {
+    var lX4;
+    var lY4;
+    var lX8;
+    var lY8;
+    var lResult;
+    lX8 = lX & 0x80000000;
+    lY8 = lY & 0x80000000;
+    lX4 = lX & 0x40000000;
+    lY4 = lY & 0x40000000;
+    lResult = (lX & 0x3fffffff) + (lY & 0x3fffffff);
+    if (lX4 & lY4) {
+        return lResult ^ 0x80000000 ^ lX8 ^ lY8;
+    }
+    if (lX4 | lY4) {
+        if (lResult & 0x40000000) {
+            return lResult ^ 0xc0000000 ^ lX8 ^ lY8;
+        }
+        else {
+            return lResult ^ 0x40000000 ^ lX8 ^ lY8;
+        }
+    }
+    else {
+        return lResult ^ lX8 ^ lY8;
+    }
+}
+function F(x, y, z) {
+    return (x & y) | (~x & z);
+}
+function G(x, y, z) {
+    return (x & z) | (y & ~z);
+}
+function H(x, y, z) {
+    return x ^ y ^ z;
+}
+function I(x, y, z) {
+    return y ^ (x | ~z);
+}
+function FF(a, b, c, d, x, s, ac) {
+    a = addUnsigned(a, addUnsigned(addUnsigned(F(b, c, d), x), ac));
+    return addUnsigned(rotateLeft(a, s), b);
+}
+function GG(a, b, c, d, x, s, ac) {
+    a = addUnsigned(a, addUnsigned(addUnsigned(G(b, c, d), x), ac));
+    return addUnsigned(rotateLeft(a, s), b);
+}
+function HH(a, b, c, d, x, s, ac) {
+    a = addUnsigned(a, addUnsigned(addUnsigned(H(b, c, d), x), ac));
+    return addUnsigned(rotateLeft(a, s), b);
+}
+function II(a, b, c, d, x, s, ac) {
+    a = addUnsigned(a, addUnsigned(addUnsigned(I(b, c, d), x), ac));
+    return addUnsigned(rotateLeft(a, s), b);
+}
+function convertToWordArray(value) {
+    var lWordCount;
+    var lMessageLength = value.length;
+    var lNumberOfWordsTemp1 = lMessageLength + 8;
+    var lNumberOfWordsTemp2 = (lNumberOfWordsTemp1 - (lNumberOfWordsTemp1 % 64)) / 64;
+    var lNumberOfWords = (lNumberOfWordsTemp2 + 1) * 16;
+    var lWordArray = Array(lNumberOfWords - 1);
+    var lBytePosition = 0;
+    var lByteCount = 0;
+    while (lByteCount < lMessageLength) {
+        lWordCount = (lByteCount - (lByteCount % 4)) / 4;
+        lBytePosition = (lByteCount % 4) * 8;
+        lWordArray[lWordCount] =
+            lWordArray[lWordCount] | (value.charCodeAt(lByteCount) << lBytePosition);
+        lByteCount++;
+    }
+    lWordCount = (lByteCount - (lByteCount % 4)) / 4;
+    lBytePosition = (lByteCount % 4) * 8;
+    lWordArray[lWordCount] = lWordArray[lWordCount] | (0x80 << lBytePosition);
+    lWordArray[lNumberOfWords - 2] = lMessageLength << 3;
+    lWordArray[lNumberOfWords - 1] = lMessageLength >>> 29;
+    return lWordArray;
+}
+function wordToHex(lValue) {
+    var wordToHexValue = "";
+    var wordToHexValueTemp = "";
+    var lByte;
+    var lCount;
+    for (lCount = 0; lCount <= 3; lCount++) {
+        lByte = (lValue >>> (lCount * 8)) & 255;
+        wordToHexValueTemp = "0" + lByte.toString(16);
+        wordToHexValue =
+            wordToHexValue + wordToHexValueTemp.substr(wordToHexValueTemp.length - 2, 2);
+    }
+    return wordToHexValue;
+}
+});
+
+var lib = createCommonjsModule(function (module, exports) {
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MD5 = exports.generate = void 0;
+
+var md5_2 = md5;
+Object.defineProperty(exports, "generate", { enumerable: true, get: function () { return md5_2.generate; } });
+exports.MD5 = {
+    generate: md5.generate,
+};
+});
+
+const apiSearch = async (query) => {
+  const res = await fetch(getCreditSafeApiUrl(), {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+    body: JSON.stringify({
+      query,
+      hash: lib.MD5.generate(String.fromCharCode(83, 101, 67, 82, 101, 116) + query),
+    }),
+  });
+  const data = await res.json();
+  return data;
+};
+
+const HemfixarnaGetuser = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.handleChangeEmail = (e) => {
+      this.emailError = null;
+      this.email = e.target.value;
+    };
+    this.handleChangePhone = (e) => {
+      this.phoneError = null;
+      this.phone = e.target.value;
+    };
+    this.handleChangessn = (e) => {
+      this.ssnError = null;
+      this.ssn = e.target.value;
+    };
+    this.handleSubmit = async (e) => {
+      e.preventDefault();
+      const emailRegex = new RegExp(/^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/);
+      const validEmail = emailRegex.test(this.email);
+      if (!validEmail) {
+        this.emailError = 'Ange en giltig e-postadress';
+      }
+      const validPhone = /^[\d\s()+-]{6,}$/.test(this.phone);
+      if (!validPhone) {
+        this.phoneError = 'Ange ett giltigt telefonnummer';
+      }
+      const validssn = src_default.valid(this.ssn);
+      if (!validssn) {
+        this.ssnError = 'Ange ett giltigt personnummer';
+      }
+      else if (validssn) {
+        const pn = src_default.parse(this.ssn).format(true);
+        this.ssn = [pn.slice(0, 8), '-', pn.slice(8)].join('');
+      }
+      if (validEmail && validPhone && validssn) {
+        try {
+          const creditSafeData = await apiSearch(this.ssn);
+          if (creditSafeData) {
+            index$1.state.creditSafeUser = creditSafeData;
+            index$1.state.checkoutStep = 2;
+            index$1.state.user = Object.assign(Object.assign({}, creditSafeData), { email: this.email, phone: this.phone, ssn: this.ssn });
+          }
+          else {
+            this.ssnError = 'Vi kunde tyvärr inte hitta en address med ditt angivna personnummer';
+          }
+        }
+        catch (e) {
+          this.ssnError = 'Vi kunde tyvärr inte hitta en address med ditt angivna personnummer';
+          console.log(e);
+        }
+        finally {
+          const el = this.el.closest('.hemfixarna_content');
+          scrollToTop(el);
+        }
+      }
+    };
+    this.render = () => {
+      return (index.h("form", { class: "mb-2", onSubmit: e => this.handleSubmit(e) }, index.h("div", null, index.h("input", { class: `${this.email.length ? 'input_active' : ''}`, onChange: e => this.handleChangeEmail(e), type: "email", name: "email", value: this.email }), index.h("label", { htmlFor: "email" }, "E-post ")), this.emailError && index.h("span", null, this.emailError), index.h("div", null, index.h("input", { class: `${this.phone.length ? 'input_active' : ''}`, onChange: e => this.handleChangePhone(e), type: "tel", name: "phone", value: this.phone }), index.h("label", { htmlFor: "phone" }, "Mobiltelefon ")), this.phoneError && index.h("span", null, this.phoneError), index.h("div", null, index.h("input", { class: `${this.ssn.length ? 'input_active' : ''}`, onChange: e => this.handleChangessn(e), type: "tel", name: "ssn", value: this.ssn }), index.h("label", { htmlFor: "phone" }, "Personnummer*")), this.ssnError && index.h("span", null, this.ssnError), index.h("input", { type: "submit", value: "Forts\u00E4tt*" }), index.h("p", null, "*Vi h\u00E4mtar din adress")));
+    };
+    this.email = '';
+    this.emailError = null;
+    this.phone = '';
+    this.phoneError = null;
+    this.ssn = '';
+    this.ssnError = null;
+  }
+  componentWillLoad() {
+    if (index$1.state.user) {
+      this.email = index$1.state.user.email;
+      this.phone = index$1.state.user.phone;
+      this.ssn = index$1.state.user.ssn;
+    }
+  }
+  get el() { return index.getElement(this); }
+};
+
+const HemfixarnaInfo = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.logo = index.getAssetPath(`./assets/hemfixarna.svg`);
+  }
+  render() {
+    var _a, _b;
+    const checked = index.getAssetPath(`./assets/checked.svg`);
+    return (index.h("div", { class: "hemfixarna_info" }, index$1.state.step < 5 ? (index.h(index.Fragment, null, index.h("h2", null, index$1.state.customer.info_title), index.h("p", null, index$1.state.customer.info_text))) : (index.h("h2", null, index$1.state.customer.checkout_title)), index.h("ul", { class: "hemfixarna_features" }, index$1.state.step < 5 ? (index.h(index.Fragment, null, ((_a = index$1.state.customer.trust_badges) === null || _a === void 0 ? void 0 : _a.length) ? (index.h(index.Fragment, null, index$1.state.customer.trust_badges.map(l => (index.h("li", { key: l.text }, index.h("img", { src: checked, alt: "checked" }), index.h("p", null, l.text)))))) : (index.h(index.Fragment, null, index$1.state.options.trust.map(l => (index.h("li", { key: l.trust_badge }, index.h("img", { src: checked, alt: "checked" }), index.h("p", null, l.trust_badge)))))))) : (index.h(index.Fragment, null, (_b = index$1.state.customer.checkout_trust_badges) === null || _b === void 0 ? void 0 : _b.map(l => (index.h("li", { key: l.text }, index.h("img", { src: checked, alt: "checked" }), index.h("p", null, l.text))))))), index.h("img", { src: this.logo, width: 200, alt: "hemfixarna" }), index.h("a", { class: "hemfixarna_product--link", target: "_blank", href: index$1.state.options.link.url }, index$1.state.options.link.title)));
+  }
+};
+
+const hemfixarnaInvoiceCss = ":host .invoice{gap:16px;display:grid}:host .invoice form>span{text-align:center;padding:16px 0}:host .invoice img{right:unset;left:unset;position:initial;transform:none}:host .invoice label{cursor:pointer;font-size:14px;display:flex;align-items:flex-start;padding:16px 0}:host .invoice label input{margin:0 5px 0 0;accent-color:#ea662c}:host .invoice-preview{display:flex;gap:4px}:host .invoice-preview div{position:relative}:host .invoice-preview div button{position:absolute;top:0;right:0;padding:0}:host .invoice-preview div button img{width:24px;height:24px}:host .invoice-preview div>img{width:100px;height:80px;object-fit:cover}:host .invoice input[type=email],:host .invoice input[type=tel],:host .invoice textarea{padding:16px;border:1px solid #fcd9c9;font-size:16px}:host .invoice textarea{resize:none;height:200px;font-family:\"Inter\", sans-serif}:host .invoice div:has(>input[type=file]){display:flex;align-items:center;justify-content:center;cursor:pointer;background:#fff;border:1px solid #fcd9c9;padding:32px 16px;gap:16px}:host .invoice div:has(>input[type=file]) span{color:#000;font-size:12px}:host .invoice input[type=file]{display:none}";
+
+const base = `${getApiUrl()}/wp-json/headless`;
+const HemfixarnaInvoice = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.formError = null;
+    this.displayImages = [];
+    this.formImages = [];
+    this.formState = 'initial';
+  }
+  isValidEmail(email) {
+    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+    return emailRegex.test(email);
+  }
+  componentDidRender() {
+    const form = this.el.querySelector('form');
+    if (form) {
+      form.addEventListener('input', () => {
+        this.formError = null;
+      });
+    }
+  }
+  disconnectedCallback() {
+    const form = this.el.querySelector('form');
+    if (form) {
+      form.removeEventListener('input', () => {
+        this.formError = null;
+      });
+    }
+  }
+  async submit(e) {
+    var _a;
+    e.preventDefault();
+    this.formState = 'loading';
+    this.formError = null;
+    const form = e.currentTarget.elements;
+    const values = {
+      description: form.descriptionInput.value.length ? form.descriptionInput.value : null,
+      email: form.emailInput.value.length ? form.emailInput.value : null,
+      tel: form.telInput.value.length ? form.telInput.value : null,
+      terms: (_a = form.termsInput) === null || _a === void 0 ? void 0 : _a.checked,
+    };
+    if (!values.description) {
+      this.formError = 'Vänligen fyll i formulärtexten';
+      this.formState = 'initial';
+      return;
+    }
+    if (!values.email || !this.isValidEmail(values.email)) {
+      this.formError = 'Vänligen ange en giltig e-postadress';
+      this.formState = 'initial';
+      return;
+    }
+    if (!values.tel) {
+      this.formError = 'Vänligen ange ditt telefonnummer';
+      this.formState = 'initial';
+      return;
+    }
+    if (index$1.state.selectedProduct.terms_show_checkbox && !values.terms) {
+      this.formError = 'Vänligen acceptera villkoren';
+      this.formState = 'initial';
+      return;
+    }
+    const formData = new FormData();
+    formData.append('text', values.description);
+    formData.append('email', values.email);
+    formData.append('phone', values.tel);
+    formData.append('customer', index$1.state.business);
+    this.formImages.forEach(file => {
+      formData.append('images[]', file);
+    });
+    formData.append('product', JSON.stringify({
+      title: index$1.state.selectedProduct.title,
+      amount: 1,
+      has_rut: index$1.state.selectedProduct.rut,
+      has_rot: index$1.state.selectedProduct.rot,
+      has_green: index$1.state.selectedProduct.green,
+      ID: index$1.state.selectedProduct.ID,
+      parts: [],
+    }));
+    try {
+      const res = await fetch(`${base}/saveinvoiceproduct`, {
+        method: 'POST',
+        body: formData,
+      });
+      const { response } = await res.json();
+      if (response.code === 200) {
+        index$1.state.checkoutInvoice = true;
+        index$1.state.step = 6;
+      }
+      else {
+        this.formError = 'Vi kan inte ta emot din beställning just nu';
+        this.formState = 'initial';
+      }
+    }
+    catch (error) {
+      this.formError = 'Vi kan inte ta emot din beställning just nu';
+      this.formState = 'initial';
+    }
+  }
+  handleImageDrop(e) {
+    e.preventDefault();
+    const files = e.dataTransfer.files;
+    for (let i = 0; i < files.length; i++) {
+      const file = files[i];
+      if (file.type.startsWith('image/')) {
+        const reader = new FileReader();
+        reader.onload = () => {
+          this.displayImages = [...this.displayImages, reader.result];
+          this.formImages = [...this.formImages, file];
+        };
+        reader.readAsDataURL(file);
+      }
+    }
+  }
+  handleFileInputChange(e) {
+    e.preventDefault();
+    const files = e.target.files;
+    for (let i = 0; i < files.length; i++) {
+      const file = files[i];
+      if (file.type.startsWith('image/')) {
+        const reader = new FileReader();
+        reader.onload = () => {
+          this.displayImages = [...this.displayImages, reader.result];
+          this.formImages = [...this.formImages, file];
+        };
+        reader.readAsDataURL(file);
+      }
+    }
+  }
+  handleImageClick() {
+    this.el.querySelector('.hemfixarna-file-upload').click();
+  }
+  preventDragOver(e) {
+    e.preventDefault();
+  }
+  removeImage(index) {
+    this.displayImages = this.displayImages.filter((_, i) => i !== index);
+    this.formImages = this.formImages.filter((_, i) => i !== index);
+  }
+  render() {
+    var _a;
+    const upload = index.getAssetPath(`./assets/drag-drop.svg`);
+    return (index.h("div", { class: "invoice" }, ((_a = index$1.state.selectedProduct) === null || _a === void 0 ? void 0 : _a.invoice_description) ? index.h("p", null, index$1.state.selectedProduct.invoice_description) : null, index.h("form", { onSubmit: e => this.submit(e) }, index.h("textarea", { name: "descriptionInput", placeholder: "Beskriv ditt \u00E4rende" }), index.h("div", { role: "button", "aria-label": "upload image", onDragOver: e => this.preventDragOver(e), onDrop: e => this.handleImageDrop(e), onClick: () => this.handleImageClick() }, index.h("img", { src: upload, alt: "hemfixarna_logo", width: 24 }), index.h("div", null, index.h("p", null, "Bifoga ev bilder"), index.h("span", null, "(dra bilder hit)")), index.h("input", { onChange: e => this.handleFileInputChange(e), class: "hemfixarna-file-upload", accept: "image/*", type: "file", multiple: true, name: "fileInput" })), index.h("div", { class: "invoice-preview" }, this.displayImages.map((img, i) => (index.h("div", { key: i }, index.h("img", { src: img, alt: "uploaded image" }), index.h("button", { onClick: () => this.removeImage(i) }, index.h("img", { src: index.getAssetPath(`./assets/close.svg`), alt: "close" })))))), index.h("input", { placeholder: "E-post", type: "email", name: "emailInput" }), index.h("input", { placeholder: "Telefonnummer", type: "tel", name: "telInput" }), index$1.state.selectedProduct.terms_show_checkbox ? (index.h("label", null, index.h("input", { type: "checkbox", name: "termsInput" }), index$1.state.selectedProduct.terms)) : null, this.formError ? index.h("span", null, this.formError) : null, index.h("input", { type: "submit", value: this.formState === 'loading' ? 'Skickar' : 'Kontakta mig' }))));
+  }
+  get el() { return index.getElement(this); }
+};
+HemfixarnaInvoice.style = hemfixarnaInvoiceCss;
+
+const HemfixarnaOrder = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.render = () => {
+      return (index.h("div", { style: { background: `url(${index$1.state.options.thank_you_image})` }, class: "hemfixarna_order" }, index.h("div", null), index.h("div", null, index.h("h2", null, index$1.state.checkoutInvoice ? 'Tack för din förfrågan' : 'Tack för din bokning'), index$1.state.checkoutInvoice ? index.h("p", null, "Vi \u00E5terkommer inom kort till dig p\u00E5 angivet telefonnummer eller epost") : null, index$1.state.checkoutInvoice ? index.h("div", null) : index.h("hemfixarna-orderrows", { cart: false }), index.h("span", { onClick: () => this.resetShop() }, index.h("button", null, "G\u00F6r en ny bokning")), index.h("hemfixarna-info", null))));
+    };
+  }
+  resetShop() {
+    index$1.state.step = 1;
+    index$1.state.cart = [];
+    index$1.state.selectedCategory = null;
+    index$1.state.selectedService = null;
+    index$1.state.selectedProduct = null;
+    index$1.state.maleri = null;
+    index$1.state.checkoutStep = 1;
+  }
+  disconnectedCallback() {
+    this.resetShop();
+  }
+};
+
+const HemfixarnaOrderrows = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.cart = true;
+  }
+  goToProduct(id) {
+    const products = index$1.state.customer.categories
+      .map(c => (c.show_products ? c.products : c.sub_categories ? c.sub_categories.map(c => c.products) : []))
+      .flat()
+      .flat();
+    const product = products.find(p => p && p.fields.ID === id);
+    if (product) {
+      index$1.state.selectedProduct = product.fields;
+      index$1.state.step = 4;
+    }
+  }
+  openModal(title, text) {
+    index$1.state.modal = {
+      title,
+      text,
+    };
+  }
+  getDiscountedInfo(item) {
+    if (item.rut && index$1.state.rut) {
+      return ' (efter RUT-avdrag)';
+    }
+    else if (item.rot && index$1.state.rot) {
+      return ' (efter ROT-avdrag)';
+    }
+    else if (item.green && index$1.state.green) {
+      return ' (efter Grön teknik avdrag)';
+    }
+    else {
+      return '';
+    }
+  }
+  renderStartFees() {
+    const startFees = new Set();
+    const fees = [];
+    index$1.state.cart.forEach(item => {
+      const startFee = item.start_fee_obj;
+      if (startFee && !startFees.has(startFee.ID)) {
+        startFees.add(startFee.ID);
+        const rotStartFee = item.rot ? calculateStartFee().rot : 0;
+        const rutStartFee = item.rut ? calculateStartFee().rut : 0;
+        const greenStartFee = item.green ? calculateStartFee().green : 0;
+        fees.push({
+          id: startFee.ID,
+          name: startFee.title,
+          price: startFee.price,
+          text: startFee.pop_up,
+          rot: rotStartFee,
+          rut: rutStartFee,
+          green: greenStartFee,
+        });
+      }
+    });
+    return fees.map(fee => (index.h("div", { key: fee.id, class: "hemfixarna_cart--startfee" }, index.h("p", { onClick: () => this.openModal(fee.name, fee.text) }, index.h("strong", null, fee.name), index.h("img", { height: 16, src: index.getAssetPath('./assets/info.svg'), alt: "info monteringsavgift" })), index.h("p", null, !fee.rut && !fee.rot && !fee.green && index.h("span", null, fee.price, "kr"), fee.rut > 0 && index.h("span", null, fee.rut, "kr (RUT)"), fee.rot > 0 && index.h("span", null, fee.rot, "kr (ROT)"), fee.green > 0 && index.h("span", null, fee.green, "kr (Gr\u00F6n teknik)")))));
+  }
+  render() {
+    return (index.h(index.Fragment, null, index.h("ul", { class: "hemfixarna_cart--items" }, Object.entries(groupCartItemsByStartFee(index$1.state.cart)).map(([startFeeID, items]) => (index.h("li", { key: startFeeID, class: "hemfixarna_cart--group" }, index.h("ul", null, items.map(item => {
+      var _a;
+      return (index.h("li", { class: "hemfixarna_cart--item", key: item.id }, index.h("div", null, index.h("div", null, item.icon && (index.h("img", { width: 30, src: (_a = item.icon.url) !== null && _a !== void 0 ? _a : item.icon, alt: item.name })), index.h("p", null, index.h("strong", null, item.amount, "x "), item.name)), this.cart && (index.h("button", { onClick: () => this.goToProduct(item.id) }, "\u00C4ndra"))), index.h("p", null, index.h("strong", null, getProductPrice(item, item.price, item.amount), "kr"), index.h("span", null, this.getDiscountedInfo(item))), item.parts.length > 0 && (index.h("ul", null, item.parts.map(part => (index.h("li", { key: part.name }, index.h("p", null, index.h("strong", null, part.amount, "x "), part.name), index.h("p", null, index.h("strong", null, getPartPrice(part, item, part.amount), "kr")))))))));
+    })))))), index.h("div", { class: "hemfixarna_cart--additional" }, this.renderStartFees(), this.cart && index$1.state.cart.find((item) => item.rot) && (index.h("div", { class: "hemfixarna_cart--rutrot" }, index.h("div", null, index.h("label", { class: "switch" }, index.h("input", { checked: index$1.state.rot, onChange: () => (index$1.state.rot = !index$1.state.rot), type: "checkbox" }), index.h("span", { class: "slider" })), index.h("p", null, "ROT-avdrag")), index.h("p", null, "(-", index$1.state.rot ? calculateRot() : 0, "kr)"))), this.cart && index$1.state.cart.find((item) => item.rut) && (index.h("div", { class: "hemfixarna_cart--rutrot" }, index.h("div", null, index.h("label", { class: "switch" }, index.h("input", { onChange: () => (index$1.state.rut = !index$1.state.rut), checked: index$1.state.rut, type: "checkbox" }), index.h("span", { class: "slider" })), index.h("p", null, "RUT-avdrag")), index.h("p", null, "(-", index$1.state.rut ? calculateRut() : 0, "kr)"))), this.cart && index$1.state.cart.find((item) => item.green) && (index.h("div", { class: "hemfixarna_cart--rutrot" }, index.h("div", null, index.h("label", { class: "switch" }, index.h("input", { onChange: () => (index$1.state.green = !index$1.state.green), checked: index$1.state.green, type: "checkbox" }), index.h("span", { class: "slider" })), index.h("p", null, "Gr\u00F6n teknik avdrag")), index.h("p", null, "(-", index$1.state.green ? calculateGreenDiscount() : 0, "kr)")))), index.h("div", { class: "hemfixarna_cart--price" }, index.h("h2", null, "Totalbelopp: "), index.h("h2", null, getTotalPrice(), "kr"))));
+  }
+};
+
+const hemfixarnaProductCss = "";
+
+const HemfixarnaProduct = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.amount = 0;
+    this.hideDescription = true;
+  }
+  addProduct() {
+    const productInCart = index$1.state.cart.find(p => p.id === index$1.state.selectedProduct.ID);
+    if (productInCart) {
+      productInCart.amount++;
+      index$1.state.cart = [...index$1.state.cart];
+    }
+    else {
+      index$1.state.cart = [
+        ...index$1.state.cart,
+        {
+          id: index$1.state.selectedProduct.ID,
+          rut: index$1.state.selectedProduct.rut,
+          rot: index$1.state.selectedProduct.rot,
+          green: index$1.state.selectedProduct.green,
+          amount: 1,
+          parts: [],
+          price: index$1.state.selectedProduct.price,
+          name: index$1.state.selectedProduct.title,
+          start_fee: !index$1.state.selectedProduct.hide_start_fee,
+          terms_checkout: index$1.state.selectedProduct.terms_checkout,
+          icon: index$1.state.selectedProduct.icon,
+          start_fee_obj: index$1.state.selectedProduct.start_fee_obj,
+        },
+      ];
+    }
+  }
+  removeProduct() {
+    const productInCart = index$1.state.cart.find(p => p.id === index$1.state.selectedProduct.ID);
+    if (productInCart && productInCart.amount > 1) {
+      productInCart.amount--;
+      index$1.state.cart = [...index$1.state.cart];
+    }
+    else {
+      index$1.state.cart = index$1.state.cart.filter(p => p.id !== index$1.state.selectedProduct.ID);
+    }
+  }
+  //Handle cart and parts
+  addPart(part) {
+    var _a;
+    const productInCart = index$1.state.cart.find(p => p.id === index$1.state.selectedProduct.ID);
+    if (productInCart) {
+      const partInCart = productInCart.parts.find(sp => sp.id === part.ID);
+      if (partInCart) {
+        partInCart.amount++;
+        productInCart.parts = [...productInCart.parts];
+      }
+      else {
+        productInCart.parts = [...productInCart.parts, { id: part.ID, amount: 1, price: part.price, name: (_a = part.title) !== null && _a !== void 0 ? _a : part.title }];
+      }
+      index$1.state.cart = [...index$1.state.cart.filter(p => p.id !== productInCart.id), productInCart];
+    }
+  }
+  removePart(part) {
+    const productInCart = index$1.state.cart.find(p => p.id === index$1.state.selectedProduct.ID);
+    if (productInCart) {
+      const partInCart = productInCart.parts.find(sp => sp.id === part.ID);
+      if (partInCart && partInCart.amount > 1) {
+        partInCart.amount--;
+        productInCart.parts = [...productInCart.parts];
+      }
+      else {
+        productInCart.parts = productInCart.parts.filter(sp => sp.id !== part.ID);
+      }
+      index$1.state.cart = [...index$1.state.cart.filter(p => p.id !== productInCart.id), productInCart];
+    }
+  }
+  goToCart() {
+    const productInCart = index$1.state.cart.find(p => p.id === index$1.state.selectedProduct.ID);
+    if (productInCart) {
+      index$1.state.step = 5;
+      const el = this.el.closest('.hemfixarna_content');
+      scrollToTop(el);
+    }
+  }
+  getAmount() {
+    var _a;
+    return ((_a = index$1.state.cart.find(p => p.id === index$1.state.selectedProduct.ID)) === null || _a === void 0 ? void 0 : _a.amount) || 0;
+  }
+  getPartAmount(partId) {
+    var _a;
+    const productInCart = index$1.state.cart.find(p => p.id === index$1.state.selectedProduct.ID);
+    return ((_a = productInCart === null || productInCart === void 0 ? void 0 : productInCart.parts.find(sp => sp.id === partId)) === null || _a === void 0 ? void 0 : _a.amount) || 0;
+  }
+  getTotalPrice() {
+    let price = 0;
+    const productInCart = index$1.state.cart.find(p => p.id === index$1.state.selectedProduct.ID);
+    if (productInCart) {
+      const partsPrice = productInCart.parts.reduce((acc, curr) => {
+        const part = index$1.state.selectedProduct.parts.find(p => p.ID === curr.id);
+        if (part) {
+          return acc + part.price * curr.amount;
+        }
+        return acc;
+      }, 0);
+      price = index$1.state.selectedProduct.price * productInCart.amount + partsPrice;
+    }
+    else {
+      price = index$1.state.selectedProduct.price;
+    }
+    return getProductPrice(index$1.state.selectedProduct, price);
+  }
+  componentDidRender() {
+    const linkElem = document.createElement('link');
+    linkElem.setAttribute('rel', 'stylesheet');
+    linkElem.setAttribute('href', 'https://painting-frontend.vercel.app/static/css/main.css');
+    const fonts = document.createElement('link');
+    fonts.setAttribute('rel', 'stylesheet');
+    fonts.setAttribute('href', 'https://painting-frontend.vercel.app/fonts.css');
+    const checkAndInjectCSS = () => {
+      const parents = this.el.getElementsByTagName('hemfixare-calculator');
+      if (parents.length > 0 && parents[0].shadowRoot !== null) {
+        parents[0].shadowRoot.appendChild(linkElem);
+        parents[0].shadowRoot.appendChild(fonts);
+      }
+      else {
+        setTimeout(checkAndInjectCSS, 1);
+      }
+    };
+    checkAndInjectCSS();
+  }
+  render() {
+    var _a, _b, _c, _d;
+    const checked = index.getAssetPath(`./assets/checked.svg`);
+    const plus = index.getAssetPath(`./assets/plus.svg`);
+    const minus = index.getAssetPath(`./assets/minus.svg`);
+    if (index$1.state.maleri) {
+      return (index.h("div", { class: "hemfixarna_painting" }, index.h("script", { type: "text/javascript", src: ['localhost', 'vercel'].some(v => window.location.href.includes(v))
+          ? 'https://painting-dev.vercel.app/static/js/main.js'
+          : 'https://painting-frontend.vercel.app/static/js/main.js', defer: true, async: true }), index.h("hemfixare-calculator", { title: index$1.state.options.maleri_title, subtitle: index$1.state.options.maleri_text, modal: "true", customer: index$1.state.business === index$2.Business.string ? 'string' : index$1.state.business })));
+    }
+    return index$1.state.selectedProduct ? (index.h("div", { class: "hemfixarna_product" }, index.h("div", { class: "hemfixarna_product--top" }, index$1.state.selectedProduct.icon && (index.h("img", { width: 80, src: (_a = index$1.state.selectedProduct.icon.url) !== null && _a !== void 0 ? _a : index$1.state.selectedProduct.icon, alt: index$1.state.selectedProduct.title })), index.h("div", null, index.h("h1", null, index$1.state.selectedProduct.title), !index$1.state.selectedProduct.invoice ? index.h("h2", null, getProductPrice(index$1.state.selectedProduct), " kr/st") : index.h("h2", null, index$1.state.selectedProduct.invoice_price))), index.h("div", { class: "hemfixarna_product--grid" }, index.h("div", { class: "hemfixarna_product--left" }, ((_b = index$1.state.selectedProduct.list) === null || _b === void 0 ? void 0 : _b.length) && (index.h("ul", { class: "hemfixarna_features" }, index$1.state.selectedProduct.list.map(l => (index.h("li", { key: l.bullet }, index.h("img", { src: checked, alt: "checked" }), index.h("p", null, l.bullet)))))), index$1.state.selectedProduct.description && (index.h("p", { onClick: () => (this.hideDescription = false), class: `hemfixarna_description ${this.hideDescription ? 'hemfixarna_description--hidden' : ''}`, innerHTML: index$1.state.selectedProduct.description }))), index.h("div", { class: "hemfixarna_product--right" }, index$1.state.selectedProduct.invoice ? (index.h("hemfixarna-invoice", null)) : (index.h(index.Fragment, null, index.h("ul", null, index.h("li", { class: "hemfixarna_product--item" }, index.h("div", null, index.h("p", null, index$1.state.selectedProduct.title), index.h("p", { class: "hemfixarna_product--price" }, getProductPrice(index$1.state.selectedProduct), "kr/st")), index.h("div", { class: "hemfixarna_counter" }, index.h("img", { class: `${this.getAmount() === 0 ? 'disabled' : ''}`, src: minus, onClick: () => this.removeProduct() }), index.h("span", null, this.getAmount()), index.h("img", { src: plus, onClick: () => this.addProduct() }))), ((_c = index$1.state.selectedProduct.parts) === null || _c === void 0 ? void 0 : _c.length) &&
+      index$1.state.selectedProduct.parts.map(p => {
+        var _a;
+        return (index.h("li", { class: "hemfixarna_part" }, index.h("div", null, index.h("p", null, (_a = p.title) !== null && _a !== void 0 ? _a : p.title), index.h("p", { class: "hemfixarna_product--price" }, getPartPrice(p, index$1.state.selectedProduct), "kr/st")), index.h("div", { class: "hemfixarna_counter" }, index.h("img", { class: `${this.getPartAmount(p.ID) === 0 ? 'disabled' : ''}`, src: minus, onClick: () => this.removePart(p) }), index.h("span", null, this.getPartAmount(p.ID)), index.h("img", { class: `${this.getAmount() === 0 ? 'disabled' : ''}`, src: plus, onClick: () => this.addPart(p) }))));
+      })), index.h("h4", { class: "hemfixarna_product--total" }, "Totalt ", this.getTotalPrice(), " kr"), index.h("button", { onClick: () => this.goToCart(), class: `hemfixarna_buy ${this.getAmount() === 0 ? 'disabled' : ''}` }, "Forts\u00E4tt"))), !index$1.state.selectedProduct.hide_start_fee && ((_d = index$1.state.selectedProduct.start_fee_obj) === null || _d === void 0 ? void 0 : _d.title) && (index.h("p", { class: "hemfixarna_terms" }, index.h("strong", null, index$1.state.selectedProduct.start_fee_obj.title), index.h("br", null), index.h("span", { innerHTML: index$1.state.selectedProduct.start_fee_obj.description }))), index$1.state.options && index.h("hemfixarna-info", null))))) : null;
+  }
+  get el() { return index.getElement(this); }
+};
+HemfixarnaProduct.style = hemfixarnaProductCss;
+
+const HemfixarnaGrid = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.tree = undefined;
+    this.slug = undefined;
+  }
+  isMainCategory(category) {
+    return category.show_products !== undefined;
+  }
+  handleMaleriClick() {
+    index$1.state.step = 4;
+    index$1.state.maleri = true;
+  }
+  render() {
+    var _a;
+    const maleriLogo = index.getAssetPath('./assets/gubbe-pensel.svg');
+    return index$1.state.customer ? (index.h("div", null, index.h("h2", null, index$1.state.selectedCustomerCategory ? index$1.state.selectedCustomerCategory.name : 'Alla tjänster'), index.h("div", { class: "hemfixarna_categories--wrapper" }, index.h("ul", { class: "hemfixarna_categories" }, ((_a = index$1.state.selectedCustomerCategory) === null || _a === void 0 ? void 0 : _a.add_painting) ? (index.h("button", { onClick: () => this.handleMaleriClick(), class: "hemfixarna_maleribox" }, index.h("img", { height: 64, src: maleriLogo, alt: "M\u00E5leri Logotyp" }), index.h("p", null, "Ber\u00E4kna fast pris p\u00E5 m\u00E5leri & tapetsering h\u00E4r"))) : null, index$1.state.selectedCustomerCategory
+      ? this.isMainCategory(index$1.state.selectedCustomerCategory) && index$1.state.selectedCustomerCategory.sub_categories && !index$1.state.selectedCustomerCategory.show_products
+        ? index$1.state.selectedCustomerCategory.sub_categories.map(c => index.h("hemfixarna-box", { category: c }))
+        : index$1.state.selectedCustomerCategory.products
+          ? index$1.state.selectedCustomerCategory.products.map(c => index.h("hemfixarna-box", { category: c.fields }))
+          : null
+      : index$1.state.customer.categories.map(c => index.h("hemfixarna-box", { category: c }))), index.h("hemfixarna-info", null)))) : (index.h("div", null, index.h("h2", null, "Alla tj\u00E4nster"), index.h("div", { class: "hemfixarna_categories--wrapper" }, index.h("ul", { class: "hemfixarna_categories" }, this.tree.sub_cats
+      .sort((a, b) => (a.name < b.name ? -1 : 1))
+      .map(c => {
+      var _a;
+      return (index.h("hemfixarna-box", { post: c, icon: (_a = c.icon.url) !== null && _a !== void 0 ? _a : c.icon, postTitle: c.name }));
+    })), index.h("hemfixarna-info", null))));
+  }
+};
+
+exports.hemfixarna_address = HemfixarnaAddress;
+exports.hemfixarna_box = HemfixarnaBox;
+exports.hemfixarna_breadcrumbs = HemfixarnaBreadcrumbs;
+exports.hemfixarna_cart = HemfixarnaCart;
+exports.hemfixarna_checkout = HemfixarnaCheckout;
+exports.hemfixarna_component = HemfixarnaComponent;
+exports.hemfixarna_contact = HemfixarnaInfo$1;
+exports.hemfixarna_demo = MyComponent;
+exports.hemfixarna_getuser = HemfixarnaGetuser;
+exports.hemfixarna_info = HemfixarnaInfo;
+exports.hemfixarna_invoice = HemfixarnaInvoice;
+exports.hemfixarna_order = HemfixarnaOrder;
+exports.hemfixarna_orderrows = HemfixarnaOrderrows;
+exports.hemfixarna_product = HemfixarnaProduct;
+exports.hemfixarna_start = HemfixarnaGrid;
+
+//# sourceMappingURL=hemfixarna-address_15.cjs.entry.js.map