@inertia-vuetify/modal 0.0.0-stage → 3.0.0

package/dist/inertia-modal-vuetify.js

@@ -0,0 +1,1140 @@
+import * as e from "@inertiaui/vanilla";
+import { except as t, generateId as n, kebabCase as r, markAriaHidden as i, only as a, prefersReducedMotion as o, rejectNullValues as s, sameUrlPath as c } from "@inertiaui/vanilla";
+import { Fragment as l, Transition as u, computed as d, createBlock as f, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createSlots as g, createTextVNode as _, createVNode as v, defineComponent as y, guardReactiveProps as b, h as x, inject as S, markRaw as C, mergeProps as w, nextTick as ee, normalizeClass as te, normalizeProps as T, normalizeStyle as ne, onBeforeUnmount as E, onMounted as D, onUnmounted as O, openBlock as k, provide as A, reactive as j, readonly as M, ref as N, renderSlot as P, resolveDynamicComponent as F, toDisplayString as re, toRef as ie, toValue as ae, unref as I, useAttrs as oe, useId as se, useSlots as ce, useTemplateRef as le, watch as L, withCtx as R } from "vue";
+import { http as z, progress as B, router as V, usePage as ue } from "@inertiajs/vue3";
+import { mergeDataIntoQueryString as de } from "@inertiajs/core";
+import { useDefaults as fe, useDisplay as pe, useLocale as me, useRtl as he } from "vuetify";
+import { VCard as ge, VCardActions as _e, VCardItem as ve } from "vuetify/components/VCard";
+import { VDialog as ye } from "vuetify/components/VDialog";
+import { VBtn as be } from "vuetify/components/VBtn";
+// src/helpers.ts
+function xe(e) {
+	return typeof e == "string" ? JSON.parse(e) : e;
+}
+var Se = null;
+function H(e = "inertiaui_modal_") {
+	return Se?.() ?? n(e);
+}
+// src/cache.ts
+var U = class {
+	cache = /* @__PURE__ */ new Map();
+	timers = /* @__PURE__ */ new Map();
+	inFlight = /* @__PURE__ */ new Map();
+	static key(e, t, n) {
+		return `${e}:${t}:${JSON.stringify(n)}`;
+	}
+	get(e) {
+		let t = this.cache.get(e);
+		return t ? Date.now() > t.expiresAt ? (this.delete(e), null) : t.response : null;
+	}
+	set(e, t, n) {
+		this.delete(e), this.cache.set(e, {
+			response: t,
+			expiresAt: Date.now() + n
+		}), n > 0 && this.timers.set(e, setTimeout(() => this.delete(e), n));
+	}
+	delete(e) {
+		this.cache.delete(e);
+		let t = this.timers.get(e);
+		t && (clearTimeout(t), this.timers.delete(e));
+	}
+	getInFlight(e) {
+		return this.inFlight.get(e);
+	}
+	setInFlight(e, t) {
+		this.inFlight.set(e, t);
+	}
+	deleteInFlight(e) {
+		this.inFlight.delete(e);
+	}
+}, W = {
+	type: "modal",
+	navigate: !1,
+	appElement: "#app",
+	modal: {
+		closeButton: !0,
+		closeExplicitly: !1,
+		closeOnClickOutside: !0,
+		maxWidth: "2xl",
+		paddingClasses: "pa-4 pa-sm-6",
+		panelClasses: "",
+		position: "center",
+		fullscreen: "sm"
+	},
+	slideover: {
+		closeButton: !0,
+		closeExplicitly: !1,
+		closeOnClickOutside: !0,
+		maxWidth: "md",
+		paddingClasses: "pa-4 pa-sm-6",
+		panelClasses: "",
+		position: "right",
+		fullscreen: !1
+	}
+}, G;
+function Ce() {
+	G = structuredClone(W);
+}
+function we(e, t) {
+	if (typeof e == "object") {
+		G = {
+			type: e.type ?? W.type,
+			navigate: e.navigate ?? W.navigate,
+			appElement: e.appElement === void 0 ? W.appElement : e.appElement,
+			modal: {
+				...W.modal,
+				...e.modal
+			},
+			slideover: {
+				...W.slideover,
+				...e.slideover
+			}
+		};
+		return;
+	}
+	let n = e.split("."), r = G;
+	for (let e of n.slice(0, -1)) r = r[e] ??= {};
+	r[n[n.length - 1]] = t;
+}
+function K(e) {
+	if (e === void 0) return G;
+	let t = G;
+	for (let n of e.split(".")) {
+		if (typeof t != "object" || !t) return null;
+		t = t[n];
+	}
+	return t ?? null;
+}
+function q(e, t) {
+	return K(`${e ? "slideover" : "modal"}.${t}`);
+}
+var Te = {
+	sm: "384px",
+	md: "448px",
+	lg: "512px",
+	xl: "576px",
+	"2xl": "672px",
+	"3xl": "768px",
+	"4xl": "896px",
+	"5xl": "1024px",
+	"6xl": "1152px",
+	"7xl": "1280px"
+};
+function J(e) {
+	return Te[e ?? ""] ?? Te["2xl"];
+}
+function Ee(e) {
+	return e === "top" || e === "bottom" ? e : "center";
+}
+Ce();
+// src/modalStack.ts
+var Y = N(null), X = N([]), De = N({}), Z = null, Q = new U();
+function Oe(e, t = H()) {
+	return {
+		...e,
+		Accept: "text/html, application/xhtml+xml",
+		"X-Requested-With": "XMLHttpRequest",
+		"X-Inertia": "true",
+		"X-Inertia-Version": ue().version ?? "",
+		"X-InertiaUI-Modal": t,
+		"X-InertiaUI-Modal-Base-Url": Y.value ?? ""
+	};
+}
+function ke(e, t = {}) {
+	if (e.startsWith("#")) return Promise.resolve();
+	let n = t.method ?? "get", [r, i] = de(n, e, t.data ?? {}, t.queryStringArrayFormat ?? "brackets"), a = U.key(n, r, i);
+	if (Q.get(a)) return Promise.resolve();
+	let o = Q.getInFlight(a);
+	if (o) return o.then(() => {});
+	t.onPrefetching?.();
+	let s = z.getClient().request({
+		url: r,
+		method: n,
+		data: i,
+		headers: Oe(t.headers ?? {})
+	}).then((e) => (Q.set(a, e, t.cacheFor ?? 3e4), t.onPrefetched?.(), e)).finally(() => Q.deleteInFlight(a));
+	return Q.setInFlight(a, s), s.then(() => {});
+}
+var Ae = (e) => {}, je = class {
+	id;
+	isOpen = !1;
+	shouldRender = !1;
+	listeners = {};
+	component;
+	props;
+	response;
+	config;
+	onCloseCallback;
+	afterLeaveCallback;
+	index;
+	onTopOfStack;
+	name;
+	constructor(e, t, n, r, i) {
+		this.id = t.id ?? H(), this.component = e, this.props = N(t.props ?? {}), this.response = t, this.config = n ?? {}, this.onCloseCallback = r ?? null, this.afterLeaveCallback = i ?? null, this.index = d(() => X.value.findIndex((e) => e.id === this.id)), this.onTopOfStack = d(() => X.value.length < 2 || X.value.findLast((e) => e.shouldRender)?.id === this.id);
+	}
+	getComponentPropKeys = () => {
+		let e = this.component?.props;
+		return Array.isArray(e) ? e : e ? Object.keys(e) : [];
+	};
+	getParentModal = () => {
+		let e = this.index.value;
+		return e < 1 ? null : X.value.slice(0, e).findLast((e) => e.isOpen) ?? null;
+	};
+	getChildModal = () => {
+		let e = this.index.value;
+		return e === X.value.length - 1 ? null : X.value.slice(e + 1).find((e) => e.isOpen) ?? null;
+	};
+	show = () => {
+		let e = X.value[this.index.value];
+		e && !e.isOpen && (e.isOpen = !0, e.shouldRender = !0);
+	};
+	close = () => {
+		let e = X.value[this.index.value];
+		e?.isOpen && (Object.keys(this.listeners).forEach((e) => this.off(e)), e.isOpen = !1, this.onCloseCallback?.(), this.onCloseCallback = null);
+	};
+	setOpen = (e) => {
+		e ? this.show() : this.close();
+	};
+	afterLeave = () => {
+		let e = this.index.value, t = X.value[e];
+		if (t) {
+			if (t.isOpen) return;
+			t.shouldRender = !1, this.afterLeaveCallback?.(), this.afterLeaveCallback = null;
+		}
+		if (e !== 0) return;
+		X.value = [];
+		let n = Y.value;
+		Y.value = null, Z = n, n && typeof window < "u" && !c(n, window.location.href) && V.push({
+			url: n,
+			preserveScroll: !0,
+			preserveState: !0,
+			props: (e) => ({
+				...e,
+				_inertiaui_modal: void 0
+			})
+		});
+	};
+	on = (e, t) => {
+		e = r(e), this.listeners[e] = this.listeners[e] ?? [], this.listeners[e].push(t);
+	};
+	off = (e, t) => {
+		e = r(e), t ? this.listeners[e] = this.listeners[e]?.filter((e) => e !== t) ?? [] : delete this.listeners[e];
+	};
+	emit = (e, ...t) => {
+		this.listeners[r(e)]?.forEach((e) => e(...t));
+	};
+	registerEventListenersFromAttrs = (e) => {
+		let t = Object.keys(e).filter((e) => e.startsWith("on")).map((t) => {
+			let n = r(t).replace(/^on-/, ""), i = e[t];
+			return this.on(n, i), () => this.off(n, i);
+		});
+		return () => t.forEach((e) => e());
+	};
+	reload = async (e = {}) => {
+		if (!this.response.url) return;
+		let n = t(e.only ?? Object.keys(this.response.props), e.except ?? []), r = e.method ?? "get", i = e.data ?? {};
+		e.onStart?.();
+		try {
+			let t = await z.getClient().request({
+				url: this.response.url,
+				method: r,
+				data: r === "get" ? void 0 : i,
+				params: r === "get" ? i : void 0,
+				headers: {
+					...e.headers,
+					Accept: "text/html, application/xhtml+xml",
+					"X-Inertia": "true",
+					"X-Inertia-Partial-Component": this.response.component,
+					"X-Inertia-Version": this.response.version ?? "",
+					"X-Inertia-Partial-Data": n.join(","),
+					"X-InertiaUI-Modal": H(),
+					"X-InertiaUI-Modal-Base-Url": Y.value ?? ""
+				}
+			});
+			this.updateProps(xe(t.data).props), e.onSuccess?.(t);
+		} catch (t) {
+			e.onError?.(t);
+		} finally {
+			e.onFinish?.();
+		}
+	};
+	updateProps = (e) => {
+		Object.assign(this.props.value, e);
+	};
+};
+function Me(e, t) {
+	De.value[e] = {
+		name: e,
+		callback: t
+	};
+}
+function Ne(e, t, n, r, i) {
+	let a = De.value[e];
+	if (!a) throw Error(`The local modal "${e}" has not been registered.`);
+	let o = He(null, { props: i ?? {} }, t, n, r);
+	return o.name = e, a.callback(o), o;
+}
+function Pe(e) {
+	e.close(), X.value = X.value.filter((t) => t.id !== e.id), e.afterLeaveCallback?.(), e.afterLeaveCallback = null;
+}
+function Fe(e) {
+	return typeof e == "object" && !!e && typeof e.component == "string";
+}
+function Ie(e, t, n) {
+	e && t && typeof window < "u" && V.push({
+		url: e,
+		preserveScroll: !0,
+		preserveState: !0,
+		props: (e) => ({
+			...e,
+			_inertiaui_modal: {
+				...n,
+				baseUrl: Y.value
+			}
+		})
+	});
+}
+function Le(e, t = {}, n = null, r = null) {
+	return Fe(e) ? V.resolveComponent(e.component).then((i) => He(C(i), e, t, n, r)) : Promise.reject(/* @__PURE__ */ Error("Invalid modal response. This usually happens when the server returns a redirect (e.g., due to session expiration). Check if the user is still authenticated."));
+}
+function Re(e) {
+	try {
+		e ? B.start() : B.finish();
+	} catch {}
+}
+async function ze(e, t, n = {}, r = {}, i = {}, a = null, o = null, s = "brackets", c = !1, l = null, u = null, d = null, f = null) {
+	if (e.startsWith("#")) return Ne(e.substring(1), i, a, o, f);
+	let [p, m] = de(t, e, n, s), h = (e) => {
+		let t = xe(e.data);
+		return u?.(e), Le(t, i, a, o).then((e) => (Ie(t.url, c, t), e));
+	};
+	X.value.length === 0 && (Y.value = typeof window < "u" ? window.location.href : "");
+	let g = Q.get(U.key(t, p, m));
+	return g ? h(g) : (l?.(), Re(!0), z.getClient().request({
+		url: p,
+		method: t,
+		data: m,
+		headers: Oe(r)
+	}).then(h, (e) => {
+		throw d?.(e), e;
+	}).finally(() => Re(!1)));
+}
+function Be(e, t = {}) {
+	return ze(e, t.method ?? "get", t.data ?? {}, t.headers ?? {}, t.config ?? {}, t.onClose, t.onAfterLeave, t.queryStringArrayFormat ?? "brackets", t.navigate ?? K("navigate"), t.onStart, t.onSuccess, t.onError, t.props ?? null).then((e) => (Object.entries(t.listeners ?? {}).forEach(([t, n]) => e.on(r(t), n)), e));
+}
+function Ve(e) {
+	Object.values(e.response.meta?.deferredProps ?? {}).forEach((t) => e.reload({ only: t }));
+}
+function He(e, t, n, r, i) {
+	let a = new je(e, t, n, r, i);
+	return X.value.push(j(a)), Ve(a), ee(() => a.show()), a;
+}
+var Ue = [
+	"closeButton",
+	"closeExplicitly",
+	"closeOnClickOutside",
+	"maxWidth",
+	"paddingClasses",
+	"panelClasses",
+	"position",
+	"slideover",
+	"fullscreen"
+];
+function $() {
+	return {
+		setComponentResolver: () => {},
+		getBaseUrl: () => Y.value,
+		setBaseUrl: (e) => Y.value = e,
+		isClosingToBaseUrl: (e) => Z ? new URL(Z, "http://x").pathname === new URL(e, "http://x").pathname : !1,
+		clearClosingToBaseUrl: () => Z = null,
+		stack: M(X),
+		push: He,
+		pushFromResponseData: Le,
+		closeAll: (e = !1) => {
+			e ? X.value = [] : [...X.value].toReversed().forEach((e) => e.close());
+		},
+		reset: () => X.value = [],
+		visit: ze,
+		registerLocalModal: Me,
+		removeLocalModal: (e) => delete De.value[e]
+	};
+}
+// src/ModalRenderer.vue
+var We = /* @__PURE__ */ y({
+	__name: "ModalRenderer",
+	props: { index: {} },
+	setup(e) {
+		let t = e, n = $(), r = d(() => n.stack.value[t.index]);
+		return A("modalContext", r), (e, t) => r.value?.component ? (k(), f(F(r.value.component), w({ key: 0 }, I(a)(r.value.props, r.value.getComponentPropKeys(), !0), { onModalEvent: t[0] ||= (e, ...t) => r.value.emit(e, ...t) }), null, 16)) : p("", !0);
+	}
+}), Ge = /* @__PURE__ */ y({
+	__name: "ModalRoot",
+	setup(e) {
+		let t = $(), n = ue(), r = !1, i = /* @__PURE__ */ new Set(), a = /* @__PURE__ */ new Map(), o = (e) => e.id || `${e.component}:${e.url}`, s = (e) => e?._inertiaui_modal;
+		O(V.on("start", ({ detail: { visit: e } }) => {
+			r = !0, e.method !== "get" && a.set(e.id, !1);
+		})), O(V.on("success", ({ detail: { page: e, visitId: t } }) => {
+			t && a.has(t) && !s(e.props) && a.set(t, !0);
+		})), O(V.on("finish", ({ detail: { visit: e } }) => {
+			r = !1, a.get(e.id) && t.closeAll(), a.delete(e.id);
+		})), O(V.on("navigate", ({ detail: { page: e } }) => {
+			let n = s(e.props);
+			if (t.isClosingToBaseUrl(e.url)) {
+				t.clearClosingToBaseUrl(), t.closeAll(!0), t.setBaseUrl(null);
+				return;
+			}
+			if (!n || !c(e.url, n.url)) {
+				t.closeAll(!0), t.setBaseUrl(null);
+				return;
+			}
+			let a = o(n), l = t.stack.value;
+			i.has(a) || n.id && l.some((e) => e.id === n.id) || l.some((e) => e.response.component === n.component && c(e.response.url, n.url)) || (t.setBaseUrl(n.baseUrl ?? null), i.add(a), t.pushFromResponseData(n, {}, () => {
+				n.baseUrl ? (t.setBaseUrl(null), !r && typeof window < "u" && window.location.href !== n.baseUrl && V.visit(n.baseUrl, {
+					preserveScroll: !0,
+					preserveState: !0
+				})) : console.error("No base url in modal response data so cannot navigate back");
+			}).finally(() => i.delete(a)));
+		}));
+		let u = typeof window > "u" ? void 0 : z.onRequest((e) => {
+			let r = t.getBaseUrl() ?? s(n.props)?.baseUrl;
+			return r && (e.headers = {
+				...e.headers,
+				"X-InertiaUI-Modal-Base-Url": r
+			}), e;
+		});
+		return O(() => u?.()), L(() => s(n.props), (e, n) => {
+			if (!e) return;
+			let r = (t) => t.component === e.component && c(t.url, e.url);
+			n && r(n) ? t.stack.value[0]?.updateProps(e.props ?? {}) : n || t.stack.value.find((e) => r(e.response))?.updateProps(e.props ?? {});
+		}), (e, n) => (k(), m(l, null, [P(e.$slots, "default"), I(t).stack.value.length ? (k(), f(We, {
+			key: 0,
+			index: 0
+		})) : p("", !0)], 64));
+	}
+});
+// src/app.ts
+function Ke(e, t) {
+	return () => x(Ge, () => x(e, t));
+}
+function qe(e) {
+	let t = e._component, n = t.render;
+	n && (t.render = () => x(Ge, () => n()));
+}
+// src/Deferred.vue
+var Je = /* @__PURE__ */ y({
+	__name: "Deferred",
+	props: { data: {} },
+	setup(e) {
+		let t = e, n = S("modalContext");
+		if (!n) throw Error("Deferred component must be used inside a Modal component");
+		let r = d(() => [t.data].flat().every((e) => n.value?.props[e] !== void 0));
+		return (e, t) => r.value ? P(e.$slots, "default", {}, void 0, void 0, 0) : P(e.$slots, "fallback", {}, void 0, void 0, 1);
+	}
+}), Ye = /* @__PURE__ */ y({
+	inheritAttrs: !1,
+	__name: "HeadlessModal",
+	props: {
+		name: String,
+		slideover: {
+			type: Boolean,
+			default: null
+		},
+		closeButton: {
+			type: Boolean,
+			default: null
+		},
+		closeExplicitly: {
+			type: Boolean,
+			default: null
+		},
+		closeOnClickOutside: {
+			type: Boolean,
+			default: null
+		},
+		maxWidth: {
+			type: String,
+			default: null
+		},
+		paddingClasses: {
+			type: [Boolean, String],
+			default: null
+		},
+		panelClasses: {
+			type: [Boolean, String],
+			default: null
+		},
+		position: {
+			type: String,
+			default: null
+		},
+		fullscreen: {
+			type: [
+				Boolean,
+				String,
+				Number
+			],
+			default: null
+		}
+	},
+	emits: [
+		"modal-event",
+		"focus",
+		"blur",
+		"close",
+		"success"
+	],
+	setup(e, { expose: t, emit: n }) {
+		let r = e, i = n, a = $(), o = r.name ? N(null) : S("modalContext", N(null)), s = d(() => {
+			let e = o.value?.config?.slideover ?? r.slideover ?? K("type") === "slideover";
+			return {
+				slideover: e,
+				closeButton: r.closeButton ?? q(e, "closeButton"),
+				closeExplicitly: r.closeExplicitly ?? q(e, "closeExplicitly"),
+				closeOnClickOutside: r.closeOnClickOutside ?? q(e, "closeOnClickOutside"),
+				maxWidth: r.maxWidth ?? q(e, "maxWidth"),
+				paddingClasses: r.paddingClasses ?? q(e, "paddingClasses"),
+				panelClasses: r.panelClasses ?? q(e, "panelClasses"),
+				position: r.position ?? q(e, "position"),
+				fullscreen: r.fullscreen ?? q(e, "fullscreen"),
+				...o.value?.config
+			};
+		}), c = oe(), u;
+		function h() {
+			u = o.value?.registerEventListenersFromAttrs(c);
+		}
+		r.name && (a.registerLocalModal(r.name, (e) => {
+			let t = o.value;
+			t?.shouldRender && t.id !== e.id && Pe(t), o.value = j(e), h();
+		}), E(() => a.removeLocalModal(r.name))), D(() => {
+			r.name || h();
+		}), E(() => u?.());
+		function g(e, ...t) {
+			i("modal-event", e, ...t);
+		}
+		t({
+			emit: g,
+			afterLeave: () => o.value?.afterLeave(),
+			close: () => o.value?.close(),
+			reload: (...e) => o.value?.reload(...e),
+			setOpen: (e) => o.value?.setOpen(e),
+			getChildModal: () => o.value?.getChildModal(),
+			getParentModal: () => o.value?.getParentModal(),
+			get config() {
+				return o.value?.config;
+			},
+			get id() {
+				return o.value?.id;
+			},
+			get index() {
+				return o.value?.index;
+			},
+			get isOpen() {
+				return o.value?.isOpen;
+			},
+			get modalContext() {
+				return o.value;
+			},
+			get onTopOfStack() {
+				return o.value?.onTopOfStack;
+			},
+			get shouldRender() {
+				return o.value?.shouldRender;
+			}
+		}), L(() => o.value?.onTopOfStack, (e, t) => {
+			e && !t ? i("focus") : !e && t && i("blur");
+		}), L(() => o.value?.isOpen, (e, t) => {
+			e ? i("success") : t === !0 && i("close");
+		}, { immediate: !0 });
+		let _ = d(() => {
+			let e = o.value;
+			return e ? a.stack.value.find((t) => t.shouldRender && t.index > e.index)?.index : void 0;
+		});
+		return (e, t) => (k(), m(l, null, [I(o)?.shouldRender ? P(e.$slots, "default", w(I(o).props, {
+			id: I(o).id,
+			afterLeave: I(o).afterLeave,
+			close: I(o).close,
+			config: s.value,
+			emit: g,
+			getChildModal: I(o).getChildModal,
+			getParentModal: I(o).getParentModal,
+			index: I(o).index,
+			isOpen: I(o).isOpen,
+			modalContext: I(o),
+			onTopOfStack: I(o).onTopOfStack,
+			reload: I(o).reload,
+			setOpen: I(o).setOpen,
+			shouldRender: I(o).shouldRender
+		}), void 0, void 0, 0) : p("", !0), _.value ? (k(), f(We, {
+			key: 1,
+			index: _.value
+		}, null, 8, ["index"])) : p("", !0)], 64));
+	}
+}), Xe = Symbol("inertia-modal-request-close"), Ze = /* @__PURE__ */ y({
+	__name: "CloseButton",
+	setup(e) {
+		let t = S(Xe), { t: n } = me();
+		return (e, r) => (k(), f(I(be), {
+			class: "im-close-button",
+			icon: "$close",
+			variant: "text",
+			size: "small",
+			"aria-label": I(n)("$vuetify.close"),
+			onClick: r[0] ||= (e) => I(t)?.()
+		}, null, 8, ["aria-label"]));
+	}
+});
+// src/transitions.ts
+function Qe(e) {
+	let t = () => o() ? { opacity: 0 } : { transform: e };
+	return {
+		component: u,
+		css: !1,
+		onEnter: (e, n) => $e(e, [t(), {}], 225, "cubic-bezier(0, 0, 0.2, 1)", n),
+		onLeave: (e, n) => $e(e, [{}, t()], 195, "cubic-bezier(0.4, 0, 1, 1)", n)
+	};
+}
+function $e(e, t, n, r, i) {
+	if (!e.animate) return i();
+	e.animate(t, {
+		duration: n,
+		easing: r
+	}).finished.then(() => i(), () => i());
+}
+// src/ModalContent.vue?vue&type=script&setup=true&lang.ts
+var et = ["id"], tt = {
+	key: 1,
+	class: "position-absolute top-0 pa-2",
+	style: {
+		"inset-inline-end": "0",
+		"z-index": "1"
+	}
+}, nt = /* @__PURE__ */ y({
+	__name: "ModalContent",
+	props: {
+		modalContext: {},
+		config: {},
+		title: {},
+		beforeClose: { type: Function },
+		dialogProps: {},
+		cardProps: {}
+	},
+	emits: ["after-leave"],
+	setup(e, { emit: t }) {
+		let n = e, r = t, a = ce();
+		A("modalContext", ie(n, "modalContext")), A(Xe, M), fe({}, "InertiaModal");
+		let { isRtl: o } = he(), s = pe(), c = se(), l = N(!1), u = le("dialog"), y = typeof document < "u" && document.activeElement !== document.body ? document.activeElement : null, b = d(() => n.config.slideover ? "slideover" : "modal"), x = d(() => !!n.title || !!a.title), S = d(() => n.config.closeButton !== !1), C = d(() => {
+			let e = n.config.fullscreen;
+			return e === "mobile" ? s.mobile.value : typeof e == "string" ? s.width.value < s.thresholds.value[e] : typeof e == "number" ? s.width.value < e : !!e;
+		}), ee = d(() => {
+			let { maxWidth: e, position: t, slideover: r } = n.config, i = [`im-${b.value}-dialog`, { [`im-slideover-${t}`]: r && t !== "right" }];
+			if (!r) return C.value ? {
+				fullscreen: !0,
+				transition: "dialog-bottom-transition",
+				contentClass: i
+			} : {
+				location: Ee(t),
+				maxWidth: J(e),
+				target: y ?? void 0,
+				contentClass: i
+			};
+			if (t === "bottom") return {
+				location: "bottom",
+				width: "100%",
+				maxWidth: J(e),
+				fullscreen: C.value,
+				contentClass: i,
+				transition: Qe("translateY(100%)")
+			};
+			let a = t === "left";
+			return {
+				location: a === o.value ? "right" : "left",
+				width: "100%",
+				maxWidth: J(e),
+				height: "100%",
+				maxHeight: "100%",
+				fullscreen: C.value,
+				contentClass: i,
+				transition: Qe(`translateX(${a ? "-100%" : "100%"})`)
+			};
+		}), T = d(() => n.modalContext.onTopOfStack ? n.dialogProps?.scrim : !1), O = d(() => ({
+			margin: n.config.slideover && !C.value ? 0 : void 0,
+			filter: n.modalContext.onTopOfStack ? void 0 : "blur(4px)",
+			transition: "filter 0.3s"
+		})), j = !1;
+		async function M() {
+			if (!j) {
+				j = !0;
+				try {
+					await n.beforeClose?.() === !1 ? u.value?.animateClick() : n.modalContext.close();
+				} finally {
+					j = !1;
+				}
+			}
+		}
+		let F = "close";
+		function ae() {
+			n.modalContext.onTopOfStack ? !n.config.closeExplicitly && n.config.closeOnClickOutside === !1 && (F = "refuse") : F = "ignore";
+		}
+		function oe(e) {
+			let t = F;
+			F = "close", !(e || t === "ignore") && (t === "refuse" ? u.value?.animateClick() : M());
+		}
+		function z() {
+			r("after-leave"), n.modalContext.afterLeave();
+		}
+		let B = null;
+		function V(e) {
+			let t = K("appElement");
+			e ? typeof t == "string" && (B ??= i(t)) : (l.value = !1, B?.(), B = null, y?.focus({ preventScroll: !0 }));
+		}
+		return D(() => L(() => n.modalContext.isOpen, V, {
+			immediate: !0,
+			flush: "post"
+		})), E(() => V(!1)), (t, n) => (k(), f(I(ye), w({
+			ref_key: "dialog",
+			ref: u
+		}, {
+			...ee.value,
+			...e.dialogProps
+		}, {
+			"model-value": e.modalContext.isOpen,
+			persistent: e.config.closeExplicitly && e.modalContext.onTopOfStack || void 0,
+			scrim: T.value,
+			"close-on-back": !1,
+			"content-props": { style: O.value },
+			"aria-labelledby": x.value ? I(c) : void 0,
+			"aria-hidden": !e.modalContext.onTopOfStack || void 0,
+			"data-inertiaui-modal-id": e.modalContext.id,
+			"data-inertiaui-modal-index": e.modalContext.index,
+			"onClick:outside": ae,
+			"onUpdate:modelValue": oe,
+			onAfterEnter: n[0] ||= (e) => l.value = !0,
+			onAfterLeave: z
+		}), {
+			default: R(() => [v(I(ge), w({
+				class: `im-${b.value}-wrapper`,
+				rounded: e.config.slideover ? 0 : void 0,
+				"data-inertiaui-modal-entered": l.value
+			}, e.cardProps), {
+				default: R(() => [
+					x.value ? (k(), f(I(ve), {
+						key: 0,
+						class: te(`im-${b.value}-title`)
+					}, g({
+						title: R(() => [h("span", { id: I(c) }, [P(t.$slots, "title", { requestClose: M }, () => [_(re(e.title), 1)])], 8, et)]),
+						_: 2
+					}, [S.value ? {
+						name: "append",
+						fn: R(() => [v(Ze)]),
+						key: "0"
+					} : void 0]), 1032, ["class"])) : S.value ? (k(), m("div", tt, [v(Ze)])) : p("", !0),
+					h("div", {
+						class: te([
+							`im-${b.value}-content`,
+							e.config.paddingClasses,
+							e.config.panelClasses
+						]),
+						style: ne({
+							flex: "1 1 auto",
+							minHeight: 0,
+							overflowY: "auto",
+							paddingTop: x.value ? 0 : void 0
+						})
+					}, [P(t.$slots, "default", { requestClose: M })], 6),
+					a.actions ? (k(), f(I(_e), {
+						key: 2,
+						class: te(`im-${b.value}-actions`)
+					}, {
+						default: R(() => [P(t.$slots, "actions", { requestClose: M })]),
+						_: 3
+					}, 8, ["class"])) : p("", !0)
+				]),
+				_: 3
+			}, 16, [
+				"class",
+				"rounded",
+				"data-inertiaui-modal-entered"
+			])]),
+			_: 3
+		}, 16, [
+			"model-value",
+			"persistent",
+			"scrim",
+			"content-props",
+			"aria-labelledby",
+			"aria-hidden",
+			"data-inertiaui-modal-id",
+			"data-inertiaui-modal-index"
+		]));
+	}
+}), rt = /* @__PURE__ */ y({
+	__name: "Modal",
+	props: {
+		name: String,
+		slideover: {
+			type: Boolean,
+			default: null
+		},
+		closeButton: {
+			type: Boolean,
+			default: null
+		},
+		closeExplicitly: {
+			type: Boolean,
+			default: null
+		},
+		closeOnClickOutside: {
+			type: Boolean,
+			default: null
+		},
+		maxWidth: {
+			type: String,
+			default: null
+		},
+		paddingClasses: {
+			type: [Boolean, String],
+			default: null
+		},
+		panelClasses: {
+			type: [Boolean, String],
+			default: null
+		},
+		position: {
+			type: String,
+			default: null
+		},
+		title: String,
+		fullscreen: {
+			type: [
+				Boolean,
+				String,
+				Number
+			],
+			default: null
+		},
+		beforeClose: Function,
+		dialogProps: Object,
+		cardProps: Object
+	},
+	emits: [
+		"after-leave",
+		"blur",
+		"close",
+		"focus",
+		"success"
+	],
+	setup(e, { expose: t, emit: n }) {
+		let r = e, i = n, a = d(() => ({
+			name: r.name,
+			slideover: r.slideover,
+			closeButton: r.closeButton,
+			closeExplicitly: r.closeExplicitly,
+			closeOnClickOutside: r.closeOnClickOutside,
+			maxWidth: r.maxWidth,
+			paddingClasses: r.paddingClasses,
+			panelClasses: r.panelClasses,
+			position: r.position,
+			fullscreen: r.fullscreen
+		})), o = le("modal");
+		return t({
+			afterLeave: () => o.value?.afterLeave(),
+			close: () => o.value?.close(),
+			emit: (e, ...t) => o.value?.emit(e, ...t),
+			getChildModal: () => o.value?.getChildModal(),
+			getParentModal: () => o.value?.getParentModal(),
+			reload: (e) => o.value?.reload(e),
+			setOpen: (e) => o.value?.setOpen(e),
+			get config() {
+				return o.value?.config;
+			},
+			get id() {
+				return o.value?.id;
+			},
+			get index() {
+				return o.value?.index;
+			},
+			get isOpen() {
+				return o.value?.isOpen;
+			},
+			get modalContext() {
+				return o.value?.modalContext;
+			},
+			get onTopOfStack() {
+				return o.value?.onTopOfStack;
+			},
+			get shouldRender() {
+				return o.value?.shouldRender;
+			}
+		}), (t, n) => (k(), f(Ye, w({
+			ref_key: "modal",
+			ref: o
+		}, a.value, {
+			onSuccess: n[1] ||= (e) => i("success"),
+			onClose: n[2] ||= (e) => i("close"),
+			onFocus: n[3] ||= (e) => i("focus"),
+			onBlur: n[4] ||= (e) => i("blur")
+		}), {
+			default: R((r) => [(k(), f(nt, {
+				key: r.id,
+				"modal-context": r.modalContext,
+				config: r.config,
+				title: e.title,
+				"before-close": e.beforeClose,
+				"dialog-props": e.dialogProps,
+				"card-props": e.cardProps,
+				onAfterLeave: n[0] ||= (e) => i("after-leave")
+			}, g({
+				default: R(({ requestClose: e }) => [P(t.$slots, "default", T(b({
+					...r,
+					requestClose: e
+				})))]),
+				_: 2
+			}, [t.$slots.title ? {
+				name: "title",
+				fn: R(({ requestClose: e }) => [P(t.$slots, "title", T(b({
+					...r,
+					requestClose: e
+				})))]),
+				key: "0"
+			} : void 0, t.$slots.actions ? {
+				name: "actions",
+				fn: R(({ requestClose: e }) => [P(t.$slots, "actions", T(b({
+					...r,
+					requestClose: e
+				})))]),
+				key: "1"
+			} : void 0]), 1032, [
+				"modal-context",
+				"config",
+				"title",
+				"before-close",
+				"dialog-props",
+				"card-props"
+			]))]),
+			_: 3
+		}, 16));
+	}
+}), it = /* @__PURE__ */ y({
+	inheritAttrs: !1,
+	__name: "ModalLink",
+	props: {
+		href: {
+			type: String,
+			required: !0
+		},
+		method: {
+			type: String,
+			default: "get"
+		},
+		data: {
+			type: Object,
+			default: () => ({})
+		},
+		as: {
+			type: [String, Object],
+			default: "a"
+		},
+		headers: {
+			type: Object,
+			default: () => ({})
+		},
+		queryStringArrayFormat: {
+			type: String,
+			default: "brackets"
+		},
+		navigate: {
+			type: Boolean,
+			default: null
+		},
+		prefetch: {
+			type: [
+				Boolean,
+				String,
+				Array
+			],
+			default: !1
+		},
+		cacheFor: {
+			type: Number,
+			default: 3e4
+		},
+		closeButton: {
+			type: Boolean,
+			default: null
+		},
+		closeExplicitly: {
+			type: Boolean,
+			default: null
+		},
+		closeOnClickOutside: {
+			type: Boolean,
+			default: null
+		},
+		maxWidth: {
+			type: String,
+			default: null
+		},
+		paddingClasses: {
+			type: [Boolean, String],
+			default: null
+		},
+		panelClasses: {
+			type: [Boolean, String],
+			default: null
+		},
+		position: {
+			type: String,
+			default: null
+		},
+		slideover: {
+			type: Boolean,
+			default: null
+		},
+		fullscreen: {
+			type: [
+				Boolean,
+				String,
+				Number
+			],
+			default: null
+		}
+	},
+	emits: [
+		"after-leave",
+		"blur",
+		"close",
+		"error",
+		"focus",
+		"start",
+		"success",
+		"prefetching",
+		"prefetched"
+	],
+	setup(e, { emit: t }) {
+		let n = e, r = t, i = N(!1), o = $(), c = N(null);
+		A("modalContext", c);
+		let l = d(() => n.navigate ?? K("navigate")), u = d(() => n.prefetch === !0 ? ["hover"] : n.prefetch === !1 ? [] : [n.prefetch].flat());
+		function p() {
+			ke(n.href, {
+				method: n.method,
+				data: n.data,
+				headers: n.headers,
+				queryStringArrayFormat: n.queryStringArrayFormat,
+				cacheFor: n.cacheFor,
+				onPrefetching: () => r("prefetching"),
+				onPrefetched: () => r("prefetched")
+			});
+		}
+		let m;
+		function h() {
+			u.value.includes("hover") && (m = setTimeout(p, 75));
+		}
+		function g() {
+			clearTimeout(m);
+		}
+		function _(e) {
+			u.value.includes("click") && e.button === 0 && p();
+		}
+		D(() => {
+			u.value.includes("mount") && p();
+		});
+		let v = !1;
+		L(() => c.value?.onTopOfStack, (e) => {
+			c.value && (e && v ? r("focus") : e || r("blur"), v = !e);
+		});
+		let y = oe(), b;
+		E(() => {
+			b?.(), clearTimeout(m);
+		}), L(c, (e, t) => {
+			e && !t && (b = e.registerEventListenersFromAttrs(y), r("success"));
+		});
+		function x() {
+			c.value = null, r("after-leave");
+		}
+		function S(e) {
+			(e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) && e.currentTarget instanceof HTMLAnchorElement || (e.preventDefault(), !i.value && (n.href.startsWith("#") || (i.value = !0, r("start")), o.visit(n.href, n.method, n.data, n.headers, s(a(n, Ue)), () => r("close"), x, n.queryStringArrayFormat, l.value).then((e) => c.value = j(e)).catch((e) => {
+				console.error(e), r("error", e);
+			}).finally(() => i.value = !1)));
+		}
+		return (t, n) => (k(), f(F(e.as), w(t.$attrs, {
+			href: e.href,
+			onClick: S,
+			onMouseenter: h,
+			onMouseleave: g,
+			onMousedown: _
+		}), {
+			default: R(() => [P(t.$slots, "default", { loading: i.value })]),
+			_: 3
+		}, 16, ["href"]));
+	}
+}), at = /* @__PURE__ */ y({
+	inheritAttrs: !1,
+	__name: "ModalBtn",
+	props: { href: {} },
+	setup(e) {
+		let t = N(!1);
+		return (n, r) => (k(), f(it, w(n.$attrs, {
+			as: I(be),
+			href: e.href,
+			loading: t.value,
+			onStart: r[0] ||= (e) => t.value = !0,
+			onSuccess: r[1] ||= (e) => t.value = !1,
+			onError: r[2] ||= (e) => t.value = !1
+		}), {
+			default: R((e) => [P(n.$slots, "default", T(b(e)))]),
+			_: 3
+		}, 16, [
+			"as",
+			"href",
+			"loading"
+		]));
+	}
+});
+// src/useModal.ts
+function ot() {
+	return ae(S("modalContext", null));
+}
+// src/WhenVisible.vue
+var st = /* @__PURE__ */ y({
+	__name: "WhenVisible",
+	props: {
+		data: {},
+		params: {},
+		buffer: { default: 0 },
+		as: { default: "div" },
+		always: { type: Boolean }
+	},
+	setup(e) {
+		let t = e, n = S("modalContext");
+		if (!n) throw Error("WhenVisible component must be used inside a Modal component");
+		let r = N(!1), i = le("root"), a = !1, o;
+		function s() {
+			if (t.data) return { only: [t.data].flat() };
+			if (!t.params) throw Error("You must provide either a `data` or `params` prop.");
+			return t.params;
+		}
+		return D(() => {
+			i.value && (o = new IntersectionObserver(([e]) => {
+				if (!e.isIntersecting || (t.always || o?.disconnect(), a)) return;
+				a = !0;
+				let i = s();
+				n.value?.reload({
+					...i,
+					onStart: () => {
+						a = !0, i.onStart?.();
+					},
+					onFinish: () => {
+						r.value = !0, a = !1, i.onFinish?.();
+					}
+				});
+			}, { rootMargin: `${t.buffer}px` }), o.observe(i.value));
+		}), O(() => o?.disconnect()), (t, n) => (k(), f(F(e.as), {
+			ref_key: "root",
+			ref: i
+		}, {
+			default: R(() => [r.value ? P(t.$slots, "default", {}, void 0, void 0, 0) : P(t.$slots, "fallback", {}, void 0, void 0, 1)]),
+			_: 3
+		}, 512));
+	}
+});
+export { Je as Deferred, Ye as HeadlessModal, rt as Modal, at as ModalBtn, je as ModalInstance, it as ModalLink, Ge as ModalRoot, st as WhenVisible, e as dialogUtils, K as getConfig, Ee as getDialogLocation, J as getMaxWidth, Ae as initFromPageProps, Ue as modalPropNames, ke as prefetch, we as putConfig, Ke as renderApp, Ce as resetConfig, ot as useModal, $ as useModalStack, Be as visitModal, qe as withInertiaModal };