@konnectio/core 4.0.56-rc4 → 4.0.56-rc6

package/dist/gift-card.js

@@ -1,131 +1,130 @@
-var ve = Object.defineProperty;
+var fe = Object.defineProperty;
 var ae = Object.getOwnPropertySymbols;
-var ge = Object.prototype.hasOwnProperty, be = Object.prototype.propertyIsEnumerable;
-var le = (u, t, r) => t in u ? ve(u, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : u[t] = r, te = (u, t) => {
-  for (var r in t || (t = {}))
-    ge.call(t, r) && le(u, r, t[r]);
+var ve = Object.prototype.hasOwnProperty, ge = Object.prototype.propertyIsEnumerable;
+var le = (c, l, i) => l in c ? fe(c, l, { enumerable: !0, configurable: !0, writable: !0, value: i }) : c[l] = i, te = (c, l) => {
+  for (var i in l || (l = {}))
+    ve.call(l, i) && le(c, i, l[i]);
   if (ae)
-    for (var r of ae(t))
-      be.call(t, r) && le(u, r, t[r]);
-  return u;
+    for (var i of ae(l))
+      ge.call(l, i) && le(c, i, l[i]);
+  return c;
 };
-var J = (u, t, r) => new Promise((o, s) => {
-  var h = (m) => {
+var J = (c, l, i) => new Promise((t, n) => {
+  var g = (d) => {
     try {
-      v(r.next(m));
-    } catch (g) {
-      s(g);
+      m(i.next(d));
+    } catch (y) {
+      n(y);
     }
-  }, f = (m) => {
+  }, p = (d) => {
     try {
-      v(r.throw(m));
-    } catch (g) {
-      s(g);
+      m(i.throw(d));
+    } catch (y) {
+      n(y);
     }
-  }, v = (m) => m.done ? o(m.value) : Promise.resolve(m.value).then(h, f);
-  v((r = r.apply(u, t)).next());
+  }, m = (d) => d.done ? t(d.value) : Promise.resolve(d.value).then(g, p);
+  m((i = i.apply(c, l)).next());
 });
-import { ref as _, computed as V, defineComponent as Z, openBlock as p, createBlock as L, withCtx as D, createElementVNode as d, createElementBlock as b, createVNode as n, unref as e, createCommentVNode as T, normalizeClass as ue, watch as ye, onMounted as he, Suspense as ke, toDisplayString as oe, withDirectives as W, vShow as j, Fragment as Ce, renderList as _e, isRef as C, createApp as Ve } from "vue";
-import { d as Fe, u as Pe, s as X, c as ce, H as $, e as Y, i as ie, S as Q, h as we, f as Te, J as Se, l as pe, b as Ue, I as $e, C as z, _ as me, m as Ee, j as qe, L as ne, T as H, k as Ie, q as Re, t as Le, D as Ge } from "./SelectField.vue_vue_type_style_index_0_lang-3YCxOJhZ.js";
-import { C as Me } from "./Container-XBRB0sOV.js";
-import { a as xe, C as re, P as De, _ as ze } from "./CheckoutWindow-2RMgPiGi.js";
-import { E as Ae } from "./_-oPH7HiaC.js";
-import { F as x } from "./Field-uK3Wuuv6.js";
-import "./_commonjsHelpers-FF1eOqK0.js";
-const se = Fe("giftCard", () => {
-  const { pay: u } = Pe(), { bearerToken: t, metaData: r, currencyId: o } = X(ce()), s = _($.InitialState), h = Y("konnectio_name", "", void 0, { serializer: Q.string }), f = Y("konnectio_email", "", void 0, { serializer: Q.string }), v = Y("konnectio_phone", "", void 0, { serializer: Q.string }), m = _(""), g = _(1), S = _(!0), G = _(""), k = _({
+import { d as ye, u as be, s as X, c as ue, r as _, ad as $, e as Y, f as V, j as oe, S as Q, i as he, h as ke, ae as Ce, k as Z, F as ce, b as _e, o as v, m as L, w as G, x as u, l as b, p as r, z as e, C as B, n as T, q as pe, I as Ve, _ as me, a2 as Fe, B as we, G as Pe, H as ne, af as W, ag as j, a3 as Te, a4 as Se, J as C, y as Ue, a5 as ie, T as H, A as $e, P as Ee, U as Ie, V as Re, W as qe, a9 as Le } from "./SelectField.vue_vue_type_style_index_0_lang-C-MscjWo.js";
+import { C as Me } from "./Container-w7O0He-s.js";
+import { a as xe, C as se, P as Ae, _ as Ge } from "./CheckoutWindow-T7-vrZyG.js";
+import { E as Be } from "./_-TlutFgf7.js";
+import { F as A } from "./Field-fWwF40rD.js";
+import "./_commonjsHelpers-4t9S7M5p.js";
+const re = ye("giftCard", () => {
+  const { pay: c } = be(), { bearerToken: l, metaData: i, currencyId: t } = X(ue()), n = _($.InitialState), g = Y("konnectio_name", "", void 0, { serializer: Q.string }), p = Y("konnectio_email", "", void 0, { serializer: Q.string }), m = Y("konnectio_phone", "", void 0, { serializer: Q.string }), d = _(""), y = _(1), S = _(!0), M = _(""), k = _({
     base64: "",
     type: "",
     name: ""
-  }), l = _(void 0), c = _(0), y = _(!1), q = _(0), F = V(() => s.value === $.InitialState || s.value === $.WaitingForResponse), I = V(() => s.value === $.ReadyToPay), M = V(() => s.value === $.PaymentSuccess), P = V(() => {
+  }), o = _(void 0), f = _(0), h = _(!1), I = _(0), F = V(() => n.value === $.InitialState || n.value === $.WaitingForResponse), R = V(() => n.value === $.ReadyToPay), x = V(() => n.value === $.PaymentSuccess), w = V(() => {
     const a = {
       1: {
-        label: ie.t("giftCard.hotelType"),
+        label: oe.t("giftCard.hotelType"),
         data: []
       },
       2: {
-        label: ie.t("giftCard.restaurantType"),
+        label: oe.t("giftCard.restaurantType"),
         data: []
       }
-    }, U = r.value.hotels[0].places;
-    return U && U.forEach((w) => {
-      a[w.placeType].data.push(w);
+    }, U = i.value.hotels[0].places;
+    return U && U.forEach((P) => {
+      a[P.placeType].data.push(P);
     }), Object.fromEntries(
-      Object.entries(a).filter(([, w]) => w.data.length > 0)
+      Object.entries(a).filter(([, P]) => P.data.length > 0)
     );
-  }), A = V(() => q.value !== 0), E = V(() => {
+  }), z = V(() => I.value !== 0), E = V(() => {
     let a;
-    if (A.value)
-      a = P.value[q.value].data[0];
-    else if (c.value !== 0) {
-      const U = l.value, w = P.value[c.value].data;
-      w.length === 1 ? a = w[0] : U !== void 0 && w.forEach((ee) => {
+    if (z.value)
+      a = w.value[I.value].data[0];
+    else if (f.value !== 0) {
+      const U = o.value, P = w.value[f.value].data;
+      P.length === 1 ? a = P[0] : U !== void 0 && P.forEach((ee) => {
         String(ee.id) === String(U) && (a = ee);
       });
     }
     return a;
-  }), B = V(() => !(!h.value || !f.value || !(v.value.length >= 5) || !m.value || E.value === void 0)), O = V(() => !(s.value === $.InitialState && y.value)), K = V(() => !!(s.value === $.WaitingForResponse && y.value));
-  function R() {
+  }), D = V(() => !(!g.value || !p.value || !(m.value.length >= 5) || !d.value || E.value === void 0)), O = V(() => !(n.value === $.InitialState && h.value)), K = V(() => !!(n.value === $.WaitingForResponse && h.value));
+  function q() {
     return J(this, null, function* () {
-      s.value = $.WaitingForResponse, y.value = !0, yield we.post("https://production.hotel-service.konnectio.dk/api/gift-card/create", {
+      n.value = $.WaitingForResponse, h.value = !0, yield he.post("https://production.hotel-service.konnectio.dk/api/gift-card/create", {
         termsOfserviceURL: window.location.origin,
         checkoutUrl: window.location.origin,
-        currencyID: o.value,
-        language: Te(),
-        amount: m.value,
-        quantity: g.value,
-        freeText: G.value,
+        currencyID: t.value,
+        language: ke(),
+        amount: d.value,
+        quantity: y.value,
+        freeText: M.value,
         showPrice: S.value,
-        contactName: h.value,
-        contactEmail: f.value,
-        contactPhone: v.value,
-        imageBase64: Se(k.value.base64),
+        contactName: g.value,
+        contactEmail: p.value,
+        contactPhone: m.value,
+        imageBase64: Ce(k.value.base64),
         imageName: k.value.name,
         imageFormat: k.value.type,
         placeType: E.value ? E.value.placeType : void 0,
         placeID: E.value ? E.value.id : void 0
       }, {
         headers: {
-          Authorization: t.value,
+          Authorization: l.value,
           Accept: "application/json",
-          "Fresh-Booking-Ver": "4.0.56-rc4"
+          "Fresh-Booking-Ver": "4.0.56-rc6"
         }
       }).then((a) => {
-        s.value = $.ReadyToPay, y.value = !1, u({
+        n.value = $.ReadyToPay, h.value = !1, c({
           callback: () => console.log("Callback!"),
           response: a.data
         });
       });
     });
   }
-  function i(a) {
-    a && (q.value = a);
+  function s(a) {
+    a && (I.value = a);
   }
   return {
     selectedPlace: E,
-    moduleState: s,
-    name: h,
-    email: f,
-    phone: v,
-    value: m,
-    remark: G,
+    moduleState: n,
+    name: g,
+    email: p,
+    phone: m,
+    value: d,
+    remark: M,
     showValue: S,
-    quantity: g,
+    quantity: y,
     media: k,
-    placeId: l,
-    placeType: c,
+    placeId: o,
+    placeType: f,
     showFormPage: F,
-    showPaymentPage: I,
-    showConfirmationPage: M,
-    places: P,
-    hasFilledForm: B,
-    hasForcedPlaceType: A,
+    showPaymentPage: R,
+    showConfirmationPage: x,
+    places: w,
+    hasFilledForm: D,
+    hasForcedPlaceType: z,
     isWaitingForResponse: K,
     isMetaDataAvailable: O,
-    orderGiftCard: R,
-    initialize: i
+    orderGiftCard: q,
+    initialize: s
   };
-}), Be = { class: "media-selector" }, We = ["accept"], je = { class: "media-selector-wrapper" }, He = { class: "media-selector-tools" }, Ne = { key: 0 }, Oe = { key: 1 }, Ke = { key: 2 }, Je = ["src"], Ye = /* @__PURE__ */ Z({
+}), ze = { class: "media-selector" }, De = ["accept"], We = { class: "media-selector-wrapper" }, je = { class: "media-selector-tools" }, He = { key: 0 }, Ne = { key: 1 }, Oe = { key: 2 }, Ke = ["src"], Je = /* @__PURE__ */ Z({
   __name: "MediaSelector",
   props: {
     modelValue: {},
@@ -135,96 +134,96 @@ const se = Fe("giftCard", () => {
     required: { type: Boolean, default: !1 }
   },
   emits: ["update:modelValue"],
-  setup(u, { emit: t }) {
-    const r = t, o = u, { t: s } = pe(), { display: h } = Ue(), f = _(), v = V(() => o.modelValue.base64 !== "");
-    function m(l) {
-      r("update:modelValue", l);
+  setup(c, { emit: l }) {
+    const i = l, t = c, { t: n } = ce(), { display: g } = _e(), p = _(), m = V(() => t.modelValue.base64 !== "");
+    function d(o) {
+      i("update:modelValue", o);
     }
-    function g() {
-      m({
+    function y() {
+      d({
         base64: "",
         name: "",
         type: ""
-      }), f.value && (f.value.value = "");
+      }), p.value && (p.value.value = "");
     }
     function S() {
-      f.value && f.value.click();
+      p.value && p.value.click();
     }
-    function G(l, c) {
-      const [y, q] = [l.name, l.type], F = new FileReader();
-      F.onload = function(I) {
-        if (I.target) {
-          const M = I.target.result;
-          c({ base64: M, name: y, type: q });
+    function M(o, f) {
+      const [h, I] = [o.name, o.type], F = new FileReader();
+      F.onload = function(R) {
+        if (R.target) {
+          const x = R.target.result;
+          f({ base64: x, name: h, type: I });
         } else
-          h({
-            message: s("imageUploadError"),
+          g({
+            message: n("imageUploadError"),
             type: "error"
           });
-      }, F.readAsDataURL(l);
+      }, F.readAsDataURL(o);
     }
     function k() {
       return J(this, null, function* () {
-        let l;
-        (l = f.value.files) instanceof FileList && G(l[0], m);
+        let o;
+        (o = p.value.files) instanceof FileList && M(o[0], d);
       });
     }
-    return (l, c) => (p(), L($e, {
-      label: l.label,
-      required: l.required,
+    return (o, f) => (v(), L(Ve, {
+      label: o.label,
+      required: o.required,
       type: "media"
     }, {
-      default: D(() => [
-        d("div", Be, [
-          d("input", {
+      default: G(() => [
+        u("div", ze, [
+          u("input", {
             ref_key: "fileInput",
-            ref: f,
+            ref: p,
             type: "file",
             class: "hidden",
-            accept: l.validation,
+            accept: o.validation,
             single: "",
-            onChange: c[0] || (c[0] = (y) => k())
-          }, null, 40, We),
-          d("div", je, [
-            d("ul", He, [
-              v.value ? T("", !0) : (p(), b("li", Ne, [
-                n(z, {
-                  label: e(s)("uploadFile"),
+            onChange: f[0] || (f[0] = (h) => k())
+          }, null, 40, De),
+          u("div", We, [
+            u("ul", je, [
+              m.value ? T("", !0) : (v(), b("li", He, [
+                r(B, {
+                  label: e(n)("uploadFile"),
                   type: "button",
                   icon: "upload",
-                  "icon-color": l.iconColor,
-                  onClickEvent: c[1] || (c[1] = (y) => S())
+                  "icon-color": o.iconColor,
+                  onClickEvent: f[1] || (f[1] = (h) => S())
                 }, null, 8, ["label", "icon-color"])
               ])),
-              v.value ? (p(), b("li", Oe, [
-                n(z, {
-                  label: e(s)("replaceFile"),
+              m.value ? (v(), b("li", Ne, [
+                r(B, {
+                  label: e(n)("replaceFile"),
                   type: "button",
                   icon: "repeat-alt",
-                  "icon-color": l.iconColor,
-                  onClickEvent: c[2] || (c[2] = (y) => S())
+                  "icon-color": o.iconColor,
+                  onClickEvent: f[2] || (f[2] = (h) => S())
                 }, null, 8, ["label", "icon-color"])
               ])) : T("", !0),
-              v.value ? (p(), b("li", Ke, [
-                n(z, {
-                  label: e(s)("removeFile"),
+              m.value ? (v(), b("li", Oe, [
+                r(B, {
+                  label: e(n)("removeFile"),
                   type: "button",
                   icon: "trash-alt",
-                  "icon-color": l.iconColor,
-                  onClickEvent: c[3] || (c[3] = (y) => g())
+                  "icon-color": o.iconColor,
+                  onClickEvent: f[3] || (f[3] = (h) => y())
                 }, null, 8, ["label", "icon-color"])
               ])) : T("", !0)
             ]),
-            d("div", {
-              class: ue([
+            u("div", {
+              class: pe([
                 "media-selector-previewer",
-                { opened: v.value }
+                { opened: m.value }
               ])
             }, [
-              l.modelValue ? (p(), b("img", {
+              o.modelValue ? (v(), b("img", {
                 key: 0,
-                src: l.modelValue.base64
-              }, null, 8, Je)) : T("", !0)
+                src: o.modelValue.base64
+              }, null, 8, Ke)) : T("", !0)
             ], 2)
           ])
         ])
@@ -233,9 +232,9 @@ const se = Fe("giftCard", () => {
     }, 8, ["label", "required"]));
   }
 });
-function de(u) {
-  const t = u;
-  t.__i18n = t.__i18n || [], t.__i18n.push({
+function de(c) {
+  const l = c;
+  l.__i18n = l.__i18n || [], l.__i18n.push({
     locale: "",
     resource: {
       da: {
@@ -253,39 +252,39 @@ function de(u) {
     }
   });
 }
-typeof de == "function" && de(Ye);
-const Qe = { class: "gift-card-skeleton" }, Xe = { class: "gift-card-skeleton-form" }, Ze = /* @__PURE__ */ Z({
+typeof de == "function" && de(Je);
+const Ye = { class: "gift-card-skeleton" }, Qe = { class: "gift-card-skeleton-form" }, Xe = /* @__PURE__ */ Z({
   __name: "GiftCardSkeleton",
-  setup(u) {
-    return (t, r) => (p(), b("div", Qe, [
-      d("div", Xe, [
-        n(x),
-        n(x),
-        n(x),
-        n(x),
-        n(x, { "is-text-area": "" }),
-        n(Ae, { height: "44px" })
+  setup(c) {
+    return (l, i) => (v(), b("div", Ye, [
+      u("div", Qe, [
+        r(A),
+        r(A),
+        r(A),
+        r(A),
+        r(A, { "is-text-area": "" }),
+        r(Be, { height: "44px" })
       ])
     ]));
   }
-}), ea = /* @__PURE__ */ me(Ze, [["__scopeId", "data-v-e35c75b3"]]), aa = {
+}), Ze = /* @__PURE__ */ me(Xe, [["__scopeId", "data-v-e35c75b3"]]), ea = {
   key: 0,
   id: "konnectio-gift-card-wrapper"
-}, la = { id: "konnectio-gift-card-title" }, ta = { id: "konnectio-gift-card-content" }, oa = { id: "konnectio-gift-card-payment" }, ia = ["innerHTML"], na = { key: 0 }, ra = {
+}, aa = { id: "konnectio-gift-card-title" }, la = { id: "konnectio-gift-card-content" }, ta = { id: "konnectio-gift-card-payment" }, oa = ["innerHTML"], na = { key: 0 }, ia = {
   key: 0,
   id: "fresh-booking-select-place-type"
 }, sa = {
-  class: /* @__PURE__ */ ue(["fresh-booking-label", "required"])
-}, da = { id: "fresh-booking-select-place-type-input" }, ua = ["innerHTML"], ca = {
+  class: /* @__PURE__ */ pe(["fresh-booking-label", "required"])
+}, ra = { id: "fresh-booking-select-place-type-input" }, da = ["innerHTML"], ua = {
   key: 0,
   id: "konnectio-gift-card-order"
-}, pa = { class: "fresh-booking-panel" }, ma = {
+}, ca = { class: "fresh-booking-panel" }, pa = {
   key: 1,
   id: "konnectio-gift-card-remarks"
-}, fa = {
+}, ma = {
   key: 2,
   id: "konnectio-gift-card-order-minimal"
-}, va = { id: "konnectio-gift-card-recaptcha" }, ga = /* @__PURE__ */ Z({
+}, fa = { id: "konnectio-gift-card-recaptcha" }, va = /* @__PURE__ */ Z({
   name: "GiftCardLayout",
   __name: "GiftCard",
   props: {
@@ -294,72 +293,72 @@ const Qe = { class: "gift-card-skeleton" }, Xe = { class: "gift-card-skeleton-fo
     placeType: {},
     styling: {}
   },
-  setup(u) {
-    const t = u, r = V(() => te({
+  setup(c) {
+    const l = c, i = V(() => te({
       panelMaxWidth: "800px"
-    }, t.styling)), { t: o } = pe(), {
-      name: s,
-      email: h,
-      phone: f,
-      value: v,
-      remark: m,
-      showValue: g,
+    }, l.styling)), { t } = ce(), {
+      name: n,
+      email: g,
+      phone: p,
+      value: m,
+      remark: d,
+      showValue: y,
       quantity: S,
-      media: G,
+      media: M,
       placeId: k,
-      placeType: l,
-      showFormPage: c,
-      showPaymentPage: y,
-      showConfirmationPage: q,
+      placeType: o,
+      showFormPage: f,
+      showPaymentPage: h,
+      showConfirmationPage: I,
       places: F,
-      hasFilledForm: I,
-      hasForcedPlaceType: M,
-      isWaitingForResponse: P,
-      isMetaDataAvailable: A
-    } = X(se()), { initialize: E, orderGiftCard: B } = se(), { isRecaptchaEnabled: O, currency: K } = X(ce());
-    return ye(l, () => {
+      hasFilledForm: R,
+      hasForcedPlaceType: x,
+      isWaitingForResponse: w,
+      isMetaDataAvailable: z
+    } = X(re()), { initialize: E, orderGiftCard: D } = re(), { isRecaptchaEnabled: O, currency: K } = X(ue());
+    return Fe(o, () => {
       k.value = void 0;
-    }), he(() => {
-      const R = t.placeType ? parseInt(t.placeType) : void 0;
-      E(R);
-    }), (R, i) => (p(), L(Me, { styling: r.value }, {
-      default: D(() => [
-        (p(), L(ke, null, {
-          default: D(() => [
-            n(Ee, {
+    }), we(() => {
+      const q = l.placeType ? parseInt(l.placeType) : void 0;
+      E(q);
+    }), (q, s) => (v(), L(Me, { styling: i.value }, {
+      default: G(() => [
+        (v(), L(Pe, null, {
+          default: G(() => [
+            r(Ee, {
               id: "konnectio-gift-card-module",
               type: "gift-card",
-              "access-token": R.accessToken,
-              "data-layout": R.layout
+              "access-token": q.accessToken,
+              "data-layout": q.layout
             }, {
-              default: D(() => [
-                e(A) ? (p(), b("div", aa, [
-                  d("h2", la, [
-                    d("span", null, oe(e(o)("giftCard.title")), 1)
+              default: G(() => [
+                e(z) ? (v(), b("div", ea, [
+                  u("h2", aa, [
+                    u("span", null, ne(e(t)("giftCard.title")), 1)
                   ]),
-                  d("div", ta, [
-                    W(d("div", oa, [
-                      n(xe)
+                  u("div", la, [
+                    W(u("div", ta, [
+                      r(xe)
                     ], 512), [
-                      [j, e(y)]
+                      [j, e(h)]
                     ]),
-                    W(d("div", null, [
-                      d("p", {
+                    W(u("div", null, [
+                      u("p", {
                         id: "konnectio-gift-card-description",
-                        innerHTML: e(o)("giftCard.description")
-                      }, null, 8, ia),
-                      d("form", null, [
-                        e(M) ? T("", !0) : (p(), b("div", na, [
-                          e(F) ? (p(), b("div", ra, [
-                            d("label", sa, [
-                              d("span", null, oe(e(o)("giftCard.selectType")), 1)
+                        innerHTML: e(t)("giftCard.description")
+                      }, null, 8, oa),
+                      u("form", null, [
+                        e(x) ? T("", !0) : (v(), b("div", na, [
+                          e(F) ? (v(), b("div", ia, [
+                            u("label", sa, [
+                              u("span", null, ne(e(t)("giftCard.selectType")), 1)
                             ]),
-                            d("div", da, [
-                              d("ul", null, [
-                                (p(!0), b(Ce, null, _e(e(F), (a, U) => (p(), b("li", { key: U }, [
-                                  n(re, {
-                                    modelValue: e(l),
-                                    "onUpdate:modelValue": i[0] || (i[0] = (w) => C(l) ? l.value = w : null),
+                            u("div", ra, [
+                              u("ul", null, [
+                                (v(!0), b(Te, null, Se(e(F), (a, U) => (v(), b("li", { key: U }, [
+                                  r(se, {
+                                    modelValue: e(o),
+                                    "onUpdate:modelValue": s[0] || (s[0] = (P) => C(o) ? o.value = P : null),
                                     type: "radio",
                                     name: "placeType",
                                     val: U,
@@ -367,134 +366,134 @@ const Qe = { class: "gift-card-skeleton" }, Xe = { class: "gift-card-skeleton-fo
                                   }, null, 8, ["modelValue", "val", "label"])
                                 ]))), 128))
                               ]),
-                              e(F)[e(l)] && e(F)[e(l)].data.length > 1 ? (p(), L(qe, {
+                              e(F)[e(o)] && e(F)[e(o)].data.length > 1 ? (v(), L(Ue, {
                                 key: 0,
                                 modelValue: e(k),
-                                "onUpdate:modelValue": i[1] || (i[1] = (a) => C(k) ? k.value = a : null),
-                                placeholder: e(o)("giftCard.selectPlacePlaceholder"),
-                                options: e(F)[e(l)].data,
+                                "onUpdate:modelValue": s[1] || (s[1] = (a) => C(k) ? k.value = a : null),
+                                placeholder: e(t)("giftCard.selectPlacePlaceholder"),
+                                options: e(F)[e(o)].data,
                                 labelKey: "name",
                                 valueKey: "id",
                                 required: ""
                               }, null, 8, ["modelValue", "placeholder", "options"])) : T("", !0)
                             ])
-                          ])) : (p(), L(ne, { key: 1 }))
+                          ])) : (v(), L(ie, { key: 1 }))
                         ])),
-                        n(H, {
-                          modelValue: e(s),
-                          "onUpdate:modelValue": i[2] || (i[2] = (a) => C(s) ? s.value = a : null),
+                        r(H, {
+                          modelValue: e(n),
+                          "onUpdate:modelValue": s[2] || (s[2] = (a) => C(n) ? n.value = a : null),
                           type: "text",
                           name: "name",
                           autocomplete: "name",
-                          label: e(o)("giftCard.name"),
+                          label: e(t)("giftCard.name"),
                           icon: "user-alt",
-                          placeholder: e(o)("giftCard.namePlaceholder"),
+                          placeholder: e(t)("giftCard.namePlaceholder"),
                           required: ""
                         }, null, 8, ["modelValue", "label", "placeholder"]),
-                        n(H, {
-                          modelValue: e(h),
-                          "onUpdate:modelValue": i[3] || (i[3] = (a) => C(h) ? h.value = a : null),
+                        r(H, {
+                          modelValue: e(g),
+                          "onUpdate:modelValue": s[3] || (s[3] = (a) => C(g) ? g.value = a : null),
                           type: "email",
                           name: "email",
                           autocomplete: "email",
-                          label: e(o)("giftCard.email"),
+                          label: e(t)("giftCard.email"),
                           icon: "at",
-                          placeholder: e(o)("giftCard.emailPlaceholder"),
+                          placeholder: e(t)("giftCard.emailPlaceholder"),
                           required: ""
                         }, null, 8, ["modelValue", "label", "placeholder"]),
-                        n(De, {
-                          modelValue: e(f),
-                          "onUpdate:modelValue": i[4] || (i[4] = (a) => C(f) ? f.value = a : null),
+                        r(Ae, {
+                          modelValue: e(p),
+                          "onUpdate:modelValue": s[4] || (s[4] = (a) => C(p) ? p.value = a : null),
                           icon: "phone-office",
-                          label: e(o)("giftCard.phone"),
-                          placeholder: e(o)("giftCard.phonePlaceholder"),
+                          label: e(t)("giftCard.phone"),
+                          placeholder: e(t)("giftCard.phonePlaceholder"),
                           required: ""
                         }, null, 8, ["modelValue", "label", "placeholder"]),
-                        n(H, {
-                          modelValue: e(v),
-                          "onUpdate:modelValue": i[5] || (i[5] = (a) => C(v) ? v.value = a : null),
+                        r(H, {
+                          modelValue: e(m),
+                          "onUpdate:modelValue": s[5] || (s[5] = (a) => C(m) ? m.value = a : null),
                           type: "number",
                           name: "value",
-                          label: e(o)("giftCard.value"),
+                          label: e(t)("giftCard.value"),
                           icon: "money-bill",
-                          placeholder: e(o)("giftCard.valuePlaceholder"),
+                          placeholder: e(t)("giftCard.valuePlaceholder"),
                           suffix: e(K),
                           required: ""
                         }, null, 8, ["modelValue", "label", "placeholder", "suffix"]),
-                        n(re, {
-                          modelValue: e(g),
-                          "onUpdate:modelValue": i[6] || (i[6] = (a) => C(g) ? g.value = a : null),
+                        r(se, {
+                          modelValue: e(y),
+                          "onUpdate:modelValue": s[6] || (s[6] = (a) => C(y) ? y.value = a : null),
                           type: "checkbox",
                           name: "showValue",
-                          label: e(o)("giftCard.showValue"),
-                          checked: e(g)
+                          label: e(t)("giftCard.showValue"),
+                          checked: e(y)
                         }, null, 8, ["modelValue", "label", "checked"]),
                         T("", !0),
-                        n(Ie, {
+                        r($e, {
                           modelValue: e(S),
-                          "onUpdate:modelValue": i[8] || (i[8] = (a) => C(S) ? S.value = a : null),
-                          label: e(o)("giftCard.quantity"),
+                          "onUpdate:modelValue": s[8] || (s[8] = (a) => C(S) ? S.value = a : null),
+                          label: e(t)("giftCard.quantity"),
                           icon: "gift-card",
                           required: ""
                         }, null, 8, ["modelValue", "label"])
                       ])
                     ], 512), [
-                      [j, e(c)]
+                      [j, e(f)]
                     ]),
-                    W(d("div", null, [
-                      d("div", {
-                        innerHTML: e(o)("giftCard.thankYou")
-                      }, null, 8, ua)
+                    W(u("div", null, [
+                      u("div", {
+                        innerHTML: e(t)("giftCard.thankYou")
+                      }, null, 8, da)
                     ], 512), [
-                      [j, e(q)]
+                      [j, e(I)]
                     ])
                   ]),
-                  R.layout !== "minimal" && e(c) ? (p(), b("div", ca, [
-                    d("div", pa, [
-                      n(z, {
-                        label: e(o)("giftCard.orderGiftCard"),
+                  q.layout !== "minimal" && e(f) ? (v(), b("div", ua, [
+                    u("div", ca, [
+                      r(B, {
+                        label: e(t)("giftCard.orderGiftCard"),
                         "full-width": !0,
-                        disabled: !e(I),
-                        "is-loading": e(P),
-                        "onUpdate:isLoading": i[9] || (i[9] = (a) => C(P) ? P.value = a : null),
-                        onClickEvent: e(B)
+                        disabled: !e(R),
+                        "is-loading": e(w),
+                        "onUpdate:isLoading": s[9] || (s[9] = (a) => C(w) ? w.value = a : null),
+                        onClickEvent: e(D)
                       }, null, 8, ["label", "disabled", "is-loading", "onClickEvent"])
                     ])
                   ])) : T("", !0),
-                  e(c) ? (p(), b("div", ma, [
-                    n(H, {
-                      modelValue: e(m),
-                      "onUpdate:modelValue": i[10] || (i[10] = (a) => C(m) ? m.value = a : null),
+                  e(f) ? (v(), b("div", pa, [
+                    r(H, {
+                      modelValue: e(d),
+                      "onUpdate:modelValue": s[10] || (s[10] = (a) => C(d) ? d.value = a : null),
                       type: "textarea",
                       name: "remark",
-                      label: e(o)("giftCard.remark"),
+                      label: e(t)("giftCard.remark"),
                       icon: "info-circle",
-                      placeholder: e(o)("giftCard.remarkPlaceholder")
+                      placeholder: e(t)("giftCard.remarkPlaceholder")
                     }, null, 8, ["modelValue", "label", "placeholder"])
                   ])) : T("", !0),
-                  e(c) ? (p(), b("div", fa, [
-                    n(z, {
-                      label: e(o)("giftCard.orderGiftCard"),
+                  e(f) ? (v(), b("div", ma, [
+                    r(B, {
+                      label: e(t)("giftCard.orderGiftCard"),
                       "full-width": !0,
-                      disabled: !e(I),
+                      disabled: !e(R),
                       "data-test": "orderGiftCard",
-                      "is-loading": e(P),
-                      "onUpdate:isLoading": i[11] || (i[11] = (a) => C(P) ? P.value = a : null),
-                      onClickEvent: e(B)
+                      "is-loading": e(w),
+                      "onUpdate:isLoading": s[11] || (s[11] = (a) => C(w) ? w.value = a : null),
+                      onClickEvent: e(D)
                     }, null, 8, ["label", "disabled", "is-loading", "onClickEvent"]),
-                    W(d("div", va, [
-                      n(ze)
+                    W(u("div", fa, [
+                      r(Ge)
                     ], 512), [
                       [j, e(O)]
                     ])
                   ])) : T("", !0)
-                ])) : (p(), L(ne, { key: 1 }))
+                ])) : (v(), L(ie, { key: 1 }))
               ]),
               _: 1
             }, 8, ["access-token", "data-layout"])
           ]),
-          fallback: D(() => [
-            n(ea)
+          fallback: G(() => [
+            r(Ze)
           ]),
           _: 1
         }))
@@ -502,16 +501,27 @@ const Qe = { class: "gift-card-skeleton" }, Xe = { class: "gift-card-skeleton-fo
       _: 1
     }, 8, ["styling"]));
   }
-}), fe = /* @__PURE__ */ me(ga, [["__scopeId", "data-v-ec9ea15b"]]), ba = Re(), N = Ve({ components: { GiftCard: fe } });
-N.use(ba);
-N.use(Le);
-N.use(Ge, { bootstrap: !0 });
-N.mount("#konnectio-gift-card-app");
-const wa = {
-  install: (u) => {
-    u.component("GiftCard", fe);
+}), N = /* @__PURE__ */ me(va, [["__scopeId", "data-v-ec9ea15b"]]), ga = Ie();
+class ya extends HTMLElement {
+  constructor() {
+    super();
   }
-};
+  connectedCallback() {
+    var p;
+    const l = typeof N == "function" ? N.options : N, i = Array.isArray(l.props) ? l.props : Object.keys(l.props || {}), t = {};
+    for (const m of i) {
+      const d = (p = this.attributes.getNamedItem(m)) == null ? void 0 : p.value;
+      if (!d)
+        break;
+      t[m] = d;
+    }
+    const n = Re(N, t);
+    n.use(ga), n.use(qe), n.use(Le, { bootstrap: !0 });
+    const g = document.createElement("div");
+    n.mount(g), this.appendChild(g.children[0]);
+  }
+}
+window.customElements.define("konnectio-gift-card", ya);
 export {
-  wa as default
+  ya as default
 };