@konnectio/core 4.0.56-rc14 → 4.0.56-rc16

package/dist/gift-card-validation.js

@@ -1,78 +1,96 @@
-import { k as w, B as A, s as k, a as V, c as S, o as b, m as _, w as m, D as X, p, x as t, F as s, z as a, G as v, l as I, H as y, J as x, K as B, n as N, L as T, M as D, N as E, P as M, Q as G, _ as H, R as U, U as P, V as R } from "./SelectField.vue_vue_type_style_index_0_lang-HS4IMhJo.js";
-import { A as $ } from "./ActionField-NTrSbw7Q.js";
+import { k as w, o as h, x as X, n as t, t as o, z as _, v as S, B, s as y, a as V, c as E, m as A, w as m, ab as G, P as c, p as e, J as x, N as k, W as N, a2 as T, y as $, L as I, a3 as z, a4 as D, a7 as M, a8 as P, a9 as U } from "./_-dt4Hj4aJ.js";
+import { A as F } from "./ActionField-SGZXrFG1.js";
+import { F as L } from "./Field-G2DlJtS7.js";
 import "./_commonjsHelpers-2ufMB8rV.js";
-const F = (i) => (M("data-v-0b17aac3"), i = i(), G(), i), j = ["innerHTML"], z = {
+const H = { class: "gift-card-validation-skeleton" }, O = { class: "gift-card-validation-skeleton-form" }, j = { class: "gift-card-validation-skeleton-text" }, R = { class: "gift-card-validation-skeleton-input" }, Z = /* @__PURE__ */ w({
+  __name: "GiftCardValidationSkeleton",
+  setup(C) {
+    return (n, l) => (h(), X("div", H, [
+      t("div", O, [
+        t("div", j, [
+          o(_, { height: "20px" }),
+          o(_, { height: "15px" }),
+          o(_, { height: "15px" })
+        ]),
+        t("div", R, [
+          o(L),
+          o(L, { "no-label": "" })
+        ])
+      ])
+    ]));
+  }
+}), J = /* @__PURE__ */ S(Z, [["__scopeId", "data-v-0b8074bf"]]), W = ["innerHTML"], q = {
   key: 0,
   id: "fresh-booking-gift-card-validation-resume",
   class: "fresh-booking-panel"
-}, J = /* @__PURE__ */ F(() => /* @__PURE__ */ t("span", null, "Loading...", -1)), K = /* @__PURE__ */ w({
+}, K = /* @__PURE__ */ w({
   name: "GiftCardValidationLayout",
   __name: "GiftCardValidation",
   props: {
     accessToken: {},
     styling: {}
   },
-  setup(i) {
-    const { t: e } = A(), {
+  setup(C) {
+    const { t: n } = B(), {
       voucher: l,
-      isValid: c,
-      amount: r,
-      expirationDate: u,
-      productName: f,
-      isLoading: o
-    } = k(V()), { currency: L } = k(S()), { apply: h } = V();
-    return (C, n) => (b(), _(E, { styling: C.styling }, {
+      isValid: b,
+      amount: v,
+      expirationDate: f,
+      productName: d,
+      isLoading: p
+    } = y(V()), { currency: a } = y(E()), { apply: s } = V();
+    return (i, r) => (h(), A(D, { styling: i.styling }, {
       default: m(() => [
-        (b(), _(X, null, {
+        (h(), A(G, null, {
           default: m(() => [
-            p(D, {
+            o(z, {
               id: "fresh-booking-gift-card-validation-module",
-              "access-token": C.accessToken,
+              "access-token": i.accessToken,
               type: "gift-card"
             }, {
               default: m(() => [
                 t("form", {
-                  onSubmit: n[3] || (n[3] = T((d) => a(h)(), ["prevent"]))
+                  onSubmit: r[3] || (r[3] = I((u) => e(s)(), ["prevent"]))
                 }, [
                   t("h4", null, [
-                    t("span", null, s(a(e)("giftCardValidation.title")), 1)
+                    t("span", null, c(e(n)("giftCardValidation.title")), 1)
                   ]),
                   t("p", {
-                    innerHTML: a(e)("giftCardValidation.description")
-                  }, null, 8, j),
-                  p($, {
-                    modelValue: a(l),
-                    "onUpdate:modelValue": n[0] || (n[0] = (d) => v(l) ? l.value = d : null),
+                    innerHTML: e(n)("giftCardValidation.description")
+                  }, null, 8, W),
+                  o(F, {
+                    modelValue: e(l),
+                    "onUpdate:modelValue": r[0] || (r[0] = (u) => x(l) ? l.value = u : null),
                     icon: "gift-card",
-                    label: a(e)("booking.reservation.giftCardCode"),
-                    buttonLabel: a(e)("giftCardValidation.submitButton"),
+                    label: e(n)("booking.reservation.giftCardCode"),
+                    buttonLabel: e(n)("giftCardValidation.submitButton"),
                     placeholder: "XXXXXXXX",
-                    "is-loading": a(o),
-                    "onUpdate:isLoading": n[1] || (n[1] = (d) => v(o) ? o.value = d : null),
-                    onAction: n[2] || (n[2] = (d) => a(h)())
+                    "is-loading": e(p),
+                    "onUpdate:isLoading": r[1] || (r[1] = (u) => x(p) ? p.value = u : null),
+                    onAction: r[2] || (r[2] = (u) => e(s)())
                   }, null, 8, ["modelValue", "label", "buttonLabel", "is-loading"]),
-                  !a(o) && a(c) ? (b(), I("table", z, [
+                  !e(p) && e(b) ? (h(), X("table", q, [
                     t("thead", null, [
                       t("tr", null, [
                         t("th", null, [
-                          t("span", null, s(a(e)("giftCardValidation.giftCard")), 1),
-                          p(y, {
+                          t("span", null, c(e(n)("giftCardValidation.giftCard")), 1),
+                          o(k, {
                             icon: "gift-card",
                             type: "fas",
                             color: "header"
                           })
                         ]),
                         t("th", null, [
-                          t("span", null, s(a(e)("giftCardValidation.balance")), 1),
-                          p(y, {
+                          t("span", null, c(e(n)("giftCardValidation.balance")), 1),
+                          o(k, {
                             icon: "money-bill",
                             type: "fas",
                             color: "header"
                           })
                         ]),
                         t("th", null, [
-                          t("span", null, s(a(e)("giftCardValidation.expirationDate")), 1),
-                          p(y, {
+                          t("span", null, c(e(n)("giftCardValidation.expirationDate")), 1),
+                          o(k, {
                             icon: "timer",
                             type: "fas",
                             color: "header"
@@ -83,24 +101,24 @@ const F = (i) => (M("data-v-0b17aac3"), i = i(), G(), i), j = ["innerHTML"], z =
                     t("tbody", null, [
                       t("tr", null, [
                         t("td", null, [
-                          t("span", null, s(a(f)), 1)
+                          t("span", null, c(e(d)), 1)
                         ]),
                         t("td", null, [
-                          t("span", null, s(a(x)(a(r), a(L))), 1)
+                          t("span", null, c(e(N)(e(v), e(a))), 1)
                         ]),
                         t("td", null, [
-                          t("span", null, s(a(B)(a(u))), 1)
+                          t("span", null, c(e(T)(e(f))), 1)
                         ])
                       ])
                     ])
-                  ])) : N("", !0)
+                  ])) : $("", !0)
                 ], 32)
               ]),
               _: 1
             }, 8, ["access-token"])
           ]),
           fallback: m(() => [
-            J
+            o(J)
           ]),
           _: 1
         }))
@@ -108,26 +126,35 @@ const F = (i) => (M("data-v-0b17aac3"), i = i(), G(), i), j = ["innerHTML"], z =
       _: 1
     }, 8, ["styling"]));
   }
-}), g = /* @__PURE__ */ H(K, [["__scopeId", "data-v-0b17aac3"]]), O = U();
-class Q extends HTMLElement {
+}), g = /* @__PURE__ */ S(K, [["__scopeId", "data-v-b19b4a0e"]]), Q = M();
+class Y extends HTMLElement {
+  vueApp;
   constructor() {
     super();
   }
+  disconnectedCallback() {
+    this.vueApp.unmount();
+  }
   connectedCallback() {
-    const e = typeof g == "function" ? g.options : g, l = Array.isArray(e.props) ? e.props : Object.keys(e.props || {}), c = {};
-    for (const f of l) {
-      const o = this.attributes.getNamedItem(f)?.value;
-      if (!o)
-        break;
-      c[f] = o;
+    const n = typeof g == "function" ? g.options : g;
+    let l = Array.isArray(n.props) ? n.props : Object.keys(n.props || {});
+    const b = (a) => a.replace(/[A-Z]+(?![a-z])|[A-Z]/g, (s, i) => (i ? "-" : "") + s.toLowerCase()), v = (a) => a.replace(/-./g, (s) => s[1].toUpperCase()), f = {};
+    l = l.map(b);
+    const d = {};
+    for (const a of this.attributes) {
+      const i = a.name.split(".");
+      i.length > 1 && (d[i[0]] || (d[i[0]] = {}), d[i[0]][v(i[1])] = a.value);
+    }
+    for (const a of l) {
+      let s = this.attributes.getNamedItem(a)?.value;
+      d.hasOwnProperty(a) && (s = d[a]), f[a] = s;
     }
-    const r = P(g, c);
-    r.use(O), r.use(R);
-    const u = document.createElement("div");
-    r.mount(u), this.appendChild(u.children[0]);
+    this.vueApp = P(g, f), this.vueApp.use(Q), this.vueApp.use(U);
+    const p = document.createElement("div");
+    this.vueApp.mount(p), this.appendChild(p.children[0]);
   }
 }
-window.customElements.define("konnectio-gift-card-validation", Q);
+window.customElements.define("konnectio-gift-card-validation", Y);
 export {
-  Q as default
+  Y as default
 };