UNPKG

@konnectio/core

Version:

Konnectio Core Frontend Integration.

669 lines (668 loc) 22.4 kB
import { d as $, h as m, b as s, W as me, a as I, e as d, f as H, w as k, E as J, K as R, G as Z, T as Q, i as w, n as h, q as B, M as he, r as u, o as W, ah as ge, ai as pe, D as _, c as q, $ as be, g as c, A as we, t as b, y as Se, J as ke, ag as Ce, u as $e, x as U, s as Be } from "./mitt-CvmiLPAX.js"; import { r as Ve, I as Pe, _ as M, H as ee, x as ne, T as te, f as Te, a6 as Ie } from "./SelectField.vue_vue_type_style_index_0_lang-C60Scz2U.js"; function He(e) { if (Array.isArray(e)) { for (var t = 0, o = Array(e.length); t < e.length; t++) o[t] = e[t]; return o; } else return Array.from(e); } var j = !1; if (typeof window < "u") { var oe = { get passive() { j = !0; } }; window.addEventListener("testPassive", null, oe), window.removeEventListener("testPassive", null, oe); } 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(t) { return C.some(function(o) { return !!(o.options.allowTouchMove && o.options.allowTouchMove(t)); }); }, E = function(t) { var o = t || window.event; return ie(o.target) || o.touches.length > 1 ? !0 : (o.preventDefault && o.preventDefault(), !1); }, Ae = function(t) { if (T === void 0) { var o = !!t && t.reserveScrollBarGap === !0, l = window.innerWidth - document.documentElement.clientWidth; if (o && l > 0) { var n = parseInt(window.getComputedStyle(document.body).getPropertyValue("padding-right"), 10); T = document.body.style.paddingRight, document.body.style.paddingRight = n + l + "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 t = window, o = t.scrollY, l = t.scrollX, n = t.innerHeight; document.body.style.position = "fixed", document.body.style.top = -o, document.body.style.left = -l, setTimeout(function() { return window.requestAnimationFrame(function() { var r = n - window.innerHeight; r && o >= n && (document.body.style.top = -(o + r)); }); }, 300); } }); }, De = function() { if (S !== void 0) { var t = -parseInt(document.body.style.top, 10), o = -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(o, t), S = void 0; } }, Oe = function(t) { return t ? t.scrollHeight - t.scrollTop <= t.clientHeight : !1; }, Ee = function(t, o) { var l = t.targetTouches[0].clientY - ae; return ie(t.target) ? !1 : o && o.scrollTop === 0 && l > 0 || Oe(o) && l < 0 ? E(t) : (t.stopPropagation(), !0); }, Me = function(t, o) { if (!t) { console.error("disableBodyScroll unsuccessful - targetElement must be provided when calling disableBodyScroll on IOS devices."); return; } if (!C.some(function(n) { return n.targetElement === t; })) { var l = { targetElement: t, options: o || {} }; C = [].concat(He(C), [l]), D ? qe() : Ae(o), D && (t.ontouchstart = function(n) { n.targetTouches.length === 1 && (ae = n.targetTouches[0].clientY); }, t.ontouchmove = function(n) { n.targetTouches.length === 1 && Ee(n, t); }, O || (document.addEventListener("touchmove", E, j ? { passive: !1 } : void 0), O = !0)); } }, ze = function(t) { if (!t) { console.error("enableBodyScroll unsuccessful - targetElement must be provided when calling enableBodyScroll on IOS devices."); return; } C = C.filter(function(o) { return o.targetElement !== t; }), D && (t.ontouchstart = null, t.ontouchmove = null, O && C.length === 0 && (document.removeEventListener("touchmove", E, j ? { passive: !1 } : void 0), O = !1)), D ? De() : Ne(); }, K = $({ name: "SidePanelCloseButton", emits: ["close"] }); const Le = /* @__PURE__ */ d( "span", { class: "vsp-close__x" }, null, -1 /* HOISTED */ ), xe = [ Le ]; function Fe(e, t, o, l, n, r) { return s(), m("div", { class: "vsp-close", onClick: t[0] || (t[0] = (a) => e.$emit("close")) }, [...xe]); } K.render = Fe; K.__file = "src/components/SidePanelCloseButton.vue"; var X = $({ name: "VueSidePanel", components: { SidePanelCloseButton: K }, 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: t, attrs: o }) { let l; const n = u(null), r = u(null), a = u(null), i = u(null), y = u(null), f = u(0), g = u(0), A = u(0), z = u(0), L = u(0), x = u(), Y = u(!1), V = async () => { window?.innerHeight > 0 && (L.value = window.innerHeight), f.value = a.value ? a.value.clientHeight : 0, A.value = i.value ? i.value.clientHeight : 0, g.value = y.value ? y.value.scrollHeight : 0, z.value = n.value ? n.value.clientHeight : 0; }, de = () => t("update:modelValue", !1), F = (v, p) => { if (p) { 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); W(() => { x.value = e.zIndex === "auto" ? re() : e.zIndex; }), ge(() => { document.getElementById(e.idName) || (l = document.createElement("div"), l.setAttribute("id", e.idName), document.body.appendChild(l)); }), pe(() => { const { modelValue: v, lockScroll: p } = e; p && n.value && v && F(n.value, !1), l && document.body.removeChild(l), window.removeEventListener("resize", V); }), _(() => [i.value, a.value, e.height, e.width, e.side, e.modelValue], () => { be(() => V()); }), _(() => [e.modelValue, n.value], (v, p) => { const fe = p ? p[0] : !1, [G, N] = v, ve = G, ye = fe && !G; if (N) { if (ve && (Y.value = !!document.body.style.overflow), G) { e.lockScroll && F(N, !0), V(), window.addEventListener("resize", V); return; } !e.lockScroll || !ye || Y.value || (setTimeout(() => { N && F(N, !1); }, e.panelDuration), window.removeEventListener("resize", V)); } }, { immediate: !0 }); const se = q(() => { if (!z.value) return; const v = g.value + A.value + f.value; let p = z.value - A.value - f.value; return ["top", "bottom"].includes(e.side) && e.height === "auto" && (p = L.value >= v ? g.value : L.value - A.value - f.value), p; }), ue = q(() => ({ zIndex: x.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: x.value, backgroundColor: e.panelColor, animationDuration: `${e.panelDuration}ms`, ...Object.assign({}, o.style) })); return { body: y, panel: n, overlay: r, overlayStyles: ue, header: i, footer: a, closePanel: de, panelStyles: ce, bodyHeight: se }; } }); function Ge(e, t, o, l, n, r) { const a = me("SidePanelCloseButton"); return s(), I(he, { to: `#${e.idName}` }, [ d( "div", { class: h(["vsp-wrapper", [e.modelValue && "vsp-wrapper--active"]]) }, [ H(Q, { name: "overlay", persisted: "" }, { default: k(() => [ J(d( "div", { ref: "overlay", class: "vsp-overlay", style: R(e.overlayStyles), onClick: t[0] || (t[0] = () => e.noClose ? void 0 : e.closePanel()) }, null, 4 /* STYLE */ ), [ [Z, e.modelValue] ]) ]), _: 1 /* STABLE */ }), H(Q, { name: e.transitionName || `slide-${e.side}`, onAfterEnter: t[1] || (t[1] = (i) => e.$emit("opened")), onAfterLeave: t[2] || (t[2] = (i) => e.$emit("closed")) }, { default: k(() => [ !e.rerender || e.modelValue ? J((s(), m( "div", { key: 0, ref: "panel", class: h(["vsp", [`vsp--${e.side}-side`, e.$attrs.class]]), style: R(e.panelStyles) }, [ e.$slots.header ? (s(), m( "div", { key: 0, ref: "header", class: h([e.headerClass, "vsp__header"]) }, [ B(e.$slots, "header", { close: e.closePanel }) ], 2 /* CLASS */ )) : w("v-if", !0), d( "div", { ref: "body", class: h([e.bodyClass, "vsp__body"]), style: R({ height: `${e.bodyHeight}px` }) }, [ B(e.$slots, "default", { close: e.closePanel }), e.hideCloseBtn ? w("v-if", !0) : (s(), I(a, { key: 0, onClose: e.closePanel }, null, 8, ["onClose"])) ], 6 /* CLASS, STYLE */ ), e.$slots.footer ? (s(), m( "div", { key: 1, ref: "footer", class: h([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"]); } X.render = Ge; X.__file = "src/components/SidePanel.vue"; const Re = { id: "konnectio-side-panel-header" }, Ue = { id: "konnectio-side-panel-title" }, We = { key: 0, id: "konnectio-side-panel-subtitle" }, je = ["innerHTML"], Ke = /* @__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: t }) { const o = t, l = q(() => { const a = navigator?.userAgentData?.platform || navigator?.platform; return (/iPad|iPhone|iPod/.test(a) || a === "MacIntel" && navigator.maxTouchPoints > 1) && !window.MSStream; }); function n() { o("closed"); } function r() { o("opened"); } return (a, i) => (s(), I(c(X), { modelValue: e.modelValue, "lock-scroll": !l.value && e.lockScroll, "hide-close-btn": e.hideCloseButton, width: e.width, "onUpdate:modelValue": i[1] || (i[1] = (y) => a.$emit("update:modelValue", y)), onClosed: n, onOpened: r }, we({ header: k(() => [ d("div", Re, [ d("h2", Ue, [ d("span", null, b(c(Ve)(e.title)), 1), d("button", { id: "konnectio-side-panel-close", onClick: i[0] || (i[0] = (y) => a.$emit("update:modelValue", !1)) }, [ H(Pe, { icon: "times", type: "fas", color: "header" }) ]) ]), e.subtitle ? (s(), m("h4", We, [ d("span", null, b(e.subtitle), 1) ])) : w("", !0) ]) ]), default: k(() => [ e.description ? (s(), m("div", { key: 0, class: "konnectio-side-panel-description", innerHTML: e.description }, null, 8, je)) : w("", !0), B(a.$slots, "default", {}, void 0, !0) ]), _: 2 }, [ a.$slots.footer ? { name: "footer", fn: k(() => [ B(a.$slots, "footer", {}, void 0, !0) ]), key: "0" } : void 0 ]), 1032, ["modelValue", "lock-scroll", "hide-close-btn", "width"])); } }), dt = /* @__PURE__ */ M(Ke, [["__scopeId", "data-v-c84b8ee2"]]), Xe = { class: "konnectio-phone-input" }, Ye = /* @__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: t }) { const o = t, l = e, n = l.id || ee(), r = u("+45"), a = u(""); function i() { o("update:modelValue", `${r.value} ${a.value}`); } return W(() => { if (l.modelValue) { const y = l.modelValue.split(" "); r.value = y[0], a.value = y[1]; } }), (y, f) => (s(), I(ne, { label: e.label, id: c(n), type: "phone", required: e.required, readonly: e.readonly }, { default: k(() => [ d("div", Xe, [ H(te, { modelValue: r.value, "onUpdate:modelValue": f[0] || (f[0] = (g) => r.value = g), type: "text", id: c(ee)(), name: "phone-code", autocomplete: "tel-country-code", icon: e.icon, "icon-color": e.iconColor, "icon-type": e.iconType, placeholder: "+XX", required: e.required, readonly: e.readonly, onInput: f[1] || (f[1] = (g) => i()) }, null, 8, ["modelValue", "id", "icon", "icon-color", "icon-type", "required", "readonly"]), H(te, { modelValue: a.value, "onUpdate:modelValue": f[2] || (f[2] = (g) => a.value = g), type: "number", name: "phone", autocomplete: "tel-national", inputmode: "numeric", id: c(n), placeholder: e.placeholder, required: e.required, readonly: e.readonly, onInput: f[3] || (f[3] = (g) => i()) }, null, 8, ["modelValue", "id", "placeholder", "required", "readonly"]) ]) ]), _: 1 }, 8, ["label", "id", "required", "readonly"])); } }), rt = /* @__PURE__ */ M(Ye, [["__scopeId", "data-v-3e373d03"]]), Je = ["required", "type", "name", "readonly", "disabled", "value", "checked"], Ze = ["data-test"], Qe = { key: 0 }, _e = { key: 1, class: /* @__PURE__ */ h(["konnectio-click-box-label", "inline"]) }, et = /* @__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: t }) { const o = e, l = t, n = Se(); function r() { o.readonly !== !0 && l( "update:modelValue", o.type === "radio" ? o.val : o.numeric ? o.modelValue ? 0 : 1 : !o.modelValue ); } return (a, i) => (s(), I(ne, { required: e.required, type: e.type, readonly: e.readonly }, { default: k(() => [ d("label", { class: h([ "konnectio-click-box-container", { "is-readonly": e.readonly }, { "has-label": e.label || c(n).default }, e.type === "radio" ? "radio" : "checkbox", { active: e.type === "radio" ? e.val === e.modelValue : !!e.modelValue } ]) }, [ d("input", ke(a.$attrs, { required: !!e.required, type: e.type, name: e.name, class: "hidden", readonly: !!e.readonly, disabled: !!e.readonly, value: e.type === "radio" ? e.val : e.modelValue, checked: e.type === "radio" ? e.val === e.modelValue : !!e.modelValue, onChange: i[0] || (i[0] = (y) => r()) }), null, 16, Je), d("div", { class: h([ "konnectio-click-box", { checked: e.type === "radio" ? e.val === e.modelValue : !!e.modelValue } ]), tabindex: "0", "data-test": e.name, onKeyup: i[1] || (i[1] = Ce((y) => r(), ["enter"])) }, null, 42, Ze), e.label ? (s(), m("div", { key: 0, class: h(["konnectio-click-box-label", "text-hover", { "with-price": e.price }]) }, [ d("span", null, b(e.label), 1), e.price ? (s(), m("span", Qe, b(e.price), 1)) : w("", !0) ], 2)) : c(n).default ? (s(), m("div", _e, [ B(a.$slots, "default", {}, void 0, !0) ])) : w("", !0) ], 2) ]), _: 3 }, 8, ["required", "type", "readonly"])); } }), st = /* @__PURE__ */ M(et, [["__scopeId", "data-v-673fba05"]]), tt = { href: "https://policies.google.com/privacy", target: "_blank" }, ot = { href: "https://policies.google.com/terms", target: "_blank" }, lt = /* @__PURE__ */ $({ __name: "GoogleNotice", setup(e) { const { t } = $e(); return (o, l) => (s(), m("span", null, [ U(b(c(t)("googleNotice")) + " ", 1), d("a", tt, b(c(t)("googlePrivacyPolicy")), 1), U(" " + b(c(t)("googleAnd")) + " ", 1), d("a", ot, b(c(t)("googleTOS")), 1), U(" " + b(c(t)("googleApply")) + ". ", 1) ])); } }); function le(e) { const t = e; t.__i18n = t.__i18n || [], t.__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(lt); const nt = /* @__PURE__ */ $({ __name: "CheckoutWindow", setup(e) { const { paymentGatewayId: t } = Be(Te()); return W(() => { const o = document.createElement("script"), l = document.createElement("script"); o.setAttribute("src", "https://checkout.dibspayment.eu/v1/checkout.js?v=1"), l.setAttribute("src", "https://checkout.reepay.com/checkout.js"), document.head.appendChild(o), document.head.appendChild(l); }), (o, l) => (s(), m("div", null, [ d("div", { id: "konnectio-payment-checkout-wrapper", class: h({ reePay: c(t) === c(Ie).ReePay }) }, [...l[0] || (l[0] = [ d("div", { id: "konnectio-payment-checkout" }, null, -1) ])], 2) ])); } }), ut = /* @__PURE__ */ M(nt, [["__scopeId", "data-v-403e3fbf"]]); export { dt as B, ut as C, rt as P, lt as _, st as a }; //# sourceMappingURL=CheckoutWindow-nL6eFQsJ.js.map