@konnectio/core 4.0.55 → 4.0.56-rc10

package/dist/gift-card.js

@@ -1,106 +1,100 @@
-import { d as ce, u as pe, s as X, c as Z, r as g, ad as w, e as Y, f as y, j as le, S as Q, h as me, i as fe, ae as ve, k as ee, F as re, b as ge, m as s, n as G, w as A, A as i, v as c, p as n, q as e, C as D, x as b, y as de, I as ye, _ as ue, a2 as be, o as _e, G as he, H as te, af as N, ag as j, a3 as ke, a4 as Ce, J as V, B as Ve, a5 as oe, T as H, P as Fe, V as Pe, U as we, W as Te, a9 as Se } from "./SelectField.vue_vue_type_style_index_0_lang-11cea6ba.js";
-import { C as $e } from "./Container-9f1ed24c.js";
-import { a as Ue, C as ne, P as Re, _ as qe } from "./CheckoutWindow-df8612e3.js";
-import { E as Ee } from "./_-52440760.js";
-import { F as L } from "./Field-92684198.js";
-import "./_commonjsHelpers-aeeeeb92.js";
-const ie = ce("giftCard", () => {
-  const { pay: T } = pe(), { bearerToken: p, metaData: E, currencyId: t } = X(Z()), { verifyRecaptcha: _ } = Z(), d = g(w.InitialState), u = Y("konnectio_name", "", void 0, { serializer: Q.string }), m = Y("konnectio_email", "", void 0, { serializer: Q.string }), h = Y("konnectio_phone", "", void 0, { serializer: Q.string }), k = g(""), I = g(1), M = g(!0), F = g(""), l = g({
+import { d as ue, u as ce, s as J, c as ie, r as V, ae as E, e as K, f as F, j as ee, S as Y, i as pe, h as me, af as fe, k as Q, B as se, b as ve, o as p, m as A, w as z, x as r, l as b, p as n, z as e, C as G, n as S, q as re, I as ge, _ as de, Y as be, Z as he, D as ye, F as ae, ag as j, ah as N, $ as ke, a6 as Ce, G as _, y as _e, a7 as le, T as W, A as Ve, M as Fe, N as we, R as Pe, U as Te, V as Se, ab as Ue } from "./SelectField.vue_vue_type_style_index_0_lang-Throo8e2.js";
+import { a as $e, C as te, P as Ee, _ as Re } from "./CheckoutWindow-GzqBHFb5.js";
+import { E as Ie } from "./_-K1FuFdRs.js";
+import { F as x } from "./Field-agqP-A21.js";
+import "./_commonjsHelpers-2ufMB8rV.js";
+const oe = ue("giftCard", () => {
+  const { pay: U } = ce(), { bearerToken: f, metaData: k, currencyId: t } = J(ie()), d = V(E.InitialState), h = K("konnectio_name", "", void 0, { serializer: Y.string }), s = K("konnectio_email", "", void 0, { serializer: Y.string }), m = K("konnectio_phone", "", void 0, { serializer: Y.string }), g = V(""), i = V(1), u = V(!0), v = V(""), C = V({
     base64: "",
     type: "",
     name: ""
-  }), r = g(void 0), v = g(0), S = g(!1), f = g(0), R = y(() => d.value === w.InitialState || d.value === w.WaitingForResponse), x = y(() => d.value === w.ReadyToPay), $ = y(() => d.value === w.PaymentSuccess), B = y(() => {
+  }), l = V(void 0), c = V(0), y = V(!1), I = V(0), w = F(() => d.value === E.InitialState || d.value === E.WaitingForResponse), q = F(() => d.value === E.ReadyToPay), M = F(() => d.value === E.PaymentSuccess), P = F(() => {
     const a = {
       1: {
-        label: le.t("giftCard.hotelType"),
+        label: ee.t("giftCard.hotelType"),
         data: []
       },
       2: {
-        label: le.t("giftCard.restaurantType"),
+        label: ee.t("giftCard.restaurantType"),
         data: []
       }
-    }, P = E.value.hotels[0].places;
-    return P && P.forEach((C) => {
-      a[C.placeType].data.push(C);
+    }, $ = k.value.hotels[0].places;
+    return $ && $.forEach((T) => {
+      a[T.placeType].data.push(T);
     }), Object.fromEntries(
-      Object.entries(a).filter(([, C]) => C.data.length > 0)
+      Object.entries(a).filter(([, T]) => T.data.length > 0)
     );
-  }), z = y(() => f.value !== 0), U = y(() => {
+  }), B = F(() => I.value !== 0), R = F(() => {
     let a;
-    if (z.value)
-      a = B.value[f.value].data[0];
-    else if (v.value !== 0) {
-      const P = r.value, C = B.value[v.value].data;
-      C.length === 1 ? a = C[0] : P !== void 0 && C.forEach((ae) => {
-        String(ae.id) === String(P) && (a = ae);
+    if (B.value)
+      a = P.value[I.value].data[0];
+    else if (c.value !== 0) {
+      const $ = l.value, T = P.value[c.value].data;
+      T.length === 1 ? a = T[0] : $ !== void 0 && T.forEach((X) => {
+        String(X.id) === String($) && (a = X);
       });
     }
     return a;
-  }), K = y(() => !(!u.value || !m.value || !(h.value.length >= 5) || !k.value || U.value === void 0)), J = y(() => !(d.value === w.InitialState && S.value)), W = y(() => !!(d.value === w.WaitingForResponse && S.value));
-  async function q() {
-    d.value = w.WaitingForResponse, S.value = !0, _({
-      type: "create_gift_card",
-      callback: async () => {
-        await me.post("https://production.hotel-service.konnectio.dk/api/gift-card/create", {
-          termsOfserviceURL: window.location.origin,
-          checkoutUrl: window.location.origin,
-          currencyID: t.value,
-          language: fe(),
-          amount: k.value,
-          quantity: I.value,
-          freeText: F.value,
-          showPrice: M.value,
-          contactName: u.value,
-          contactEmail: m.value,
-          contactPhone: h.value,
-          imageBase64: ve(l.value.base64),
-          imageName: l.value.name,
-          imageFormat: l.value.type,
-          placeType: U.value ? U.value.placeType : void 0,
-          placeID: U.value ? U.value.id : void 0
-        }, {
-          headers: {
-            Authorization: p.value,
-            Accept: "application/json",
-            "Fresh-Booking-Ver": "4.0.55"
-          }
-        }).then((a) => {
-          d.value = w.ReadyToPay, S.value = !1, T({
-            callback: () => console.log("Callback!"),
-            response: a.data
-          });
-        });
+  }), D = F(() => !(!h.value || !s.value || !(m.value.length >= 5) || !g.value || R.value === void 0)), H = F(() => !(d.value === E.InitialState && y.value)), Z = F(() => !!(d.value === E.WaitingForResponse && y.value));
+  async function L() {
+    d.value = E.WaitingForResponse, y.value = !0, await pe.post("https://production.hotel-service.konnectio.dk/api/gift-card/create", {
+      termsOfserviceURL: window.location.origin,
+      checkoutUrl: window.location.origin,
+      currencyID: t.value,
+      language: me(),
+      amount: g.value,
+      quantity: i.value,
+      freeText: v.value,
+      showPrice: u.value,
+      contactName: h.value,
+      contactEmail: s.value,
+      contactPhone: m.value,
+      imageBase64: fe(C.value.base64),
+      imageName: C.value.name,
+      imageFormat: C.value.type,
+      placeType: R.value ? R.value.placeType : void 0,
+      placeID: R.value ? R.value.id : void 0
+    }, {
+      headers: {
+        Authorization: f.value,
+        Accept: "application/json",
+        "Fresh-Booking-Ver": "4.0.56-rc10"
       }
+    }).then((a) => {
+      d.value = E.ReadyToPay, y.value = !1, U({
+        callback: () => console.log("Callback!"),
+        response: a.data
+      });
     });
   }
   function o(a) {
-    a && (f.value = a);
+    a && (I.value = a);
   }
   return {
-    selectedPlace: U,
+    selectedPlace: R,
     moduleState: d,
-    name: u,
-    email: m,
-    phone: h,
-    value: k,
-    remark: F,
-    showValue: M,
-    quantity: I,
-    media: l,
-    placeId: r,
-    placeType: v,
-    showFormPage: R,
-    showPaymentPage: x,
-    showConfirmationPage: $,
-    places: B,
-    hasFilledForm: K,
-    hasForcedPlaceType: z,
-    isWaitingForResponse: W,
-    isMetaDataAvailable: J,
-    orderGiftCard: q,
+    name: h,
+    email: s,
+    phone: m,
+    value: g,
+    remark: v,
+    showValue: u,
+    quantity: i,
+    media: C,
+    placeId: l,
+    placeType: c,
+    showFormPage: w,
+    showPaymentPage: q,
+    showConfirmationPage: M,
+    places: P,
+    hasFilledForm: D,
+    hasForcedPlaceType: B,
+    isWaitingForResponse: Z,
+    isMetaDataAvailable: H,
+    orderGiftCard: L,
     initialize: o
   };
-}), Ie = { class: "media-selector" }, Ge = ["accept"], Me = { class: "media-selector-wrapper" }, xe = { class: "media-selector-tools" }, Be = { key: 0 }, Le = { key: 1 }, Ae = { key: 2 }, De = ["src"], ze = /* @__PURE__ */ ee({
+}), qe = { class: "media-selector" }, Le = ["accept"], Ae = { class: "media-selector-wrapper" }, Me = { class: "media-selector-tools" }, xe = { key: 0 }, ze = { key: 1 }, Ge = { key: 2 }, Be = ["src"], De = /* @__PURE__ */ Q({
   __name: "MediaSelector",
   props: {
     modelValue: {},
@@ -110,94 +104,94 @@ const ie = ce("giftCard", () => {
     required: { type: Boolean, default: !1 }
   },
   emits: ["update:modelValue"],
-  setup(T, { emit: p }) {
-    const E = p, t = T, { t: _ } = re(), { display: d } = ge(), u = g(), m = y(() => t.modelValue.base64 !== "");
-    function h(l) {
-      E("update:modelValue", l);
+  setup(U, { emit: f }) {
+    const k = f, t = U, { t: d } = se(), { display: h } = ve(), s = V(), m = F(() => t.modelValue.base64 !== "");
+    function g(l) {
+      k("update:modelValue", l);
     }
-    function k() {
-      h({
+    function i() {
+      g({
         base64: "",
         name: "",
         type: ""
-      }), u.value && (u.value.value = "");
+      }), s.value && (s.value.value = "");
     }
-    function I() {
-      u.value && u.value.click();
+    function u() {
+      s.value && s.value.click();
     }
-    function M(l, r) {
-      const [v, S] = [l.name, l.type], f = new FileReader();
-      f.onload = function(R) {
-        if (R.target) {
-          const x = R.target.result;
-          r({ base64: x, name: v, type: S });
+    function v(l, c) {
+      const [y, I] = [l.name, l.type], w = new FileReader();
+      w.onload = function(q) {
+        if (q.target) {
+          const M = q.target.result;
+          c({ base64: M, name: y, type: I });
         } else
-          d({
-            message: _("imageUploadError"),
+          h({
+            message: d("imageUploadError"),
             type: "error"
           });
-      }, f.readAsDataURL(l);
+      }, w.readAsDataURL(l);
     }
-    async function F() {
+    async function C() {
       let l;
-      (l = u.value.files) instanceof FileList && M(l[0], h);
+      (l = s.value.files) instanceof FileList && v(l[0], g);
     }
-    return (l, r) => (s(), G(ye, {
+    return (l, c) => (p(), A(ge, {
       label: l.label,
       required: l.required,
       type: "media"
     }, {
-      default: A(() => [
-        i("div", Ie, [
-          i("input", {
+      default: z(() => [
+        r("div", qe, [
+          r("input", {
             ref_key: "fileInput",
-            ref: u,
+            ref: s,
             type: "file",
             class: "hidden",
             accept: l.validation,
             single: "",
-            onChange: r[0] || (r[0] = (v) => F())
-          }, null, 40, Ge),
-          i("div", Me, [
-            i("ul", xe, [
-              m.value ? b("", !0) : (s(), c("li", Be, [
-                n(D, {
-                  label: e(_)("uploadFile"),
+            onChange: c[0] || (c[0] = (y) => C())
+          }, null, 40, Le),
+          r("div", Ae, [
+            r("ul", Me, [
+              m.value ? S("", !0) : (p(), b("li", xe, [
+                n(G, {
+                  label: e(d)("uploadFile"),
                   type: "button",
                   icon: "upload",
                   "icon-color": l.iconColor,
-                  onClickEvent: r[1] || (r[1] = (v) => I())
+                  onClickEvent: c[1] || (c[1] = (y) => u())
                 }, null, 8, ["label", "icon-color"])
               ])),
-              m.value ? (s(), c("li", Le, [
-                n(D, {
-                  label: e(_)("replaceFile"),
+              m.value ? (p(), b("li", ze, [
+                n(G, {
+                  label: e(d)("replaceFile"),
                   type: "button",
                   icon: "repeat-alt",
                   "icon-color": l.iconColor,
-                  onClickEvent: r[2] || (r[2] = (v) => I())
+                  onClickEvent: c[2] || (c[2] = (y) => u())
                 }, null, 8, ["label", "icon-color"])
-              ])) : b("", !0),
-              m.value ? (s(), c("li", Ae, [
-                n(D, {
-                  label: e(_)("removeFile"),
+              ])) : S("", !0),
+              m.value ? (p(), b("li", Ge, [
+                n(G, {
+                  label: e(d)("removeFile"),
                   type: "button",
                   icon: "trash-alt",
                   "icon-color": l.iconColor,
-                  onClickEvent: r[3] || (r[3] = (v) => k())
+                  onClickEvent: c[3] || (c[3] = (y) => i())
                 }, null, 8, ["label", "icon-color"])
-              ])) : b("", !0)
+              ])) : S("", !0)
             ]),
-            i("div", {
-              class: de([
+            r("div", {
+              class: re([
                 "media-selector-previewer",
                 { opened: m.value }
               ])
             }, [
-              l.modelValue ? (s(), c("img", {
+              l.modelValue ? (p(), b("img", {
                 key: 0,
                 src: l.modelValue.base64
-              }, null, 8, De)) : b("", !0)
+              }, null, 8, Be)) : S("", !0)
             ], 2)
           ])
         ])
@@ -206,9 +200,9 @@ const ie = ce("giftCard", () => {
     }, 8, ["label", "required"]));
   }
 });
-function se(T) {
-  const p = T;
-  p.__i18n = p.__i18n || [], p.__i18n.push({
+function ne(U) {
+  const f = U;
+  f.__i18n = f.__i18n || [], f.__i18n.push({
     locale: "",
     resource: {
       da: {
@@ -226,30 +220,29 @@ function se(T) {
     }
   });
 }
-typeof se == "function" && se(ze);
-const We = { class: "gift-card-skeleton" }, Ne = { class: "gift-card-skeleton-form" }, je = /* @__PURE__ */ ee({
+typeof ne == "function" && ne(De);
+const je = { class: "gift-card-skeleton" }, Ne = { class: "gift-card-skeleton-form" }, We = /* @__PURE__ */ Q({
   __name: "GiftCardSkeleton",
-  setup(T) {
-    return (p, E) => (s(), c("div", We, [
-      i("div", Ne, [
-        n(L),
-        n(L),
-        n(L),
-        n(L),
-        n(L, { "is-text-area": "" }),
-        n(Ee, { height: "44px" })
+  setup(U) {
+    return (f, k) => (p(), b("div", je, [
+      r("div", Ne, [
+        n(x),
+        n(x),
+        n(x),
+        n(x),
+        n(x, { "is-text-area": "" }),
+        n(Ie, { height: "44px" })
       ])
     ]));
   }
-});
-const He = /* @__PURE__ */ ue(je, [["__scopeId", "data-v-e35c75b3"]]), Oe = {
+}), Oe = /* @__PURE__ */ de(We, [["__scopeId", "data-v-e35c75b3"]]), He = {
   key: 0,
   id: "konnectio-gift-card-wrapper"
-}, Ke = { id: "konnectio-gift-card-title" }, Je = { id: "konnectio-gift-card-content" }, Ye = { id: "konnectio-gift-card-payment" }, Qe = ["innerHTML"], Xe = { key: 0 }, Ze = {
+}, Ze = { id: "konnectio-gift-card-title" }, Ke = { id: "konnectio-gift-card-content" }, Ye = { id: "konnectio-gift-card-payment" }, Je = ["innerHTML"], Qe = { key: 0 }, Xe = {
   key: 0,
   id: "fresh-booking-select-place-type"
 }, ea = {
-  class: /* @__PURE__ */ de(["fresh-booking-label", "required"])
+  class: /* @__PURE__ */ re(["fresh-booking-label", "required"])
 }, aa = { id: "fresh-booking-select-place-type-input" }, la = ["innerHTML"], ta = {
   key: 0,
   id: "konnectio-gift-card-order"
@@ -259,7 +252,7 @@ const He = /* @__PURE__ */ ue(je, [["__scopeId", "data-v-e35c75b3"]]), Oe = {
 }, ia = {
   key: 2,
   id: "konnectio-gift-card-order-minimal"
-}, sa = { id: "konnectio-gift-card-recaptcha" }, ra = /* @__PURE__ */ ee({
+}, sa = { id: "konnectio-gift-card-recaptcha" }, ra = /* @__PURE__ */ Q({
   name: "GiftCardLayout",
   __name: "GiftCard",
   props: {
@@ -268,99 +261,96 @@ const He = /* @__PURE__ */ ue(je, [["__scopeId", "data-v-e35c75b3"]]), Oe = {
     placeType: {},
     styling: {}
   },
-  setup(T) {
-    const p = T, E = y(() => ({
+  setup(U) {
+    const f = U, k = F(() => ({
       panelMaxWidth: "800px",
-      ...p.styling
-    })), { t } = re(), {
-      name: _,
-      email: d,
-      phone: u,
+      ...f.styling
+    })), { t } = se(), {
+      name: d,
+      email: h,
+      phone: s,
       value: m,
-      remark: h,
-      showValue: k,
-      quantity: I,
-      media: M,
-      placeId: F,
+      remark: g,
+      showValue: i,
+      quantity: u,
+      media: v,
+      placeId: C,
       placeType: l,
-      showFormPage: r,
-      showPaymentPage: v,
-      showConfirmationPage: S,
-      places: f,
-      hasFilledForm: R,
-      hasForcedPlaceType: x,
-      isWaitingForResponse: $,
+      showFormPage: c,
+      showPaymentPage: y,
+      showConfirmationPage: I,
+      places: w,
+      hasFilledForm: q,
+      hasForcedPlaceType: M,
+      isWaitingForResponse: P,
       isMetaDataAvailable: B
-    } = X(ie()), { initialize: z, orderGiftCard: U } = ie(), { isRecaptchaEnabled: K, currency: J } = X(Z());
-    async function W() {
-      await U();
-    }
+    } = J(oe()), { initialize: R, orderGiftCard: D } = oe(), { isRecaptchaEnabled: H, currency: Z } = J(ie());
     return be(l, () => {
-      F.value = void 0;
-    }), _e(() => {
-      const q = p.placeType ? parseInt(p.placeType) : void 0;
-      z(q);
-    }), (q, o) => (s(), G($e, { styling: E.value }, {
-      default: A(() => [
-        (s(), G(he, null, {
-          default: A(() => [
+      C.value = void 0;
+    }), he(() => {
+      const L = f.placeType ? parseInt(f.placeType) : void 0;
+      R(L);
+    }), (L, o) => (p(), A(we, { styling: k.value }, {
+      default: z(() => [
+        (p(), A(ye, null, {
+          default: z(() => [
             n(Fe, {
               id: "konnectio-gift-card-module",
               type: "gift-card",
-              "access-token": q.accessToken,
-              "data-layout": q.layout
+              "access-token": L.accessToken,
+              "data-layout": L.layout
             }, {
-              default: A(() => [
-                e(B) ? (s(), c("div", Oe, [
-                  i("h2", Ke, [
-                    i("span", null, te(e(t)("giftCard.title")), 1)
+              default: z(() => [
+                e(B) ? (p(), b("div", He, [
+                  r("h2", Ze, [
+                    r("span", null, ae(e(t)("giftCard.title")), 1)
                   ]),
-                  i("div", Je, [
-                    N(i("div", Ye, [
-                      n(Ue)
+                  r("div", Ke, [
+                    j(r("div", Ye, [
+                      n($e)
                     ], 512), [
-                      [j, e(v)]
+                      [N, e(y)]
                     ]),
-                    N(i("div", null, [
-                      i("p", {
+                    j(r("div", null, [
+                      r("p", {
                         id: "konnectio-gift-card-description",
                         innerHTML: e(t)("giftCard.description")
-                      }, null, 8, Qe),
-                      i("form", null, [
-                        e(x) ? b("", !0) : (s(), c("div", Xe, [
-                          e(f) ? (s(), c("div", Ze, [
-                            i("label", ea, [
-                              i("span", null, te(e(t)("giftCard.selectType")), 1)
+                      }, null, 8, Je),
+                      r("form", null, [
+                        e(M) ? S("", !0) : (p(), b("div", Qe, [
+                          e(w) ? (p(), b("div", Xe, [
+                            r("label", ea, [
+                              r("span", null, ae(e(t)("giftCard.selectType")), 1)
                             ]),
-                            i("div", aa, [
-                              i("ul", null, [
-                                (s(!0), c(ke, null, Ce(e(f), (a, P) => (s(), c("li", { key: P }, [
-                                  n(ne, {
+                            r("div", aa, [
+                              r("ul", null, [
+                                (p(!0), b(ke, null, Ce(e(w), (a, $) => (p(), b("li", { key: $ }, [
+                                  n(te, {
                                     modelValue: e(l),
-                                    "onUpdate:modelValue": o[0] || (o[0] = (C) => V(l) ? l.value = C : null),
+                                    "onUpdate:modelValue": o[0] || (o[0] = (T) => _(l) ? l.value = T : null),
                                     type: "radio",
                                     name: "placeType",
-                                    val: P,
+                                    val: $,
                                     label: a.label
                                   }, null, 8, ["modelValue", "val", "label"])
                                 ]))), 128))
                               ]),
-                              e(f)[e(l)] && e(f)[e(l)].data.length > 1 ? (s(), G(Ve, {
+                              e(w)[e(l)] && e(w)[e(l)].data.length > 1 ? (p(), A(_e, {
                                 key: 0,
-                                modelValue: e(F),
-                                "onUpdate:modelValue": o[1] || (o[1] = (a) => V(F) ? F.value = a : null),
+                                modelValue: e(C),
+                                "onUpdate:modelValue": o[1] || (o[1] = (a) => _(C) ? C.value = a : null),
                                 placeholder: e(t)("giftCard.selectPlacePlaceholder"),
-                                options: e(f)[e(l)].data,
+                                options: e(w)[e(l)].data,
                                 labelKey: "name",
                                 valueKey: "id",
                                 required: ""
-                              }, null, 8, ["modelValue", "placeholder", "options"])) : b("", !0)
+                              }, null, 8, ["modelValue", "placeholder", "options"])) : S("", !0)
                             ])
-                          ])) : (s(), G(oe, { key: 1 }))
+                          ])) : (p(), A(le, { key: 1 }))
                         ])),
-                        n(H, {
-                          modelValue: e(_),
-                          "onUpdate:modelValue": o[2] || (o[2] = (a) => V(_) ? _.value = a : null),
+                        n(W, {
+                          modelValue: e(d),
+                          "onUpdate:modelValue": o[2] || (o[2] = (a) => _(d) ? d.value = a : null),
                           type: "text",
                           name: "name",
                           autocomplete: "name",
@@ -369,9 +359,9 @@ const He = /* @__PURE__ */ ue(je, [["__scopeId", "data-v-e35c75b3"]]), Oe = {
                           placeholder: e(t)("giftCard.namePlaceholder"),
                           required: ""
                         }, null, 8, ["modelValue", "label", "placeholder"]),
-                        n(H, {
-                          modelValue: e(d),
-                          "onUpdate:modelValue": o[3] || (o[3] = (a) => V(d) ? d.value = a : null),
+                        n(W, {
+                          modelValue: e(h),
+                          "onUpdate:modelValue": o[3] || (o[3] = (a) => _(h) ? h.value = a : null),
                           type: "email",
                           name: "email",
                           autocomplete: "email",
@@ -380,93 +370,99 @@ const He = /* @__PURE__ */ ue(je, [["__scopeId", "data-v-e35c75b3"]]), Oe = {
                           placeholder: e(t)("giftCard.emailPlaceholder"),
                           required: ""
                         }, null, 8, ["modelValue", "label", "placeholder"]),
-                        n(Re, {
-                          modelValue: e(u),
-                          "onUpdate:modelValue": o[4] || (o[4] = (a) => V(u) ? u.value = a : null),
+                        n(Ee, {
+                          modelValue: e(s),
+                          "onUpdate:modelValue": o[4] || (o[4] = (a) => _(s) ? s.value = a : null),
                           icon: "phone-office",
                           label: e(t)("giftCard.phone"),
                           placeholder: e(t)("giftCard.phonePlaceholder"),
                           required: ""
                         }, null, 8, ["modelValue", "label", "placeholder"]),
-                        n(H, {
+                        n(W, {
                           modelValue: e(m),
-                          "onUpdate:modelValue": o[5] || (o[5] = (a) => V(m) ? m.value = a : null),
+                          "onUpdate:modelValue": o[5] || (o[5] = (a) => _(m) ? m.value = a : null),
                           type: "number",
                           name: "value",
                           label: e(t)("giftCard.value"),
                           icon: "money-bill",
                           placeholder: e(t)("giftCard.valuePlaceholder"),
-                          suffix: e(J),
+                          suffix: e(Z),
                           required: ""
                         }, null, 8, ["modelValue", "label", "placeholder", "suffix"]),
-                        n(ne, {
-                          modelValue: e(k),
-                          "onUpdate:modelValue": o[6] || (o[6] = (a) => V(k) ? k.value = a : null),
+                        n(te, {
+                          modelValue: e(i),
+                          "onUpdate:modelValue": o[6] || (o[6] = (a) => _(i) ? i.value = a : null),
                           type: "checkbox",
                           name: "showValue",
                           label: e(t)("giftCard.showValue"),
-                          checked: e(k)
+                          checked: e(i)
                         }, null, 8, ["modelValue", "label", "checked"]),
-                        b("", !0),
-                        b("", !0)
+                        S("", !0),
+                        n(Ve, {
+                          modelValue: e(u),
+                          "onUpdate:modelValue": o[8] || (o[8] = (a) => _(u) ? u.value = a : null),
+                          label: e(t)("giftCard.quantity"),
+                          icon: "gift-card",
+                          required: ""
+                        }, null, 8, ["modelValue", "label"])
                       ])
                     ], 512), [
-                      [j, e(r)]
+                      [N, e(c)]
                     ]),
-                    N(i("div", null, [
-                      i("div", {
+                    j(r("div", null, [
+                      r("div", {
                         innerHTML: e(t)("giftCard.thankYou")
                       }, null, 8, la)
                     ], 512), [
-                      [j, e(S)]
+                      [N, e(I)]
                     ])
                   ]),
-                  q.layout !== "minimal" && e(r) ? (s(), c("div", ta, [
-                    i("div", oa, [
-                      n(D, {
+                  L.layout !== "minimal" && e(c) ? (p(), b("div", ta, [
+                    r("div", oa, [
+                      n(G, {
                         label: e(t)("giftCard.orderGiftCard"),
                         "full-width": !0,
-                        disabled: !e(R),
-                        "is-loading": e($),
-                        "onUpdate:isLoading": o[9] || (o[9] = (a) => V($) ? $.value = a : null),
-                        onClickEvent: W
-                      }, null, 8, ["label", "disabled", "is-loading"])
+                        disabled: !e(q),
+                        "is-loading": e(P),
+                        "onUpdate:isLoading": o[9] || (o[9] = (a) => _(P) ? P.value = a : null),
+                        onClickEvent: e(D)
+                      }, null, 8, ["label", "disabled", "is-loading", "onClickEvent"])
                     ])
-                  ])) : b("", !0),
-                  e(r) ? (s(), c("div", na, [
-                    n(H, {
-                      modelValue: e(h),
-                      "onUpdate:modelValue": o[10] || (o[10] = (a) => V(h) ? h.value = a : null),
+                  ])) : S("", !0),
+                  e(c) ? (p(), b("div", na, [
+                    n(W, {
+                      modelValue: e(g),
+                      "onUpdate:modelValue": o[10] || (o[10] = (a) => _(g) ? g.value = a : null),
                       type: "textarea",
                       name: "remark",
                       label: e(t)("giftCard.remark"),
                       icon: "info-circle",
                       placeholder: e(t)("giftCard.remarkPlaceholder")
                     }, null, 8, ["modelValue", "label", "placeholder"])
-                  ])) : b("", !0),
-                  e(r) ? (s(), c("div", ia, [
-                    n(D, {
+                  ])) : S("", !0),
+                  e(c) ? (p(), b("div", ia, [
+                    n(G, {
                       label: e(t)("giftCard.orderGiftCard"),
                       "full-width": !0,
-                      disabled: !e(R),
+                      disabled: !e(q),
                       "data-test": "orderGiftCard",
-                      "is-loading": e($),
-                      "onUpdate:isLoading": o[11] || (o[11] = (a) => V($) ? $.value = a : null),
-                      onClickEvent: W
-                    }, null, 8, ["label", "disabled", "is-loading"]),
-                    N(i("div", sa, [
-                      n(qe)
+                      "is-loading": e(P),
+                      "onUpdate:isLoading": o[11] || (o[11] = (a) => _(P) ? P.value = a : null),
+                      onClickEvent: e(D)
+                    }, null, 8, ["label", "disabled", "is-loading", "onClickEvent"]),
+                    j(r("div", sa, [
+                      n(Re)
                     ], 512), [
-                      [j, e(K)]
+                      [N, e(H)]
                     ])
-                  ])) : b("", !0)
-                ])) : (s(), G(oe, { key: 1 }))
+                  ])) : S("", !0)
+                ])) : (p(), A(le, { key: 1 }))
               ]),
               _: 1
             }, 8, ["access-token", "data-layout"])
           ]),
-          fallback: A(() => [
-            n(He)
+          fallback: z(() => [
+            n(Oe)
           ]),
           _: 1
         }))
@@ -474,9 +470,33 @@ const He = /* @__PURE__ */ ue(je, [["__scopeId", "data-v-e35c75b3"]]), Oe = {
       _: 1
     }, 8, ["styling"]));
   }
-});
-const da = /* @__PURE__ */ ue(ra, [["__scopeId", "data-v-111b608c"]]), ua = Pe(), O = we({ components: { GiftCard: da } });
-O.use(ua);
-O.use(Te);
-O.use(Se, { bootstrap: !0 });
-O.mount("#konnectio-gift-card-app");
+}), O = /* @__PURE__ */ de(ra, [["__scopeId", "data-v-ec9ea15b"]]), da = Pe();
+class ua extends HTMLElement {
+  constructor() {
+    super();
+  }
+  connectedCallback() {
+    const f = typeof O == "function" ? O.options : O;
+    let k = Array.isArray(f.props) ? f.props : Object.keys(f.props || {});
+    const t = (i) => i.replace(/[A-Z]+(?![a-z])|[A-Z]/g, (u, v) => (v ? "-" : "") + u.toLowerCase()), d = (i) => i.replace(/-./g, (u) => u[1].toUpperCase()), h = {};
+    k = k.map(t);
+    const s = {};
+    for (const i of this.attributes) {
+      const u = i.name, v = u.split(".");
+      console.log(u, v.length), v.length > 1 && (s[v[0]] || (s[v[0]] = {}), s[v[0]][d(v[1])] = i.value);
+    }
+    console.log(s), console.log(k);
+    for (const i of k) {
+      let u = this.attributes.getNamedItem(i)?.value;
+      s.hasOwnProperty(i) && (u = s[i]), console.log(u, i), h[i] = u;
+    }
+    const m = Te(O, h);
+    m.use(da), m.use(Se), m.use(Ue, { bootstrap: !0 });
+    const g = document.createElement("div");
+    m.mount(g), this.appendChild(g.children[0]);
+  }
+}
+window.customElements.define("konnectio-gift-card", ua);
+export {
+  ua as default
+};