@konnectio/core/dist/availability.js

Konnectio Core Frontend Integration.

import { At as e, D as t, Dt as n, E as r, Et as i, M as a, O as o, P as s, S as c, T as l, Y as u, bt as d, c as f, d as p, dt as m, k as h, o as g, p as _, q as v, r as y, s as b, t as x, x as S, y as C } from "./mitt-Dp_pykgV.js";
import { t as w } from "./dist-CcS6KL-S.js";
import { C as T, S as E, b as D } from "./SelectField-CfD2awPl.js";
import { t as O } from "./_-13YE3WJt.js";
import { t as k } from "./AvailabilitySkeleton-DVRsnt_Y.js";
import { t as A } from "./HotelAvailabilityForm-DxA1wrkE.js";
import { t as j } from "./EventAvailabilityForm-Dy1fXJzt.js";
import { t as M } from "./ErrorMessage-B6saHmHE.js";
//#region src/layouts/Availability.vue?vue&type=script&setup=true&lang.ts
var N = { class: "konnectio-availability-module" }, P = { class: "konnectio-availability-navigation" }, F = { class: "konnectio-availability-search-form" }, I = /* @__PURE__ */ E(/* @__PURE__ */ s({
	name: "AvailabilityLayout",
	__name: "Availability",
	props: {
		accessToken: {},
		eventLink: {},
		eventLocation: {},
		hideEventLocations: { default: "no" },
		hotelLink: {},
		hotelLocation: {},
		hideHotelLocations: { default: "no" },
		hotelDisableDefaultLocation: { default: "no" },
		styling: {}
	},
	setup(s) {
		let { t: f } = g(), { fetchMetadata: _ } = T(), y = s, b = d(), x = l(() => !!y.hotelLink || !!y.eventLink), w = l(() => !!y.hotelLink && !!y.eventLink), E = l(() => b.value === "hotel"), I = l(() => b.value === "event"), L = (e) => b.value = e, R = l(() => ({
			fontSize: "13px",
			...y.styling
		}));
		return v(() => {
			!y.hotelLink && y.eventLink ? b.value = "event" : b.value = "hotel";
		}), (l, d) => (u(), t(D, { styling: R.value }, {
			default: m(() => [x.value ? (u(), t(c, { key: 0 }, {
				default: m(() => [r("div", null, [a(O, {
					"access-token": s.accessToken,
					callback: i(_)
				}, {
					default: m(() => [r("div", N, [w.value ? (u(), h(S, { key: 0 }, [r("nav", P, [r("ul", null, [r("li", null, [r("button", {
						class: n({ active: E.value }),
						onClick: d[0] ||= C((e) => L("hotel"), ["prevent"])
					}, [r("span", null, e(i(f)("availability.hotel")), 1)], 2)]), r("li", null, [r("button", {
						class: n({ active: I.value }),
						onClick: d[1] ||= C((e) => L("event"), ["prevent"])
					}, [r("span", null, e(i(f)("availability.events")), 1)], 2)])])]), d[2] ||= r("div", { class: "konnectio-availability-divider" }, null, -1)], 64)) : o("", !0), r("div", F, [a(p, {
						name: "fade",
						mode: "out-in",
						appear: ""
					}, {
						default: m(() => [E.value ? (u(), t(A, {
							key: 0,
							link: s.hotelLink,
							"selected-location": Number(s.hotelLocation),
							"disable-default-location": s.hotelDisableDefaultLocation === "yes",
							"hide-locations": s.hideHotelLocations === "yes"
						}, null, 8, [
							"link",
							"selected-location",
							"disable-default-location",
							"hide-locations"
						])) : I.value ? (u(), t(j, {
							key: 1,
							link: s.eventLink,
							"selected-location": Number(s.eventLocation),
							"hide-locations": s.hideEventLocations === "yes"
						}, null, 8, [
							"link",
							"selected-location",
							"hide-locations"
						])) : o("", !0)]),
						_: 1
					})])])]),
					_: 1
				}, 8, ["access-token", "callback"])])]),
				fallback: m(() => [r("div", null, [a(k, { view: w.value ? "both" : b.value }, null, 8, ["view"])])]),
				_: 1
			})) : (u(), t(M, {
				key: 1,
				title: "Unable to render Availability module",
				description: "The 'hotel-link' and/or 'event-link' properties are missing.<br>\r\n            The Konnectio Availability module can't be rendered without at least one link property set."
			}))]),
			_: 1
		}, 8, ["styling"]));
	}
}), [["__scopeId", "data-v-a8e928a0"]]), L = f(), R = x(), z = class extends HTMLElement {
	vueApp;
	constructor() {
		super();
	}
	disconnectedCallback() {
		this.vueApp.unmount();
	}
	connectedCallback() {
		let e = b(I, this.attributes);
		this.vueApp = _(I, e), this.vueApp.provide("emitter", R), this.vueApp.use(w), this.vueApp.use(y), this.vueApp.use(L);
		let t = document.createElement("div");
		this.vueApp.mount(t), this.appendChild(t.children[0]);
	}
};
window.customElements.define("konnectio-availability", z);
//#endregion
export { z as default };