UNPKG

@konnectio/core

Version:

Konnectio Core Frontend Integration.

669 lines (668 loc) 22.4 kB
import { d as $, h as y, b as u, e as r, W as ye, a as I, f as H, w as k, E as Q, K as U, G as Z, T as _, i as w, n as m, q as B, M as me, r as c, o as j, ad as he, ae as ge, D as x, c as q, $ as be, g as f, A as we, t as b, y as Se, J as ke, ac as Ce, u as $e, x as W, s as Be } from "./mitt-CWSmi8M-.js"; import { r as Ve, I as Pe, _ as M, H as ee, x as ne, T as oe, f as Te, Q as Ie } from "./SelectField.vue_vue_type_style_index_0_lang-Cev1TH7y.js"; function He(e) { if (Array.isArray(e)) { for (var o = 0, l = Array(e.length); o < e.length; o++) l[o] = e[o]; return l; } else return Array.from(e); } var K = !1; if (typeof window < "u") { var te = { get passive() { K = !0; } }; window.addEventListener("testPassive", null, te), window.removeEventListener("testPassive", null, te); } var D = typeof window < "u" && window.navigator && window.navigator.platform && (/iP(ad|hone|od)/.test(window.navigator.platform) || window.navigator.platform === "MacIntel" && window.navigator.maxTouchPoints > 1), C = [], O = !1, ae = -1, P = void 0, S = void 0, T = void 0, ie = function(o) { return C.some(function(l) { return !!(l.options.allowTouchMove && l.options.allowTouchMove(o)); }); }, E = function(o) { var l = o || window.event; return ie(l.target) || l.touches.length > 1 ? !0 : (l.preventDefault && l.preventDefault(), !1); }, Ae = function(o) { if (T === void 0) { var l = !!o && o.reserveScrollBarGap === !0, n = window.innerWidth - document.documentElement.clientWidth; if (l && n > 0) { var a = parseInt(window.getComputedStyle(document.body).getPropertyValue("padding-right"), 10); T = document.body.style.paddingRight, document.body.style.paddingRight = a + n + "px"; } } P === void 0 && (P = document.body.style.overflow, document.body.style.overflow = "hidden"); }, Ne = function() { T !== void 0 && (document.body.style.paddingRight = T, T = void 0), P !== void 0 && (document.body.style.overflow = P, P = void 0); }, qe = function() { return window.requestAnimationFrame(function() { if (S === void 0) { S = { position: document.body.style.position, top: document.body.style.top, left: document.body.style.left }; var o = window, l = o.scrollY, n = o.scrollX, a = o.innerHeight; document.body.style.position = "fixed", document.body.style.top = -l, document.body.style.left = -n, setTimeout(function() { return window.requestAnimationFrame(function() { var s = a - window.innerHeight; s && l >= a && (document.body.style.top = -(l + s)); }); }, 300); } }); }, De = function() { if (S !== void 0) { var o = -parseInt(document.body.style.top, 10), l = -parseInt(document.body.style.left, 10); document.body.style.position = S.position, document.body.style.top = S.top, document.body.style.left = S.left, window.scrollTo(l, o), S = void 0; } }, Oe = function(o) { return o ? o.scrollHeight - o.scrollTop <= o.clientHeight : !1; }, Ee = function(o, l) { var n = o.targetTouches[0].clientY - ae; return ie(o.target) ? !1 : l && l.scrollTop === 0 && n > 0 || Oe(l) && n < 0 ? E(o) : (o.stopPropagation(), !0); }, Me = function(o, l) { if (!o) { console.error("disableBodyScroll unsuccessful - targetElement must be provided when calling disableBodyScroll on IOS devices."); return; } if (!C.some(function(a) { return a.targetElement === o; })) { var n = { targetElement: o, options: l || {} }; C = [].concat(He(C), [n]), D ? qe() : Ae(l), D && (o.ontouchstart = function(a) { a.targetTouches.length === 1 && (ae = a.targetTouches[0].clientY); }, o.ontouchmove = function(a) { a.targetTouches.length === 1 && Ee(a, o); }, O || (document.addEventListener("touchmove", E, K ? { passive: !1 } : void 0), O = !0)); } }, ze = function(o) { if (!o) { console.error("enableBodyScroll unsuccessful - targetElement must be provided when calling enableBodyScroll on IOS devices."); return; } C = C.filter(function(l) { return l.targetElement !== o; }), D && (o.ontouchstart = null, o.ontouchmove = null, O && C.length === 0 && (document.removeEventListener("touchmove", E, K ? { passive: !1 } : void 0), O = !1)), D ? De() : Ne(); }, X = $({ name: "SidePanelCloseButton", emits: ["close"] }); const Le = /* @__PURE__ */ r( "span", { class: "vsp-close__x" }, null, -1 /* HOISTED */ ), Fe = [ Le ]; function Ge(e, o, l, n, a, s) { return u(), y("div", { class: "vsp-close", onClick: o[0] || (o[0] = (t) => e.$emit("close")) }, [...Fe]); } X.render = Ge; X.__file = "src/components/SidePanelCloseButton.vue"; var Y = $({ name: "VueSidePanel", components: { SidePanelCloseButton: X }, props: { idName: { type: String, default: "vsp-container" }, hideCloseBtn: { type: Boolean, default: !1 }, noClose: { type: Boolean, default: !1 }, side: { type: String, validator: (e) => ["top", "right", "bottom", "left"].includes(e), default: "right" }, rerender: { type: Boolean, default: !1 }, zIndex: { type: [Number, String], default: "auto" }, width: { type: String, default: "auto" }, height: { type: String, default: "auto" }, lockScroll: { type: Boolean, default: !1 }, lockScrollHtml: { type: Boolean, default: !0 }, modelValue: { type: Boolean, default: !1, required: !0 }, overlayColor: { type: String, default: "black" }, overlayOpacity: { type: Number, default: 0.5 }, overlayDuration: { type: Number, default: 500 }, panelColor: { type: String, default: "white" }, panelDuration: { type: Number, default: 300 }, transitionName: { type: String, default: void 0 }, headerClass: { type: String, default: "" }, bodyClass: { type: String, default: "" }, footerClass: { type: String, default: "" } }, emits: ["update:modelValue", "closed", "opened"], setup(e, { emit: o, attrs: l }) { let n; const a = c(null), s = c(null), t = c(null), d = c(null), i = c(null), p = c(0), h = c(0), A = c(0), z = c(0), L = c(0), F = c(), J = c(!1), V = async () => { window?.innerHeight > 0 && (L.value = window.innerHeight), p.value = t.value ? t.value.clientHeight : 0, A.value = d.value ? d.value.clientHeight : 0, h.value = i.value ? i.value.scrollHeight : 0, z.value = a.value ? a.value.clientHeight : 0; }, de = () => o("update:modelValue", !1), G = (v, g) => { if (g) { setTimeout(() => { Me(v, { reserveScrollBarGap: !0 }), e.lockScrollHtml && (document.documentElement.style.overflow = "hidden"); }, 0); return; } ze(v), e.lockScrollHtml && document.documentElement.style.removeProperty("overflow"); }, re = () => Math.max(...Array.from(document.querySelectorAll("body *"), (v) => parseFloat(window.getComputedStyle(v).zIndex)).filter((v) => !Number.isNaN(v)), 0); j(() => { F.value = e.zIndex === "auto" ? re() : e.zIndex; }), he(() => { document.getElementById(e.idName) || (n = document.createElement("div"), n.setAttribute("id", e.idName), document.body.appendChild(n)); }), ge(() => { const { modelValue: v, lockScroll: g } = e; g && a.value && v && G(a.value, !1), n && document.body.removeChild(n), window.removeEventListener("resize", V); }), x(() => [d.value, t.value, e.height, e.width, e.side, e.modelValue], () => { be(() => V()); }), x(() => [e.modelValue, a.value], (v, g) => { const fe = g ? g[0] : !1, [R, N] = v, pe = R, ve = fe && !R; if (N) { if (pe && (J.value = !!document.body.style.overflow), R) { e.lockScroll && G(N, !0), V(), window.addEventListener("resize", V); return; } !e.lockScroll || !ve || J.value || (setTimeout(() => { N && G(N, !1); }, e.panelDuration), window.removeEventListener("resize", V)); } }, { immediate: !0 }); const se = q(() => { if (!z.value) return; const v = h.value + A.value + p.value; let g = z.value - A.value - p.value; return ["top", "bottom"].includes(e.side) && e.height === "auto" && (g = L.value >= v ? h.value : L.value - A.value - p.value), g; }), ue = q(() => ({ zIndex: F.value, animationDuration: `${e.overlayDuration}ms`, "--overlay-opacity": e.overlayOpacity, opacity: e.modelValue ? e.overlayOpacity : 0, backgroundColor: e.overlayColor, pointerEvents: e.modelValue ? "all" : "none" })), ce = q(() => ({ width: ["left", "right"].includes(e.side) ? e.width : void 0, maxWidth: "100%", ...["top", "bottom"].includes(e.side) ? { // minHeight: props.height, height: e.height, maxHeight: "100%" } : {}, zIndex: F.value, backgroundColor: e.panelColor, animationDuration: `${e.panelDuration}ms`, ...Object.assign({}, l.style) })); return { body: i, panel: a, overlay: s, overlayStyles: ue, header: d, footer: t, closePanel: de, panelStyles: ce, bodyHeight: se }; } }); function Re(e, o, l, n, a, s) { const t = ye("SidePanelCloseButton"); return u(), I(me, { to: `#${e.idName}` }, [ r( "div", { class: m(["vsp-wrapper", [e.modelValue && "vsp-wrapper--active"]]) }, [ H(_, { name: "overlay", persisted: "" }, { default: k(() => [ Q(r( "div", { ref: "overlay", class: "vsp-overlay", style: U(e.overlayStyles), onClick: o[0] || (o[0] = () => e.noClose ? void 0 : e.closePanel()) }, null, 4 /* STYLE */ ), [ [Z, e.modelValue] ]) ]), _: 1 /* STABLE */ }), H(_, { name: e.transitionName || `slide-${e.side}`, onAfterEnter: o[1] || (o[1] = (d) => e.$emit("opened")), onAfterLeave: o[2] || (o[2] = (d) => e.$emit("closed")) }, { default: k(() => [ !e.rerender || e.modelValue ? Q((u(), y( "div", { key: 0, ref: "panel", class: m(["vsp", [`vsp--${e.side}-side`, e.$attrs.class]]), style: U(e.panelStyles) }, [ e.$slots.header ? (u(), y( "div", { key: 0, ref: "header", class: m([e.headerClass, "vsp__header"]) }, [ B(e.$slots, "header", { close: e.closePanel }) ], 2 /* CLASS */ )) : w("v-if", !0), r( "div", { ref: "body", class: m([e.bodyClass, "vsp__body"]), style: U({ height: `${e.bodyHeight}px` }) }, [ B(e.$slots, "default", { close: e.closePanel }), e.hideCloseBtn ? w("v-if", !0) : (u(), I(t, { key: 0, onClose: e.closePanel }, null, 8, ["onClose"])) ], 6 /* CLASS, STYLE */ ), e.$slots.footer ? (u(), y( "div", { key: 1, ref: "footer", class: m([e.footerClass, "vsp__footer"]) }, [ B(e.$slots, "footer") ], 2 /* CLASS */ )) : w("v-if", !0) ], 6 /* CLASS, STYLE */ )), [ [Z, e.rerender ? !0 : e.modelValue] ]) : w("v-if", !0) ]), _: 3 /* FORWARDED */ }, 8, ["name"]) ], 2 /* CLASS */ ) ], 8, ["to"]); } Y.render = Re; Y.__file = "src/components/SidePanel.vue"; const Ue = { id: "konnectio-side-panel-header" }, We = { id: "konnectio-side-panel-title" }, je = { key: 0, id: "konnectio-side-panel-subtitle" }, Ke = ["innerHTML"], Xe = /* @__PURE__ */ $({ __name: "Base", props: { modelValue: { type: Boolean }, title: {}, subtitle: {}, idName: {}, description: {}, side: { default: "right" }, lockScroll: { type: Boolean, default: !0 }, hideCloseButton: { type: Boolean, default: !0 }, width: { default: "840px" } }, emits: ["update:modelValue", "opened", "closed"], setup(e, { emit: o }) { const l = o, n = q(() => { const t = navigator?.userAgentData?.platform || navigator?.platform; return (/iPad|iPhone|iPod/.test(t) || t === "MacIntel" && navigator.maxTouchPoints > 1) && !window.MSStream; }); function a() { l("closed"); } function s() { l("opened"); } return (t, d) => (u(), I(f(Y), { modelValue: t.modelValue, "lock-scroll": !n.value && t.lockScroll, "hide-close-btn": t.hideCloseButton, width: t.width, "onUpdate:modelValue": d[1] || (d[1] = (i) => t.$emit("update:modelValue", i)), onClosed: a, onOpened: s }, we({ header: k(() => [ r("div", Ue, [ r("h2", We, [ r("span", null, b(f(Ve)(t.title)), 1), r("button", { id: "konnectio-side-panel-close", onClick: d[0] || (d[0] = (i) => t.$emit("update:modelValue", !1)) }, [ H(Pe, { icon: "times", type: "fas", color: "header" }) ]) ]), t.subtitle ? (u(), y("h4", je, [ r("span", null, b(t.subtitle), 1) ])) : w("", !0) ]) ]), default: k(() => [ t.description ? (u(), y("div", { key: 0, class: "konnectio-side-panel-description", innerHTML: t.description }, null, 8, Ke)) : w("", !0), B(t.$slots, "default", {}, void 0, !0) ]), _: 2 }, [ t.$slots.footer ? { name: "footer", fn: k(() => [ B(t.$slots, "footer", {}, void 0, !0) ]), key: "0" } : void 0 ]), 1032, ["modelValue", "lock-scroll", "hide-close-btn", "width"])); } }), ro = /* @__PURE__ */ M(Xe, [["__scopeId", "data-v-c84b8ee2"]]), Ye = { class: "konnectio-phone-input" }, Je = /* @__PURE__ */ $({ __name: "PhoneField", props: { modelValue: {}, label: {}, id: {}, placeholder: {}, icon: { default: "phone-office" }, iconColor: {}, iconType: { default: "fal" }, required: { type: Boolean, default: !1 }, readonly: { type: Boolean, default: !1 } }, emits: ["update:modelValue"], setup(e, { emit: o }) { const l = o, n = e, a = n.id || ee(), s = c("+45"), t = c(""); function d() { l("update:modelValue", `${s.value} ${t.value}`); } return j(() => { if (n.modelValue) { const i = n.modelValue.split(" "); s.value = i[0], t.value = i[1]; } }), (i, p) => (u(), I(ne, { label: i.label, id: f(a), type: "phone", required: i.required, readonly: i.readonly }, { default: k(() => [ r("div", Ye, [ H(oe, { modelValue: s.value, "onUpdate:modelValue": p[0] || (p[0] = (h) => s.value = h), type: "text", id: f(ee)(), name: "phone-code", autocomplete: "tel-country-code", icon: i.icon, "icon-color": i.iconColor, "icon-type": i.iconType, placeholder: "+XX", required: i.required, readonly: i.readonly, onInput: p[1] || (p[1] = (h) => d()) }, null, 8, ["modelValue", "id", "icon", "icon-color", "icon-type", "required", "readonly"]), H(oe, { modelValue: t.value, "onUpdate:modelValue": p[2] || (p[2] = (h) => t.value = h), type: "number", name: "phone", autocomplete: "tel-national", inputmode: "numeric", id: f(a), placeholder: i.placeholder, required: i.required, readonly: i.readonly, onInput: p[3] || (p[3] = (h) => d()) }, null, 8, ["modelValue", "id", "placeholder", "required", "readonly"]) ]) ]), _: 1 }, 8, ["label", "id", "required", "readonly"])); } }), so = /* @__PURE__ */ M(Je, [["__scopeId", "data-v-3e373d03"]]), Qe = ["required", "type", "name", "readonly", "disabled", "value", "checked"], Ze = ["data-test"], _e = { key: 0 }, xe = { key: 1, class: /* @__PURE__ */ m(["konnectio-click-box-label", "inline"]) }, eo = /* @__PURE__ */ $({ __name: "Checkbox", props: { modelValue: { type: [String, Boolean, Number] }, numeric: { type: Boolean, default: !1 }, checked: { type: Boolean, default: !1 }, label: {}, price: {}, name: {}, readonly: { type: Boolean, default: !1 }, type: { default: "checkbox" }, required: { type: Boolean, default: !1 }, val: {} }, emits: ["update:modelValue"], setup(e, { emit: o }) { const l = e, n = o, a = Se(); function s() { l.readonly !== !0 && n( "update:modelValue", l.type === "radio" ? l.val : l.numeric ? l.modelValue ? 0 : 1 : !l.modelValue ); } return (t, d) => (u(), I(ne, { required: t.required, type: t.type, readonly: t.readonly }, { default: k(() => [ r("label", { class: m([ "konnectio-click-box-container", { "is-readonly": t.readonly }, { "has-label": t.label || f(a).default }, t.type === "radio" ? "radio" : "checkbox", { active: t.type === "radio" ? t.val === t.modelValue : !!t.modelValue } ]) }, [ r("input", ke(t.$attrs, { required: !!t.required, type: t.type, name: t.name, class: "hidden", readonly: !!t.readonly, disabled: !!t.readonly, value: t.type === "radio" ? t.val : t.modelValue, checked: t.type === "radio" ? t.val === t.modelValue : !!t.modelValue, onChange: d[0] || (d[0] = (i) => s()) }), null, 16, Qe), r("div", { class: m([ "konnectio-click-box", { checked: t.type === "radio" ? t.val === t.modelValue : !!t.modelValue } ]), tabindex: "0", "data-test": t.name, onKeyup: d[1] || (d[1] = Ce((i) => s(), ["enter"])) }, null, 42, Ze), t.label ? (u(), y("div", { key: 0, class: m(["konnectio-click-box-label", "text-hover", { "with-price": t.price }]) }, [ r("span", null, b(t.label), 1), t.price ? (u(), y("span", _e, b(t.price), 1)) : w("", !0) ], 2)) : f(a).default ? (u(), y("div", xe, [ B(t.$slots, "default", {}, void 0, !0) ])) : w("", !0) ], 2) ]), _: 3 }, 8, ["required", "type", "readonly"])); } }), uo = /* @__PURE__ */ M(eo, [["__scopeId", "data-v-6e9623bf"]]), oo = { href: "https://policies.google.com/privacy", target: "_blank" }, to = { href: "https://policies.google.com/terms", target: "_blank" }, lo = /* @__PURE__ */ $({ __name: "GoogleNotice", setup(e) { const { t: o } = $e(); return (l, n) => (u(), y("span", null, [ W(b(f(o)("googleNotice")) + " ", 1), r("a", oo, b(f(o)("googlePrivacyPolicy")), 1), W(" " + b(f(o)("googleAnd")) + " ", 1), r("a", to, b(f(o)("googleTOS")), 1), W(" " + b(f(o)("googleApply")) + ". ", 1) ])); } }); function le(e) { const o = e; o.__i18n = o.__i18n || [], o.__i18n.push({ locale: "", resource: { da: { googleNotice: { t: 0, b: { t: 2, i: [{ t: 3 }], s: "Denne side er beskyttet af reCAPTCHA og Google's" } }, googlePrivacyPolicy: { t: 0, b: { t: 2, i: [{ t: 3 }], s: "Privatlivspolitik" } }, googleAnd: { t: 0, b: { t: 2, i: [{ t: 3 }], s: "og" } }, googleTOS: { t: 0, b: { t: 2, i: [{ t: 3 }], s: "Servicevilkår" } }, googleApply: { t: 0, b: { t: 2, i: [{ t: 3 }], s: "er gældende" } } }, en: { googleNotice: { t: 0, b: { t: 2, i: [{ t: 3 }], s: "This site is protected by reCAPTCHA and the Google" } }, googlePrivacyPolicy: { t: 0, b: { t: 2, i: [{ t: 3 }], s: "Privacy Policy" } }, googleAnd: { t: 0, b: { t: 2, i: [{ t: 3 }], s: "and" } }, googleTOS: { t: 0, b: { t: 2, i: [{ t: 3 }], s: "Terms of Service" } }, googleApply: { t: 0, b: { t: 2, i: [{ t: 3 }], s: "apply" } } } } }); } typeof le == "function" && le(lo); const no = /* @__PURE__ */ $({ __name: "CheckoutWindow", setup(e) { const { paymentGatewayId: o } = Be(Te()); return j(() => { const l = document.createElement("script"), n = document.createElement("script"); l.setAttribute("src", "https://checkout.dibspayment.eu/v1/checkout.js?v=1"), n.setAttribute("src", "https://checkout.reepay.com/checkout.js"), document.head.appendChild(l), document.head.appendChild(n); }), (l, n) => (u(), y("div", null, [ r("div", { id: "konnectio-payment-checkout-wrapper", class: m({ reePay: f(o) === f(Ie).ReePay }) }, n[0] || (n[0] = [ r("div", { id: "konnectio-payment-checkout" }, null, -1) ]), 2) ])); } }), co = /* @__PURE__ */ M(no, [["__scopeId", "data-v-403e3fbf"]]); export { ro as B, co as C, so as P, lo as _, uo as a }; //# sourceMappingURL=CheckoutWindow-CF2-eaiR.js.map