@templatical/media-library 0.39.0 → 0.39.2

package/dist/templatical-media-library.js

@@ -1,68 +1,58 @@
-import { Fragment as e, Teleport as t, Transition as n, computed as r, createApp as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createTextVNode as l, createVNode as u, defineComponent as d, h as f, inject as p, isRef as m, normalizeClass as h, normalizeStyle as g, onMounted as _, openBlock as v, provide as y, ref as b, renderList as x, resolveComponent as S, toDisplayString as C, toRef as w, toValue as T, unref as E, vModelText as D, watch as O, withCtx as k, withDirectives as A, withKeys as j, withModifiers as M } from "vue";
-import { Check as N, ChevronRight as P, Copy as F, File as I, Folder as L, Grid2x2 as R, Link as z, List as B, LoaderCircle as V, PanelLeft as H, Pencil as U, Plus as W, RefreshCw as G, Search as ee, Star as K, Trash2 as te, Upload as q, X as ne } from "@lucide/vue";
-import { Cropper as re } from "vue-advanced-cropper";
-import { onClickOutside as J, useClipboard as Y, useDebounceFn as ie, useDropZone as ae, useEventListener as oe, useFileDialog as se, useIntersectionObserver as X } from "@vueuse/core";
-//#region \0rolldown/runtime.js
-var ce = Object.defineProperty, le = (e, t) => {
-	let n = {};
-	for (var r in e) ce(n, r, {
-		get: e[r],
-		enumerable: !0
-	});
-	return t || ce(n, Symbol.toStringTag, { value: "Module" }), n;
-};
-//#endregion
+import { a as e, c as t, i as n, l as r, n as i, o as a, r as o, s, t as c } from "./useFocusTrap-6eIRXtCA.js";
+import { Fragment as l, Teleport as u, Transition as d, computed as f, createApp as p, createBlock as m, createCommentVNode as h, createElementBlock as g, createElementVNode as _, createTextVNode as v, createVNode as y, defineAsyncComponent as b, defineComponent as x, h as S, inject as C, normalizeClass as w, normalizeStyle as T, onBeforeUnmount as E, openBlock as D, provide as O, ref as k, renderList as A, resolveComponent as j, toDisplayString as M, toRef as N, toValue as P, unref as F, vModelText as I, watch as L, withCtx as R, withDirectives as z, withKeys as B, withModifiers as V } from "vue";
+import { Check as H, ChevronRight as ee, Copy as te, File as U, Folder as W, Grid2x2 as G, Link as ne, List as re, LoaderCircle as K, PanelLeft as ie, Pencil as q, Plus as J, RefreshCw as Y, Search as ae, Star as oe, Trash2 as X, Upload as Z, X as se } from "@lucide/vue";
+import { onClickOutside as Q, useClipboard as ce, useDebounceFn as le, useDropZone as ue, useEventListener as de, useFileDialog as fe, useIntersectionObserver as pe } from "@vueuse/core";
 //#region src/composable.ts
-function ue(e) {
-	let { provider: t } = e, n = b([]), r = b([]), i = b(null), a = b("files"), o = b(""), s = b(null), c = b("newest"), l = b(!1), u = b(!1), d = b(!1), f = b(null), p = b(null), m = b(/* @__PURE__ */ new Set()), h = b(null), g = b([]), _ = b({}), v = b(!1), y = b([]), x = b(!1), S = b(null), C = b(!1), w = b(null), E = b(!1), D = b(null), O = b(null), k = b(null), A = 0;
-	function j(t) {
+function me(e) {
+	let { provider: t } = e, n = k([]), r = k([]), i = k(null), a = k("files"), o = k(""), s = k(null), c = k("newest"), l = k(!1), u = k(!1), d = k(!1), f = k(null), p = k(null), m = k(/* @__PURE__ */ new Set()), h = k(null), g = k([]), _ = k({}), v = k(!1), y = k([]), b = k(!1), x = k(null), S = k(!1), C = k(null), w = k(!1), T = k(null), E = k(null), D = k(null), O = 0;
+	function A(t) {
 		try {
 			t();
 		} catch (t) {
 			e.onError?.(t);
 		}
 	}
-	function M() {
+	function j() {
 		return t.folders === !1 ? null : t.folders;
 	}
-	function N() {
-		return T(e.templateId);
+	function M() {
+		return P(e.templateId);
 	}
-	function P(e) {
+	function N(e) {
 		let t = {};
 		o.value ? t.search = o.value : i.value != null && (t.folderId = i.value), s.value && (t.category = s.value), e && (t.cursor = e);
-		let n = N();
+		let n = M();
 		return n && (t.templateId = n), t;
 	}
 	async function F() {
-		let r = ++A;
+		let r = ++O;
 		l.value = !0;
-		let i = P();
+		let i = N();
 		try {
 			let e = await t.list(i);
-			if (r !== A) return;
+			if (r !== O) return;
 			n.value = e.items, f.value = e.nextCursor ?? null, d.value = !!e.nextCursor;
 		} catch (t) {
-			if (r !== A) return;
+			if (r !== O) return;
 			e.onError?.(t);
 		} finally {
-			r === A && (l.value = !1);
+			r === O && (l.value = !1);
 		}
 	}
 	async function I() {
 		if (!d.value || !f.value || l.value) return;
-		let r = ++A;
+		let r = ++O;
 		l.value = !0;
-		let i = P(f.value);
+		let i = N(f.value);
 		try {
 			let e = await t.list(i);
-			if (r !== A) return;
+			if (r !== O) return;
 			n.value = [...n.value, ...e.items], f.value = e.nextCursor ?? null, d.value = !!e.nextCursor;
 		} catch (t) {
-			if (r !== A) return;
+			if (r !== O) return;
 			e.onError?.(t);
 		} finally {
-			r === A && (l.value = !1);
+			r === O && (l.value = !1);
 		}
 	}
 	async function L(e) {
@@ -78,7 +68,7 @@ function ue(e) {
 		a.value = "files", i.value = e, o.value = "", m.value = /* @__PURE__ */ new Set(), h.value = null, await F();
 	}
 	async function V() {
-		a.value = "frequently-used", i.value = null, o.value = "", m.value = /* @__PURE__ */ new Set(), h.value = null, await q();
+		a.value = "frequently-used", i.value = null, o.value = "", m.value = /* @__PURE__ */ new Set(), h.value = null, await re();
 	}
 	async function H(r) {
 		let { create: a } = t;
@@ -87,17 +77,17 @@ function ue(e) {
 		try {
 			let e = { file: r };
 			i.value != null && (e.folderId = i.value);
-			let o = N();
+			let o = M();
 			o && (e.templateId = o);
 			let s = await a(e);
-			return n.value = [s, ...n.value], j(() => t.onCreated?.(s)), s;
+			return n.value = [s, ...n.value], A(() => t.onCreated?.(s)), s;
 		} catch (t) {
 			return e.onError?.(t), null;
 		} finally {
 			u.value = !1;
 		}
 	}
-	async function U(r) {
+	async function ee(r) {
 		let { create: a } = t;
 		if (typeof a == "function") {
 			u.value = !0, p.value = {
@@ -113,10 +103,10 @@ function ue(e) {
 					try {
 						let e = { file: r[o] };
 						i.value != null && (e.folderId = i.value);
-						let s = N();
+						let s = M();
 						s && (e.templateId = s);
 						let c = await a(e);
-						n.value = [c, ...n.value], j(() => t.onCreated?.(c));
+						n.value = [c, ...n.value], A(() => t.onCreated?.(c));
 					} catch (t) {
 						e.onError?.(t);
 					}
@@ -126,9 +116,9 @@ function ue(e) {
 			}
 		}
 	}
-	async function W(t) {
+	async function te(t) {
 		if (m.value.size === 0) return;
-		let { move: r } = M() ?? { move: !1 };
+		let { move: r } = j() ?? { move: !1 };
 		if (typeof r == "function") try {
 			let e = await r([...m.value], t);
 			if (i.value === null) {
@@ -140,39 +130,39 @@ function ue(e) {
 			e.onError?.(t);
 		}
 	}
-	async function G(r, i, a) {
+	async function U(r, i, a) {
 		let { update: o } = t;
 		if (typeof o == "function") try {
 			let e = { filename: i };
 			a !== void 0 && (e.alt = a);
 			let s = await o(r, e);
-			n.value = n.value.map((e) => e.id === r ? s : e), h.value?.id === r && (h.value = s), j(() => t.onUpdated?.(s));
+			n.value = n.value.map((e) => e.id === r ? s : e), h.value?.id === r && (h.value = s), A(() => t.onUpdated?.(s));
 		} catch (t) {
 			e.onError?.(t);
 		}
 	}
-	function ee(e) {
+	function W(e) {
 		let t = /* @__PURE__ */ new Map();
 		for (let r of n.value) e.includes(r.id) && t.set(r.id, r);
 		for (let n of g.value) e.includes(n.id) && !t.has(n.id) && t.set(n.id, n);
 		return [...t.values()];
 	}
-	function K(e) {
+	function G(e) {
 		n.value = n.value.filter((t) => !e.includes(t.id)), g.value = g.value.filter((t) => !e.includes(t.id)), m.value = /* @__PURE__ */ new Set(), h.value = null;
 	}
-	async function te() {
+	async function ne() {
 		if (m.value.size === 0) return;
 		let { delete: n } = t;
 		if (typeof n != "function") return;
-		let r = [...m.value], i = ee(r);
+		let r = [...m.value], i = W(r);
 		try {
-			await n(r), K(r);
-			for (let e of i) j(() => t.onDeleted?.(e));
+			await n(r), G(r);
+			for (let e of i) A(() => t.onDeleted?.(e));
 		} catch (t) {
 			e.onError?.(t);
 		}
 	}
-	async function q() {
+	async function re() {
 		let { frequentlyUsed: n } = t;
 		if (typeof n == "function") try {
 			g.value = await n();
@@ -180,7 +170,7 @@ function ue(e) {
 			e.onError?.(t);
 		}
 	}
-	async function ne() {
+	async function K() {
 		if (m.value.size === 0) return !1;
 		y.value = [...m.value];
 		let { checkUsage: n } = t;
@@ -194,34 +184,34 @@ function ue(e) {
 			return e.onError?.(t), !1;
 		}
 	}
-	async function re() {
+	async function ie() {
 		let { delete: n } = t;
 		if (typeof n != "function" || (v.value = !1, y.value.length === 0)) return;
-		let r = y.value, i = ee(r);
+		let r = y.value, i = W(r);
 		try {
-			await n(r), K(r), y.value = [], _.value = {};
-			for (let e of i) j(() => t.onDeleted?.(e));
+			await n(r), G(r), y.value = [], _.value = {};
+			for (let e of i) A(() => t.onDeleted?.(e));
 		} catch (t) {
 			e.onError?.(t);
 		}
 	}
-	function J() {
+	function q() {
 		v.value = !1, y.value = [], _.value = {};
 	}
-	async function Y(r) {
+	async function J(r) {
 		let a = t.importFromUrl;
 		if (typeof a != "function") return null;
-		x.value = !0, S.value = null;
+		b.value = !0, x.value = null;
 		try {
-			let e = await a(r, i.value, N());
-			return n.value = [e, ...n.value], j(() => t.onCreated?.(e)), e;
+			let e = await a(r, i.value, M());
+			return n.value = [e, ...n.value], A(() => t.onCreated?.(e)), e;
 		} catch (t) {
-			return S.value = t instanceof Error ? t.message : "Import failed", e.onError?.(t), null;
+			return x.value = t instanceof Error ? t.message : "Import failed", e.onError?.(t), null;
 		} finally {
-			x.value = !1;
+			b.value = !1;
 		}
 	}
-	function ie(e) {
+	function Y(e) {
 		let t = new Set(m.value);
 		t.has(e) ? t.delete(e) : t.add(e), m.value = t;
 	}
@@ -231,98 +221,98 @@ function ue(e) {
 	function oe(e) {
 		h.value = e, m.value = /* @__PURE__ */ new Set([e.id]);
 	}
-	async function se() {
+	async function X() {
 		let { storage: n } = t;
 		if (typeof n != "function") {
-			k.value = null;
+			D.value = null;
 			return;
 		}
 		try {
-			k.value = await n();
+			D.value = await n();
 		} catch (t) {
 			e.onError?.(t);
 		}
 	}
-	async function X() {
-		let t = M();
+	async function Z() {
+		let t = j();
 		if (t) try {
 			r.value = await t.list();
 		} catch (t) {
 			e.onError?.(t);
 		}
 	}
-	async function ce(t, n) {
-		let { create: r } = M() ?? { create: !1 };
+	async function se(t, n) {
+		let { create: r } = j() ?? { create: !1 };
 		if (typeof r != "function") return null;
 		try {
 			let e = { name: t };
 			n !== void 0 && (e.parentId = n);
 			let i = await r(e);
-			return await X(), i;
+			return await Z(), i;
 		} catch (t) {
 			return e.onError?.(t), null;
 		}
 	}
-	function le(e, t) {
+	function Q(e, t) {
 		for (let n of e) if (n.id === t) return n;
 		return null;
 	}
-	async function ue(t, n) {
-		let { update: r } = M() ?? { update: !1 };
+	async function ce(t, n) {
+		let { update: r } = j() ?? { update: !1 };
 		if (typeof r == "function") try {
-			await r(t, { name: n }), await X();
+			await r(t, { name: n }), await Z();
 		} catch (t) {
 			e.onError?.(t);
 		}
 	}
-	async function de(t) {
-		let { delete: n } = M() ?? { delete: !1 };
+	async function le(t) {
+		let { delete: n } = j() ?? { delete: !1 };
 		if (typeof n == "function") try {
-			let e = le(r.value, t)?.parentId ?? null;
-			await n(t), i.value === t && (i.value = e), await X(), await F();
+			let e = Q(r.value, t)?.parentId ?? null;
+			await n(t), i.value === t && (i.value = e), await Z(), await F();
 		} catch (t) {
 			e.onError?.(t);
 		}
 	}
-	async function fe(n) {
-		D.value = n, w.value = null;
+	async function ue(n) {
+		T.value = n, C.value = null;
 		let { checkUsage: r } = t;
 		if (typeof r != "function") {
-			O.value = null, E.value = !0;
+			E.value = null, w.value = !0;
 			return;
 		}
 		try {
 			let e = await r([n.id]);
-			O.value = e[n.id] ?? null, E.value = !0;
+			E.value = e[n.id] ?? null, w.value = !0;
 		} catch (t) {
 			e.onError?.(t);
 		}
 	}
-	function pe() {
-		E.value = !1, D.value = null, O.value = null, w.value = null;
+	function de() {
+		w.value = !1, T.value = null, E.value = null, C.value = null;
 	}
-	function Z(e) {
-		n.value = n.value.map((t) => t.id === e.id ? e : t), g.value = g.value.map((t) => t.id === e.id ? e : t), h.value?.id === e.id && (h.value = e), j(() => t.onUpdated?.(e));
+	function fe(e) {
+		n.value = n.value.map((t) => t.id === e.id ? e : t), g.value = g.value.map((t) => t.id === e.id ? e : t), h.value?.id === e.id && (h.value = e), A(() => t.onUpdated?.(e));
 	}
-	async function me(n) {
+	async function pe(n) {
 		let { replace: r } = t;
-		if (typeof r != "function" || !D.value) return null;
-		C.value = !0, w.value = null;
+		if (typeof r != "function" || !T.value) return null;
+		S.value = !0, C.value = null;
 		try {
-			let e = await r(D.value.id, n);
-			return Z(e), E.value = !1, D.value = null, O.value = null, e;
+			let e = await r(T.value.id, n);
+			return fe(e), w.value = !1, T.value = null, E.value = null, e;
 		} catch (t) {
-			return w.value = t instanceof Error ? t.message : "Replace failed", e.onError?.(t), null;
+			return C.value = t instanceof Error ? t.message : "Replace failed", e.onError?.(t), null;
 		} finally {
-			C.value = !1;
+			S.value = !1;
 		}
 	}
-	async function he(n, r) {
+	async function me(n, r) {
 		let { replace: i } = t;
 		if (typeof i != "function") return null;
 		try {
 			let e = await i(n, r);
-			return Z(e), e;
+			return fe(e), e;
 		} catch (t) {
 			return e.onError?.(t), null;
 		}
@@ -352,523 +342,88 @@ function ue(e) {
 		navigateToFolder: B,
 		showFrequentlyUsed: V,
 		uploadFile: H,
-		uploadFiles: U,
-		moveSelected: W,
-		updateFile: G,
-		deleteSelected: te,
-		isImportingFromUrl: x,
-		importFromUrlError: S,
-		importFromUrl: Y,
-		toggleSelection: ie,
+		uploadFiles: ee,
+		moveSelected: te,
+		updateFile: U,
+		deleteSelected: ne,
+		isImportingFromUrl: b,
+		importFromUrlError: x,
+		importFromUrl: J,
+		toggleSelection: Y,
 		clearSelection: ae,
 		selectItem: oe,
-		loadFolders: X,
-		createFolder: ce,
-		renameFolder: ue,
-		deleteFolder: de,
-		findFolderInTree: le,
-		loadFrequentlyUsed: q,
-		checkUsageBeforeDelete: ne,
-		confirmDelete: re,
-		cancelDelete: J,
-		isReplacing: C,
-		replaceError: w,
-		showReplaceWarning: E,
-		pendingReplaceItem: D,
-		replaceUsageInfo: O,
-		checkUsageBeforeReplace: fe,
-		cancelReplace: pe,
-		replaceFile: me,
-		replaceMediaDirectly: he,
-		storageInfo: k,
-		loadStorage: se
-	};
-}
-//#endregion
-//#region src/keys.ts
-var de = Symbol("templaticalMediaLimits"), fe = Symbol("templaticalMediaPopoverTarget"), pe = Symbol("templaticalMediaTranslations"), Z = Symbol("templaticalMediaUiTheme"), me = Symbol("templaticalMediaUiLocale"), he = /* @__PURE__ */ le({ default: () => ge }), ge = { mediaLibrary: {
-	title: "Media Library",
-	searchPlaceholder: "Search files...",
-	allFiles: "All Files",
-	filterAll: "All Types",
-	filterImages: "Images",
-	filterDocuments: "Documents",
-	filterVideos: "Videos",
-	filterAudio: "Audio",
-	newFolder: "New Folder",
-	folderName: "Folder name",
-	noFiles: "No files found",
-	noSearchResults: "No files match your search",
-	dropOrClick: "Drop files here or click to upload",
-	acceptedFormats: "Images, PDF, Video, Audio, Documents (max 10MB)",
-	uploading: "Uploading...",
-	uploadingProgress: "Uploading {current} of {total}...",
-	selectImage: "Select Image",
-	selectFile: "Select File",
-	deleteSelected: "Delete",
-	copyUrl: "Copy URL",
-	copied: "Copied!",
-	browseMedia: "Browse Media Library",
-	renameFolder: "Rename folder",
-	addSubfolder: "Add subfolder",
-	subfolderName: "Subfolder name",
-	sortNewest: "Newest First",
-	sortOldest: "Oldest First",
-	sortNameAsc: "Name A-Z",
-	sortNameDesc: "Name Z-A",
-	sortSizeAsc: "Smallest First",
-	sortSizeDesc: "Largest First",
-	moveSelected: "Move",
-	moveToRoot: "All Files",
-	currentFolder: "(current)",
-	confirmDelete: "Confirm?",
-	renameFile: "Rename",
-	editFile: "Edit File",
-	fileName: "Filename",
-	altText: "Alt Text",
-	altTextPlaceholder: "Describe this image for accessibility",
-	saveChanges: "Save",
-	cancel: "Cancel",
-	frequentlyUsed: "Frequently Used",
-	deleteWarningTitle: "Delete File",
-	deleteWarningMessage: "Are you sure? This action is irreversible.",
-	deleteWarningUsageNote: "The following files are used in templates. Deleting them may break those templates.",
-	deleteAnyway: "Delete",
-	usedInTemplates: "Used in {count} template(s)",
-	viewGrid: "Grid view",
-	viewList: "List view",
-	showFolders: "Show folders",
-	hideFolders: "Hide folders",
-	importFromUrl: "Import from URL",
-	importUrlPlaceholder: "https://example.com/image.jpg",
-	import: "Import",
-	importing: "Importing...",
-	importError: "Failed to import from URL",
-	replaceFile: "Replace File",
-	replaceWarningTitle: "Replace File",
-	replaceWarningMessage: "You are about to replace this file. The replacement must have the same file extension ({extension}).",
-	replaceWarningUsageNote: "This file is used in {count} template(s). Replacing it will update all references.",
-	replaceSelectFile: "Select replacement file",
-	replace: "Replace",
-	replacing: "Replacing...",
-	replaceError: "Failed to replace file",
-	saving: "Saving...",
-	cropAspectRatio: "Aspect Ratio",
-	cropFree: "Free",
-	cropSquare: "1:1",
-	cropLandscape43: "4:3",
-	cropLandscape169: "16:9",
-	cropOriginal: "Original",
-	cropMaxWidth: "Max Width",
-	cropMaxHeight: "Max Height",
-	cropOutputSize: "Output Size",
-	cropPixels: "px",
-	cropOptional: "(optional)",
-	storageTooltip: "{used} of {total} used ({remaining} remaining)"
-} };
-//#endregion
-//#region src/composables/useI18n.ts
-function Q(e) {
-	let t = e ?? p(pe, null), n = (m(t) ? t.value : t) ?? ge;
-	function r(e, t) {
-		return e.replace(/\{(\w+)\}/g, (e, n) => n in t ? String(t[n]) : `{${n}}`);
-	}
-	return {
-		t: n,
-		format: r
+		loadFolders: Z,
+		createFolder: se,
+		renameFolder: ce,
+		deleteFolder: le,
+		findFolderInTree: Q,
+		loadFrequentlyUsed: re,
+		checkUsageBeforeDelete: K,
+		confirmDelete: ie,
+		cancelDelete: q,
+		isReplacing: S,
+		replaceError: C,
+		showReplaceWarning: w,
+		pendingReplaceItem: T,
+		replaceUsageInfo: E,
+		checkUsageBeforeReplace: ue,
+		cancelReplace: de,
+		replaceFile: pe,
+		replaceMediaDirectly: me,
+		storageInfo: D,
+		loadStorage: X
 	};
 }
 //#endregion
 //#region src/components/media/MediaBreadcrumb.vue?vue&type=script&setup=true&lang.ts
-var _e = {
+var he = {
 	key: 0,
 	class: "tpl:flex tpl:items-center tpl:gap-1 tpl:text-xs",
 	style: { color: "var(--tpl-text-muted)" }
-}, ve = ["onClick"], ye = {
+}, ge = ["onClick"], _e = {
 	key: 1,
 	style: { color: "var(--tpl-text)" }
-}, be = /* @__PURE__ */ d({
+}, ve = /* @__PURE__ */ x({
 	__name: "MediaBreadcrumb",
 	props: {
 		folders: {},
 		currentFolderId: {}
 	},
 	emits: ["navigate"],
-	setup(t, { emit: n }) {
-		let i = t, a = n, { t: l } = Q(), d = r(() => {
-			if (!i.currentFolderId) return [];
+	setup(e, { emit: t }) {
+		let r = e, i = t, { t: a } = n(), o = f(() => {
+			if (!r.currentFolderId) return [];
 			let e = [];
-			return f(i.folders, i.currentFolderId, e), e;
+			return s(r.folders, r.currentFolderId, e), e;
 		});
-		function f(e, t, n) {
+		function s(e, t, n) {
 			for (let r of e) {
 				if (r.id === t) return n.push(r), !0;
-				if (f(r.children, t, n)) return n.unshift(r), !0;
+				if (s(r.children, t, n)) return n.unshift(r), !0;
 			}
 			return !1;
 		}
-		return (t, n) => d.value.length > 0 ? (v(), s("div", _e, [c("button", {
+		return (e, t) => o.value.length > 0 ? (D(), g("div", he, [_("button", {
 			class: "tpl:transition-colors tpl:duration-150 tpl:hover:underline",
 			style: { color: "var(--tpl-primary)" },
-			onClick: n[0] ||= (e) => a("navigate", null)
-		}, C(E(l).mediaLibrary.allFiles), 1), (v(!0), s(e, null, x(d.value, (t, n) => (v(), s(e, { key: t.id }, [u(E(P), {
+			onClick: t[0] ||= (e) => i("navigate", null)
+		}, M(F(a).mediaLibrary.allFiles), 1), (D(!0), g(l, null, A(o.value, (e, t) => (D(), g(l, { key: e.id }, [y(F(ee), {
 			size: 12,
 			"stroke-width": 2
-		}), n < d.value.length - 1 ? (v(), s("button", {
+		}), t < o.value.length - 1 ? (D(), g("button", {
 			key: 0,
 			class: "tpl:transition-colors tpl:duration-150 tpl:hover:underline",
 			style: { color: "var(--tpl-primary)" },
-			onClick: (e) => a("navigate", t.id)
-		}, C(t.name), 9, ve)) : (v(), s("span", ye, C(t.name), 1))], 64))), 128))])) : o("", !0);
-	}
-}), xe = [
-	"images",
-	"documents",
-	"videos",
-	"audio"
-];
-function $(e) {
-	let t = e ?? p(de, null);
-	if (!t) throw Error("[Templatical] useMediaCategories() needs media limits in scope. Render it under <MediaLibraryModal> or provide MEDIA_LIMITS_KEY yourself.");
-	let n = t, i = r(() => !0), a = r(() => n.maxFileSize ?? Infinity), o = r(() => {
-		let e = n.accept;
-		if (e && e.length > 0) return e;
-		let t = n.mimeTypes;
-		return t ? Object.keys(t) : xe;
-	}), s = r(() => {
-		let e = n.mimeTypes;
-		return e ? o.value.flatMap((t) => e[t] ?? []) : [];
-	}), c = r(() => s.value.join(","));
-	function l(e, t) {
-		let r = n.mimeTypes;
-		return !r || (t && t.length > 0 ? t : Object.keys(r)).some((t) => r[t]?.includes(e) ?? !1);
-	}
-	function u(e) {
-		return l(e.type) && e.size <= a.value;
-	}
-	function d(e) {
-		let t = n.mimeTypes;
-		return t ? t.images?.includes(e) ?? !1 : e.startsWith("image/");
-	}
-	function f(e) {
-		let t = n.mimeTypes;
-		if (!t) return null;
-		for (let [n, r] of Object.entries(t)) if (r?.includes(e)) return n;
-		return null;
-	}
-	return {
-		isMediaLibraryEnabled: i,
-		allAcceptedMimeTypes: s,
-		allAcceptedInputString: c,
-		maxFileSize: a,
-		availableCategories: o,
-		isAcceptedMimeType: l,
-		isAcceptedFile: u,
-		isImageMimeType: d,
-		getCategoryForMimeType: f
-	};
-}
-//#endregion
-//#region src/composables/useImageCrop.ts
-var Se = {
-	free: void 0,
-	square: 1,
-	landscape43: 4 / 3,
-	landscape169: 16 / 9,
-	original: void 0
-};
-function Ce(e) {
-	return e === "image/png" || e === "image/gif" ? {
-		mimeType: "image/png",
-		quality: 1
-	} : e === "image/webp" ? {
-		mimeType: "image/webp",
-		quality: .92
-	} : {
-		mimeType: "image/jpeg",
-		quality: .92
-	};
-}
-function we(e, t, n) {
-	let r = e.width, i = e.height;
-	if (!t && !n) return e;
-	let a = r, o = i;
-	if (t && r > t && (a = t, o = Math.round(t / r * i)), n && o > n) {
-		let e = n / o;
-		a = Math.round(a * e), o = n;
-	}
-	if (a === r && o === i) return e;
-	let s = document.createElement("canvas");
-	s.width = a, s.height = o;
-	let c = s.getContext("2d");
-	return c && (c.imageSmoothingEnabled = !0, c.imageSmoothingQuality = "high", c.drawImage(e, 0, 0, a, o)), s;
-}
-function Te(e, t, n) {
-	return new Promise((r, i) => {
-		e.toBlob((e) => {
-			if (!e) {
-				i(/* @__PURE__ */ Error("Failed to create blob from canvas"));
-				return;
-			}
-			let a = n.mimeType.split("/")[1], o = `${t.replace(/\.[^.]+$/, "")}.${a}`;
-			r(new File([e], o, { type: n.mimeType }));
-		}, n.mimeType, n.quality);
-	});
-}
-function Ee(e, t, n, r) {
-	let i = e, a = t;
-	if (n && i > n) {
-		let e = n / i;
-		i = n, a = Math.round(a * e);
+			onClick: (t) => i("navigate", e.id)
+		}, M(e.name), 9, ge)) : (D(), g("span", _e, M(e.name), 1))], 64))), 128))])) : h("", !0);
 	}
-	if (r && a > r) {
-		let e = r / a;
-		a = r, i = Math.round(i * e);
-	}
-	return {
-		width: i,
-		height: a
-	};
-}
-//#endregion
-//#region src/components/media/MediaEditModal.vue?vue&type=script&setup=true&lang.ts
-var De = ["data-tpl-theme"], Oe = { class: "tpl:shrink-0 tpl:p-5 tpl:pb-4" }, ke = {
-	class: "tpl:text-sm tpl:font-semibold",
-	style: { color: "var(--tpl-text)" }
-}, Ae = { class: "tpl:min-h-0 tpl:flex-1 tpl:overflow-y-auto tpl:px-5" }, je = {
-	key: 0,
-	class: "tpl:mb-4"
-}, Me = {
-	class: "tpl:relative tpl:mb-3 tpl:overflow-hidden tpl:rounded-md tpl:border",
-	style: {
-		"border-color": "var(--tpl-border)",
-		height: "300px",
-		"background-color": "var(--tpl-bg)"
-	}
-}, Ne = { class: "tpl:space-y-3" }, Pe = {
-	class: "tpl:mb-1.5 tpl:block tpl:text-xs tpl:font-medium",
-	style: { color: "var(--tpl-text-muted)" }
-}, Fe = { class: "tpl:flex tpl:flex-wrap tpl:gap-1.5" }, Ie = ["onClick"], Le = { class: "tpl:flex tpl:gap-3" }, Re = { class: "tpl:flex-1" }, ze = {
-	class: "tpl:mb-1 tpl:block tpl:text-xs tpl:font-medium",
-	style: { color: "var(--tpl-text-muted)" }
-}, Be = {
-	class: "tpl:font-normal",
-	style: { color: "var(--tpl-text-dim)" }
-}, Ve = { class: "tpl:relative" }, He = ["value", "placeholder"], Ue = {
-	class: "tpl:absolute tpl:top-1/2 tpl:right-2.5 tpl:-translate-y-1/2 tpl:text-xs",
-	style: { color: "var(--tpl-text-dim)" }
-}, We = { class: "tpl:flex-1" }, Ge = {
-	class: "tpl:mb-1 tpl:block tpl:text-xs tpl:font-medium",
-	style: { color: "var(--tpl-text-muted)" }
-}, Ke = {
-	class: "tpl:font-normal",
-	style: { color: "var(--tpl-text-dim)" }
-}, qe = { class: "tpl:relative" }, Je = ["value", "placeholder"], Ye = {
-	class: "tpl:absolute tpl:top-1/2 tpl:right-2.5 tpl:-translate-y-1/2 tpl:text-xs",
-	style: { color: "var(--tpl-text-dim)" }
-}, Xe = {
-	key: 0,
-	class: "tpl:flex tpl:items-center tpl:gap-1 tpl:text-xs",
-	style: { color: "var(--tpl-text-muted)" }
-}, Ze = {
-	class: "tpl:font-medium",
-	style: { color: "var(--tpl-text)" }
-}, Qe = { class: "tpl:mb-3" }, $e = {
-	class: "tpl:mb-1 tpl:block tpl:text-xs tpl:font-medium",
-	style: { color: "var(--tpl-text-muted)" }
-}, et = ["autofocus"], tt = {
-	key: 1,
-	class: "tpl:mb-4"
-}, nt = {
-	class: "tpl:mb-1 tpl:block tpl:text-xs tpl:font-medium",
-	style: { color: "var(--tpl-text-muted)" }
-}, rt = ["placeholder"], it = { class: "tpl:flex tpl:shrink-0 tpl:justify-end tpl:gap-2 tpl:p-5 tpl:pt-4" }, at = ["disabled"], ot = /*@__PURE__*/ d({
-	__name: "MediaEditModal",
-	props: {
-		visible: { type: Boolean },
-		item: {}
-	},
-	emits: ["save", "close"],
-	setup(i, { emit: d }) {
-		let f = i, m = d, { t: _ } = Q(), y = p(Z, null), S = p(fe, b(null)), w = _.mediaLibrary, { isImageMimeType: T } = $(), j = b(""), N = b(""), P = b(null), F = b("free"), I = b(void 0), L = b(void 0), R = b(""), z = b(""), B = b(void 0), V = b(null), H = b(!1), U = b(!1), W = b(!1), G = r(() => f.item ? [
-			"image/jpeg",
-			"image/png",
-			"image/webp",
-			"image/gif"
-		].includes(f.item.mimeType ?? "") : !1), ee = r(() => F.value === "original" ? B.value : Se[F.value]), K = r(() => V.value ? Ee(V.value.width, V.value.height, I.value, L.value) : null);
-		O(() => f.visible, (e) => {
-			e && f.item && (j.value = f.item.filename ?? "", N.value = f.item.alt ?? "", F.value = "free", I.value = void 0, L.value = void 0, R.value = "", z.value = "", B.value = void 0, V.value = null, H.value = !1, W.value = !1, f.item.width && f.item.height && (B.value = f.item.width / f.item.height));
-		});
-		function te(e) {
-			e.coordinates && (V.value = {
-				width: Math.round(e.coordinates.width),
-				height: Math.round(e.coordinates.height)
-			}, W.value = !0);
-		}
-		function q() {
-			H.value = !0, !B.value && f.item?.width && f.item?.height && (B.value = f.item.width / f.item.height);
-		}
-		function ne(e) {
-			let t = e.target.value;
-			R.value = t, I.value = t && parseInt(t, 10) || void 0;
-		}
-		function J(e) {
-			let t = e.target.value;
-			z.value = t, L.value = t && parseInt(t, 10) || void 0;
-		}
-		async function Y() {
-			let e = j.value.trim();
-			if (!e || !f.item || U.value) return;
-			let t = T(f.item.mimeType ?? ""), n;
-			if (G.value && P.value && W.value) {
-				U.value = !0;
-				try {
-					let { canvas: e } = P.value.getResult();
-					if (e) {
-						let t = we(e, I.value, L.value), r = Ce(f.item.mimeType ?? "");
-						n = { file: await Te(t, f.item.filename ?? "image", r) };
-					}
-				} catch {
-					U.value = !1;
-					return;
-				}
-				U.value = !1;
-			}
-			m("save", f.item.id, e, t ? N.value : void 0, n), m("close");
-		}
-		function ie(e) {
-			e.key === "Enter" && !U.value && (e.preventDefault(), Y()), e.key === "Escape" && m("close");
-		}
-		return (r, d) => (v(), a(t, { to: E(S) || "body" }, [u(n, {
-			"enter-active-class": "tpl:transition tpl:ease-out tpl:duration-150",
-			"enter-from-class": "tpl:opacity-0",
-			"enter-to-class": "tpl:opacity-100",
-			"leave-active-class": "tpl:transition tpl:ease-in tpl:duration-100",
-			"leave-from-class": "tpl:opacity-100",
-			"leave-to-class": "tpl:opacity-0"
-		}, {
-			default: k(() => [i.visible && i.item ? (v(), s("div", {
-				key: 0,
-				"data-tpl-theme": E(y),
-				class: "tpl tpl:fixed tpl:inset-0 tpl:z-10 tpl:flex tpl:items-center tpl:justify-center tpl:p-4",
-				style: { "background-color": "var(--tpl-overlay)" },
-				onClick: d[3] ||= M((e) => m("close"), ["self"]),
-				onKeydown: ie
-			}, [c("div", {
-				class: h(["tpl:flex tpl:max-h-[90%] tpl:w-full tpl:flex-col tpl:overflow-hidden tpl:rounded-lg tpl:shadow-xl", G.value ? "tpl:max-w-2xl" : "tpl:max-w-sm"]),
-				style: { "background-color": "var(--tpl-bg-elevated)" }
-			}, [
-				c("div", Oe, [c("h3", ke, C(E(_).mediaLibrary.editFile), 1)]),
-				c("div", Ae, [
-					G.value ? (v(), s("div", je, [c("div", Me, [u(E(re), {
-						ref_key: "cropperRef",
-						ref: P,
-						src: i.item.url,
-						"stencil-props": { aspectRatio: ee.value },
-						class: "tpl:h-full tpl:w-full",
-						"background-class": "tpl-cropper-background",
-						onChange: te,
-						onReady: q
-					}, null, 8, ["src", "stencil-props"])]), c("div", Ne, [
-						c("div", null, [c("label", Pe, C(E(_).mediaLibrary.cropAspectRatio), 1), c("div", Fe, [(v(), s(e, null, x([
-							"free",
-							"square",
-							"landscape43",
-							"landscape169",
-							"original"
-						], (e) => c("button", {
-							key: e,
-							type: "button",
-							class: "tpl:cursor-pointer tpl:rounded-md tpl:border tpl:px-2.5 tpl:py-1 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
-							style: g({
-								borderColor: F.value === e ? "var(--tpl-primary)" : "var(--tpl-border)",
-								backgroundColor: F.value === e ? "var(--tpl-primary-light)" : "var(--tpl-bg)",
-								color: F.value === e ? "var(--tpl-primary)" : "var(--tpl-text)"
-							}),
-							onClick: (t) => F.value = e
-						}, C(E(w)[`crop${e.charAt(0).toUpperCase()}${e.slice(1)}`]), 13, Ie)), 64))])]),
-						c("div", Le, [c("div", Re, [c("label", ze, [l(C(E(_).mediaLibrary.cropMaxWidth) + " ", 1), c("span", Be, C(E(_).mediaLibrary.cropOptional), 1)]), c("div", Ve, [c("input", {
-							value: R.value,
-							type: "number",
-							min: "1",
-							class: "tpl:w-full tpl:rounded-md tpl:border tpl:py-1.5 tpl:pr-8 tpl:pl-3 tpl:text-xs tpl:outline-none",
-							style: {
-								"border-color": "var(--tpl-border)",
-								"background-color": "var(--tpl-bg)",
-								color: "var(--tpl-text)"
-							},
-							placeholder: V.value?.width?.toString() || "",
-							onInput: ne
-						}, null, 40, He), c("span", Ue, C(E(_).mediaLibrary.cropPixels), 1)])]), c("div", We, [c("label", Ge, [l(C(E(_).mediaLibrary.cropMaxHeight) + " ", 1), c("span", Ke, C(E(_).mediaLibrary.cropOptional), 1)]), c("div", qe, [c("input", {
-							value: z.value,
-							type: "number",
-							min: "1",
-							class: "tpl:w-full tpl:rounded-md tpl:border tpl:py-1.5 tpl:pr-8 tpl:pl-3 tpl:text-xs tpl:outline-none",
-							style: {
-								"border-color": "var(--tpl-border)",
-								"background-color": "var(--tpl-bg)",
-								color: "var(--tpl-text)"
-							},
-							placeholder: V.value?.height?.toString() || "",
-							onInput: J
-						}, null, 40, Je), c("span", Ye, C(E(_).mediaLibrary.cropPixels), 1)])])]),
-						K.value ? (v(), s("div", Xe, [c("span", null, C(E(_).mediaLibrary.cropOutputSize) + ": ", 1), c("span", Ze, C(K.value.width) + " x " + C(K.value.height) + " " + C(E(_).mediaLibrary.cropPixels), 1)])) : o("", !0)
-					])])) : o("", !0),
-					c("div", Qe, [c("label", $e, C(E(_).mediaLibrary.fileName), 1), A(c("input", {
-						"onUpdate:modelValue": d[0] ||= (e) => j.value = e,
-						type: "text",
-						class: "tpl:w-full tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:outline-none",
-						style: {
-							"border-color": "var(--tpl-border)",
-							"background-color": "var(--tpl-bg)",
-							color: "var(--tpl-text)"
-						},
-						autofocus: !G.value
-					}, null, 8, et), [[D, j.value]])]),
-					E(T)(i.item.mimeType ?? "") ? (v(), s("div", tt, [c("label", nt, C(E(_).mediaLibrary.altText), 1), A(c("input", {
-						"onUpdate:modelValue": d[1] ||= (e) => N.value = e,
-						type: "text",
-						class: "tpl:w-full tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:outline-none",
-						style: {
-							"border-color": "var(--tpl-border)",
-							"background-color": "var(--tpl-bg)",
-							color: "var(--tpl-text)"
-						},
-						placeholder: E(_).mediaLibrary.altTextPlaceholder
-					}, null, 8, rt), [[D, N.value]])])) : o("", !0)
-				]),
-				c("div", it, [c("button", {
-					class: "tpl:cursor-pointer tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
-					style: {
-						"border-color": "var(--tpl-border)",
-						color: "var(--tpl-text)",
-						"background-color": "var(--tpl-bg)"
-					},
-					onClick: d[2] ||= (e) => m("close")
-				}, C(E(_).mediaLibrary.cancel), 1), c("button", {
-					class: "tpl:cursor-pointer tpl:rounded-md tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:text-white tpl:transition-all tpl:duration-150 tpl:disabled:cursor-not-allowed tpl:disabled:opacity-50",
-					style: { background: "linear-gradient(\n                  135deg,\n                  var(--tpl-primary),\n                  var(--tpl-primary-hover)\n                )" },
-					disabled: U.value,
-					onClick: Y
-				}, C(U.value ? E(_).mediaLibrary.saving : E(_).mediaLibrary.saveChanges), 9, at)])
-			], 2)], 40, De)) : o("", !0)]),
-			_: 1
-		})], 8, ["to"]));
-	}
-}), st = (e, t) => {
-	let n = e.__vccOpts || e;
-	for (let [e, r] of t) n[e] = r;
-	return n;
-}, ct = /*#__PURE__*/ st(ot, [["__scopeId", "data-v-c7f50076"]]), lt = {
+}), ye = ["aria-expanded", "aria-label"], be = {
 	key: 1,
 	class: "tpl:size-4 tpl:shrink-0"
-}, ut = {
+}, xe = {
 	key: 0,
 	class: "tpl:truncate"
-}, dt = {
-	key: 3,
-	class: "tpl:flex tpl:shrink-0 tpl:items-center tpl:gap-0.5 tpl:opacity-0 tpl:transition-opacity tpl:group-hover:opacity-100"
-}, ft = ["title"], pt = ["title"], mt = { key: 0 }, ht = ["placeholder"], gt = /* @__PURE__ */ d({
+}, Se = ["onKeydown"], Ce = ["title", "aria-label"], we = ["title", "aria-label"], Te = ["title", "aria-label"], Ee = { key: 0 }, De = ["placeholder", "onKeydown"], Oe = /* @__PURE__ */ x({
 	__name: "MediaFolderTreeNode",
 	props: {
 		folder: {},
@@ -884,64 +439,80 @@ var De = ["data-tpl-theme"], Oe = { class: "tpl:shrink-0 tpl:p-5 tpl:pb-4" }, ke
 		"renameFolder",
 		"deleteFolder"
 	],
-	setup(t, { emit: n }) {
-		let i = t, l = n, { t: d } = Q(), f = b(!1), p = b(!1), m = b(""), _ = b(!1), y = b(""), w = r(() => i.folder.children.length > 0), T = r(() => i.depth < 4), O = r(() => i.currentFolderId === i.folder.id), k = r(() => i.currentFolderId ? F(i.folder.children, i.currentFolderId) : !1), N = r(() => f.value || k.value);
-		function F(e, t) {
-			for (let n of e) if (n.id === t || F(n.children, t)) return !0;
+	setup(e, { emit: t }) {
+		let r = e, i = t, { t: a } = n(), o = k(!1), s = k(!1), c = k(""), u = k(!1), d = k(""), p = k(!1), v = f(() => r.folder.children.length > 0), b = f(() => r.depth < 4), x = f(() => r.currentFolderId === r.folder.id), S = f(() => r.currentFolderId ? E(r.folder.children, r.currentFolderId) : !1), C = f(() => o.value || S.value);
+		function E(e, t) {
+			for (let n of e) if (n.id === t || E(n.children, t)) return !0;
 			return !1;
 		}
-		function I() {
-			f.value = !f.value;
+		function O() {
+			o.value = !o.value;
 		}
-		function R() {
-			p.value = !0, m.value = i.folder.name;
+		function N() {
+			s.value = !0, c.value = r.folder.name;
 		}
-		function z() {
-			let e = m.value.trim();
-			e && e !== i.folder.name && l("renameFolder", i.folder.id, e), p.value = !1, m.value = "";
+		function P() {
+			let e = c.value.trim();
+			e && e !== r.folder.name && i("renameFolder", r.folder.id, e), s.value = !1, c.value = "";
 		}
-		function B() {
-			p.value = !1, m.value = "";
+		function L() {
+			s.value = !1, c.value = "";
 		}
-		function V() {
-			_.value = !0, y.value = "", f.value = !0;
+		function R() {
+			u.value = !0, d.value = "", o.value = !0;
 		}
 		function H() {
-			y.value.trim() && l("createFolder", y.value.trim(), i.folder.id), _.value = !1, y.value = "";
+			d.value.trim() && i("createFolder", d.value.trim(), r.folder.id), u.value = !1, d.value = "";
+		}
+		function te() {
+			u.value = !1, d.value = "";
+		}
+		function U() {
+			if (p.value) {
+				i("deleteFolder", r.folder.id), p.value = !1;
+				return;
+			}
+			p.value = !0;
 		}
-		function G() {
-			_.value = !1, y.value = "";
+		function G(e) {
+			let t = e.relatedTarget;
+			t && e.currentTarget.contains(t) || (p.value = !1);
 		}
-		return (n, r) => {
-			let i = S("MediaFolderTreeNode", !0);
-			return v(), s("div", null, [c("div", {
+		return (t, n) => {
+			let r = j("MediaFolderTreeNode", !0);
+			return D(), g("div", null, [_("div", {
 				class: "tpl:group tpl:flex tpl:w-full tpl:items-center tpl:gap-1 tpl:py-1.5 tpl:pr-2 tpl:text-left tpl:text-xs tpl:transition-all tpl:duration-150",
-				style: g({
-					paddingLeft: `${t.depth * 16 + 8}px`,
-					backgroundColor: O.value ? "var(--tpl-bg-active)" : "transparent",
-					color: O.value ? "var(--tpl-primary)" : "var(--tpl-text)"
-				})
+				style: T({
+					paddingLeft: `${e.depth * 16 + 8}px`,
+					backgroundColor: x.value ? "var(--tpl-bg-active)" : "transparent",
+					color: x.value ? "var(--tpl-primary)" : "var(--tpl-text)"
+				}),
+				onFocusout: G
 			}, [
-				w.value || _.value ? (v(), s("button", {
+				v.value || u.value ? (D(), g("button", {
 					key: 0,
+					type: "button",
 					class: "tpl:flex tpl:size-4 tpl:shrink-0 tpl:items-center tpl:justify-center tpl:rounded tpl:transition-colors",
-					onClick: M(I, ["stop"])
-				}, [u(E(P), {
-					class: h(["tpl:transition-transform tpl:duration-150", { "tpl:rotate-90": N.value }]),
+					"aria-expanded": C.value,
+					"aria-label": C.value ? F(a).mediaLibrary.collapseFolder : F(a).mediaLibrary.expandFolder,
+					onClick: V(O, ["stop"])
+				}, [y(F(ee), {
+					class: w(["tpl:transition-transform tpl:duration-150", { "tpl:rotate-90": C.value }]),
 					size: 10,
 					"stroke-width": 2
-				}, null, 8, ["class"])])) : (v(), s("span", lt)),
-				c("button", {
+				}, null, 8, ["class"])], 8, ye)) : (D(), g("span", be)),
+				_("button", {
+					type: "button",
 					class: "tpl:flex tpl:min-w-0 tpl:flex-1 tpl:items-center tpl:gap-1.5",
-					onClick: r[0] ||= (e) => l("navigate", t.folder.id)
-				}, [u(E(L), {
+					onClick: n[0] ||= (t) => i("navigate", e.folder.id)
+				}, [y(F(W), {
 					class: "tpl:shrink-0",
 					size: 14,
 					"stroke-width": 1.5
-				}), p.value ? o("", !0) : (v(), s("span", ut, C(t.folder.name), 1))]),
-				p.value ? A((v(), s("input", {
+				}), s.value ? h("", !0) : (D(), g("span", xe, M(e.folder.name), 1))]),
+				s.value ? z((D(), g("input", {
 					key: 2,
-					"onUpdate:modelValue": r[1] ||= (e) => m.value = e,
+					"onUpdate:modelValue": n[1] ||= (e) => c.value = e,
 					type: "text",
 					class: "tpl:min-w-0 tpl:flex-1 tpl:rounded tpl:border tpl:px-1.5 tpl:py-0.5 tpl:text-xs tpl:outline-none",
 					style: {
@@ -950,51 +521,62 @@ var De = ["data-tpl-theme"], Oe = { class: "tpl:shrink-0 tpl:p-5 tpl:pb-4" }, ke
 						color: "var(--tpl-text)"
 					},
 					autofocus: "",
-					onKeydown: [j(z, ["enter"]), j(B, ["escape"])],
-					onBlur: z,
-					onClick: r[2] ||= M(() => {}, ["stop"])
-				}, null, 544)), [[D, m.value]]) : o("", !0),
-				p.value ? o("", !0) : (v(), s("span", dt, [
-					T.value && t.canCreateFolder ? (v(), s("button", {
+					onKeydown: [B(P, ["enter"]), B(V(L, ["stop"]), ["escape"])],
+					onBlur: P,
+					onClick: n[2] ||= V(() => {}, ["stop"])
+				}, null, 40, Se)), [[I, c.value]]) : h("", !0),
+				s.value ? h("", !0) : (D(), g("span", {
+					key: 3,
+					class: w(["tpl:flex tpl:shrink-0 tpl:items-center tpl:gap-0.5 tpl:transition-opacity", x.value || p.value ? "tpl:opacity-100" : "tpl:opacity-0 tpl:group-hover:opacity-100 tpl:group-focus-within:opacity-100"])
+				}, [
+					b.value && e.canCreateFolder ? (D(), g("button", {
 						key: 0,
+						type: "button",
 						class: "tpl:flex tpl:size-6 tpl:items-center tpl:justify-center tpl:rounded tpl:transition-colors",
-						title: E(d).mediaLibrary.addSubfolder,
-						onClick: M(V, ["stop"])
-					}, [u(E(W), {
+						title: F(a).mediaLibrary.addSubfolder,
+						"aria-label": F(a).mediaLibrary.addSubfolder,
+						onClick: V(R, ["stop"])
+					}, [y(F(J), {
 						size: 12,
 						"stroke-width": 2
-					})], 8, ft)) : o("", !0),
-					t.canRenameFolder ? (v(), s("button", {
+					})], 8, Ce)) : h("", !0),
+					e.canRenameFolder ? (D(), g("button", {
 						key: 1,
+						type: "button",
 						class: "tpl:flex tpl:size-6 tpl:items-center tpl:justify-center tpl:rounded tpl:transition-colors",
-						title: E(d).mediaLibrary.renameFolder,
-						onClick: M(R, ["stop"])
-					}, [u(E(U), {
+						title: F(a).mediaLibrary.renameFolder,
+						"aria-label": F(a).mediaLibrary.renameFolder,
+						onClick: V(N, ["stop"])
+					}, [y(F(q), {
 						size: 12,
 						"stroke-width": 2
-					})], 8, pt)) : o("", !0),
-					t.canDeleteFolder ? (v(), s("button", {
+					})], 8, we)) : h("", !0),
+					e.canDeleteFolder ? (D(), g("button", {
 						key: 2,
+						type: "button",
+						"data-testid": "media-folder-delete",
 						class: "tpl:flex tpl:size-6 tpl:items-center tpl:justify-center tpl:rounded tpl:transition-colors",
-						onClick: r[3] ||= M((e) => l("deleteFolder", t.folder.id), ["stop"])
-					}, [u(E(te), {
+						title: p.value ? F(a).mediaLibrary.deleteFolderConfirm : F(a).mediaLibrary.deleteFolder,
+						"aria-label": p.value ? F(a).mediaLibrary.deleteFolderConfirm : F(a).mediaLibrary.deleteFolder,
+						onClick: V(U, ["stop"])
+					}, [y(F(X), {
 						size: 12,
 						"stroke-width": 2,
 						style: { color: "var(--tpl-danger)" }
-					})])) : o("", !0)
-				]))
-			], 4), N.value ? (v(), s("div", mt, [(v(!0), s(e, null, x(t.folder.children, (e) => (v(), a(i, {
-				key: e.id,
-				folder: e,
-				"current-folder-id": t.currentFolderId,
-				depth: t.depth + 1,
-				"can-create-folder": t.canCreateFolder,
-				"can-rename-folder": t.canRenameFolder,
-				"can-delete-folder": t.canDeleteFolder,
-				onNavigate: r[4] ||= (e) => l("navigate", e),
-				onCreateFolder: r[5] ||= (e, t) => l("createFolder", e, t),
-				onRenameFolder: r[6] ||= (e, t) => l("renameFolder", e, t),
-				onDeleteFolder: r[7] ||= (e) => l("deleteFolder", e)
+					})], 8, Te)) : h("", !0)
+				], 2))
+			], 36), C.value ? (D(), g("div", Ee, [(D(!0), g(l, null, A(e.folder.children, (t) => (D(), m(r, {
+				key: t.id,
+				folder: t,
+				"current-folder-id": e.currentFolderId,
+				depth: e.depth + 1,
+				"can-create-folder": e.canCreateFolder,
+				"can-rename-folder": e.canRenameFolder,
+				"can-delete-folder": e.canDeleteFolder,
+				onNavigate: n[3] ||= (e) => i("navigate", e),
+				onCreateFolder: n[4] ||= (e, t) => i("createFolder", e, t),
+				onRenameFolder: n[5] ||= (e, t) => i("renameFolder", e, t),
+				onDeleteFolder: n[6] ||= (e) => i("deleteFolder", e)
 			}, null, 8, [
 				"folder",
 				"current-folder-id",
@@ -1002,12 +584,12 @@ var De = ["data-tpl-theme"], Oe = { class: "tpl:shrink-0 tpl:p-5 tpl:pb-4" }, ke
 				"can-create-folder",
 				"can-rename-folder",
 				"can-delete-folder"
-			]))), 128)), _.value ? (v(), s("div", {
+			]))), 128)), u.value ? (D(), g("div", {
 				key: 0,
-				style: g({ paddingLeft: `${(t.depth + 1) * 16 + 8}px` }),
+				style: T({ paddingLeft: `${(e.depth + 1) * 16 + 8}px` }),
 				class: "tpl:py-1.5 tpl:pr-2"
-			}, [A(c("input", {
-				"onUpdate:modelValue": r[8] ||= (e) => y.value = e,
+			}, [z(_("input", {
+				"onUpdate:modelValue": n[7] ||= (e) => d.value = e,
 				type: "text",
 				class: "tpl:w-full tpl:rounded tpl:border tpl:px-2 tpl:py-1 tpl:text-xs tpl:outline-none",
 				style: {
@@ -1015,20 +597,20 @@ var De = ["data-tpl-theme"], Oe = { class: "tpl:shrink-0 tpl:p-5 tpl:pb-4" }, ke
 					"background-color": "var(--tpl-bg)",
 					color: "var(--tpl-text)"
 				},
-				placeholder: E(d).mediaLibrary.subfolderName,
+				placeholder: F(a).mediaLibrary.subfolderName,
 				autofocus: "",
-				onKeydown: [j(H, ["enter"]), j(G, ["escape"])],
+				onKeydown: [B(H, ["enter"]), B(V(te, ["stop"]), ["escape"])],
 				onBlur: H
-			}, null, 40, ht), [[D, y.value]])], 4)) : o("", !0)])) : o("", !0)]);
+			}, null, 40, De), [[I, d.value]])], 4)) : h("", !0)])) : h("", !0)]);
 		};
 	}
-}), _t = {
+}), ke = {
 	"data-testid": "media-folder-tree",
 	class: "tpl:flex tpl:h-full tpl:flex-col tpl:overflow-y-auto"
-}, vt = {
+}, Ae = {
 	key: 0,
 	class: "tpl:px-3 tpl:py-2"
-}, yt = ["placeholder"], bt = /* @__PURE__ */ d({
+}, je = ["placeholder", "onKeydown"], Me = /* @__PURE__ */ x({
 	__name: "MediaFolderTree",
 	props: {
 		folders: {},
@@ -1046,41 +628,41 @@ var De = ["data-tpl-theme"], Oe = { class: "tpl:shrink-0 tpl:p-5 tpl:pb-4" }, ke
 		"deleteFolder",
 		"showFrequentlyUsed"
 	],
-	setup(t, { emit: n }) {
-		let r = n, { t: i } = Q(), d = b(!1), f = b("");
-		function p() {
-			d.value = !0, f.value = "";
+	setup(e, { emit: t }) {
+		let r = t, { t: i } = n(), a = k(!1), o = k("");
+		function s() {
+			a.value = !0, o.value = "";
 		}
-		function m() {
-			f.value.trim() && r("createFolder", f.value.trim()), d.value = !1, f.value = "";
+		function c() {
+			o.value.trim() && r("createFolder", o.value.trim()), a.value = !1, o.value = "";
 		}
-		function h() {
-			d.value = !1, f.value = "";
+		function u() {
+			a.value = !1, o.value = "";
 		}
-		return (n, _) => (v(), s("div", _t, [
-			c("button", {
+		return (t, n) => (D(), g("div", ke, [
+			_("button", {
 				class: "tpl:flex tpl:w-full tpl:items-center tpl:gap-2 tpl:px-3 tpl:py-2 tpl:text-left tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
-				style: g({
-					backgroundColor: t.viewMode === "files" && t.currentFolderId === null ? "var(--tpl-bg-active)" : "transparent",
-					color: t.viewMode === "files" && t.currentFolderId === null ? "var(--tpl-primary)" : "var(--tpl-text)"
+				style: T({
+					backgroundColor: e.viewMode === "files" && e.currentFolderId === null ? "var(--tpl-bg-active)" : "transparent",
+					color: e.viewMode === "files" && e.currentFolderId === null ? "var(--tpl-primary)" : "var(--tpl-text)"
 				}),
-				onClick: _[0] ||= (e) => r("navigate", null)
-			}, [u(E(I), {
+				onClick: n[0] ||= (e) => r("navigate", null)
+			}, [y(F(U), {
 				size: 14,
 				"stroke-width": 1.5
-			}), l(" " + C(E(i).mediaLibrary.allFiles), 1)], 4),
-			(v(!0), s(e, null, x(t.folders, (e) => (v(), a(gt, {
-				key: e.id,
-				folder: e,
-				"current-folder-id": t.currentFolderId,
+			}), v(" " + M(F(i).mediaLibrary.allFiles), 1)], 4),
+			(D(!0), g(l, null, A(e.folders, (t) => (D(), m(Oe, {
+				key: t.id,
+				folder: t,
+				"current-folder-id": e.currentFolderId,
 				depth: 0,
-				"can-create-folder": t.canCreateFolder,
-				"can-rename-folder": t.canRenameFolder,
-				"can-delete-folder": t.canDeleteFolder,
-				onNavigate: _[1] ||= (e) => r("navigate", e),
-				onCreateFolder: _[2] ||= (e, t) => r("createFolder", e, t),
-				onRenameFolder: _[3] ||= (e, t) => r("renameFolder", e, t),
-				onDeleteFolder: _[4] ||= (e) => r("deleteFolder", e)
+				"can-create-folder": e.canCreateFolder,
+				"can-rename-folder": e.canRenameFolder,
+				"can-delete-folder": e.canDeleteFolder,
+				onNavigate: n[1] ||= (e) => r("navigate", e),
+				onCreateFolder: n[2] ||= (e, t) => r("createFolder", e, t),
+				onRenameFolder: n[3] ||= (e, t) => r("renameFolder", e, t),
+				onDeleteFolder: n[4] ||= (e) => r("deleteFolder", e)
 			}, null, 8, [
 				"folder",
 				"current-folder-id",
@@ -1088,8 +670,8 @@ var De = ["data-tpl-theme"], Oe = { class: "tpl:shrink-0 tpl:p-5 tpl:pb-4" }, ke
 				"can-rename-folder",
 				"can-delete-folder"
 			]))), 128)),
-			d.value ? (v(), s("div", vt, [A(c("input", {
-				"onUpdate:modelValue": _[5] ||= (e) => f.value = e,
+			a.value ? (D(), g("div", Ae, [z(_("input", {
+				"onUpdate:modelValue": n[5] ||= (e) => o.value = e,
 				type: "text",
 				class: "tpl:w-full tpl:rounded tpl:border tpl:px-2 tpl:py-1 tpl:text-xs tpl:outline-none",
 				style: {
@@ -1097,139 +679,142 @@ var De = ["data-tpl-theme"], Oe = { class: "tpl:shrink-0 tpl:p-5 tpl:pb-4" }, ke
 					"background-color": "var(--tpl-bg)",
 					color: "var(--tpl-text)"
 				},
-				placeholder: E(i).mediaLibrary.folderName,
+				placeholder: F(i).mediaLibrary.folderName,
 				autofocus: "",
-				onKeydown: [j(m, ["enter"]), j(h, ["escape"])],
-				onBlur: m
-			}, null, 40, yt), [[D, f.value]])])) : o("", !0),
-			!d.value && t.canCreateFolder ? (v(), s("button", {
+				onKeydown: [B(c, ["enter"]), B(V(u, ["stop"]), ["escape"])],
+				onBlur: c
+			}, null, 40, je), [[I, o.value]])])) : h("", !0),
+			!a.value && e.canCreateFolder ? (D(), g("button", {
 				key: 1,
 				class: "tpl:flex tpl:w-full tpl:items-center tpl:gap-2 tpl:px-3 tpl:py-2 tpl:text-left tpl:text-xs tpl:transition-all tpl:duration-150",
 				style: { color: "var(--tpl-text-muted)" },
-				onClick: p
-			}, [u(E(W), {
+				onClick: s
+			}, [y(F(J), {
 				size: 14,
 				"stroke-width": 1.5
-			}), l(" " + C(E(i).mediaLibrary.newFolder), 1)])) : o("", !0),
-			_[7] ||= c("div", { class: "tpl:flex-1" }, null, -1),
-			t.hasFrequentlyUsed ? (v(), s("button", {
+			}), v(" " + M(F(i).mediaLibrary.newFolder), 1)])) : h("", !0),
+			n[7] ||= _("div", { class: "tpl:flex-1" }, null, -1),
+			e.hasFrequentlyUsed ? (D(), g("button", {
 				key: 2,
 				"data-testid": "media-frequently-used",
 				class: "tpl:flex tpl:w-full tpl:items-center tpl:gap-2 tpl:border-t tpl:px-3 tpl:py-2 tpl:text-left tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
-				style: g({
+				style: T({
 					borderColor: "var(--tpl-border)",
-					backgroundColor: t.viewMode === "frequently-used" ? "var(--tpl-bg-active)" : "transparent",
-					color: t.viewMode === "frequently-used" ? "var(--tpl-primary)" : "var(--tpl-text)"
+					backgroundColor: e.viewMode === "frequently-used" ? "var(--tpl-bg-active)" : "transparent",
+					color: e.viewMode === "frequently-used" ? "var(--tpl-primary)" : "var(--tpl-text)"
 				}),
-				onClick: _[6] ||= (e) => r("showFrequentlyUsed")
-			}, [u(E(K), {
+				onClick: n[6] ||= (e) => r("showFrequentlyUsed")
+			}, [y(F(oe), {
 				size: 14,
 				"stroke-width": 1.5
-			}), l(" " + C(E(i).mediaLibrary.frequentlyUsed), 1)], 4)) : o("", !0)
+			}), v(" " + M(F(i).mediaLibrary.frequentlyUsed), 1)], 4)) : h("", !0)
 		]));
 	}
-}), xt = { class: "tpl:flex tpl:aspect-square tpl:flex-col tpl:items-center tpl:justify-center tpl:gap-2" }, St = /* @__PURE__ */ d({
+}), Ne = /* @__PURE__ */ x({
 	__name: "MediaFileIcon",
 	props: { mimeType: {} },
 	setup(e) {
 		let t = e, n = {
 			"application/pdf": {
 				label: "PDF",
-				color: "#dc2626",
-				bgColor: "#fef2f2",
+				color: "var(--tpl-danger)",
+				bgColor: "var(--tpl-danger-light)",
 				icon: "document"
 			},
 			"application/vnd.openxmlformats-officedocument.wordprocessingml.document": {
 				label: "DOC",
-				color: "#2563eb",
-				bgColor: "#eff6ff",
+				color: "var(--tpl-secondary)",
+				bgColor: "var(--tpl-secondary-light)",
 				icon: "document"
 			},
 			"application/msword": {
 				label: "DOC",
-				color: "#2563eb",
-				bgColor: "#eff6ff",
+				color: "var(--tpl-secondary)",
+				bgColor: "var(--tpl-secondary-light)",
 				icon: "document"
 			},
 			"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": {
 				label: "XLS",
-				color: "#16a34a",
-				bgColor: "#f0fdf4",
+				color: "var(--tpl-success)",
+				bgColor: "var(--tpl-success-light)",
 				icon: "document"
 			},
 			"application/vnd.ms-excel": {
 				label: "XLS",
-				color: "#16a34a",
-				bgColor: "#f0fdf4",
+				color: "var(--tpl-success)",
+				bgColor: "var(--tpl-success-light)",
 				icon: "document"
 			},
 			"application/vnd.openxmlformats-officedocument.presentationml.presentation": {
 				label: "PPT",
-				color: "#ea580c",
-				bgColor: "#fff7ed",
+				color: "var(--tpl-warning)",
+				bgColor: "var(--tpl-warning-light)",
 				icon: "document"
 			},
 			"application/vnd.ms-powerpoint": {
 				label: "PPT",
-				color: "#ea580c",
-				bgColor: "#fff7ed",
+				color: "var(--tpl-warning)",
+				bgColor: "var(--tpl-warning-light)",
 				icon: "document"
 			},
 			"text/csv": {
 				label: "CSV",
-				color: "#16a34a",
-				bgColor: "#f0fdf4",
+				color: "var(--tpl-success)",
+				bgColor: "var(--tpl-success-light)",
 				icon: "document"
 			},
 			"text/plain": {
 				label: "TXT",
-				color: "#6b7280",
-				bgColor: "#f9fafb",
+				color: "var(--tpl-text-muted)",
+				bgColor: "var(--tpl-bg-hover)",
 				icon: "document"
 			},
 			"video/mp4": {
 				label: "MP4",
-				color: "#9333ea",
-				bgColor: "#faf5ff",
+				color: "var(--tpl-primary)",
+				bgColor: "var(--tpl-primary-light)",
 				icon: "video"
 			},
 			"video/quicktime": {
 				label: "MOV",
-				color: "#9333ea",
-				bgColor: "#faf5ff",
+				color: "var(--tpl-primary)",
+				bgColor: "var(--tpl-primary-light)",
 				icon: "video"
 			},
 			"video/webm": {
 				label: "WEBM",
-				color: "#9333ea",
-				bgColor: "#faf5ff",
+				color: "var(--tpl-primary)",
+				bgColor: "var(--tpl-primary-light)",
 				icon: "video"
 			},
 			"audio/mpeg": {
 				label: "MP3",
-				color: "#0d9488",
-				bgColor: "#f0fdfa",
+				color: "var(--tpl-secondary)",
+				bgColor: "var(--tpl-secondary-light)",
 				icon: "audio"
 			},
 			"audio/wav": {
 				label: "WAV",
-				color: "#0d9488",
-				bgColor: "#f0fdfa",
+				color: "var(--tpl-secondary)",
+				bgColor: "var(--tpl-secondary-light)",
 				icon: "audio"
 			},
 			"audio/ogg": {
 				label: "OGG",
-				color: "#0d9488",
-				bgColor: "#f0fdfa",
+				color: "var(--tpl-secondary)",
+				bgColor: "var(--tpl-secondary-light)",
 				icon: "audio"
 			}
-		}, i = {
+		}, r = {
 			label: "FILE",
-			color: "#6b7280",
-			bgColor: "#f9fafb",
+			color: "var(--tpl-text-muted)",
+			bgColor: "var(--tpl-bg-hover)",
 			icon: "document"
-		}, a = r(() => n[t.mimeType] ?? i);
-		return (e, t) => (v(), s("div", xt, [a.value.icon === "document" ? (v(), s("svg", {
+		}, i = f(() => n[t.mimeType] ?? r);
+		return (e, t) => (D(), g("div", {
+			class: "tpl:flex tpl:aspect-square tpl:flex-col tpl:items-center tpl:justify-center tpl:gap-2",
+			style: T({ backgroundColor: i.value.bgColor })
+		}, [i.value.icon === "document" ? (D(), g("svg", {
 			key: 0,
 			width: "60",
 			height: "60",
@@ -1237,23 +822,23 @@ var De = ["data-tpl-theme"], Oe = { class: "tpl:shrink-0 tpl:p-5 tpl:pb-4" }, ke
 			fill: "none",
 			stroke: "currentColor",
 			"stroke-width": "1.5",
-			style: g({ color: a.value.color })
+			style: T({ color: i.value.color })
 		}, [...t[0] ||= [
-			c("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }, null, -1),
-			c("polyline", { points: "14 2 14 8 20 8" }, null, -1),
-			c("line", {
+			_("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }, null, -1),
+			_("polyline", { points: "14 2 14 8 20 8" }, null, -1),
+			_("line", {
 				x1: "8",
 				y1: "13",
 				x2: "16",
 				y2: "13"
 			}, null, -1),
-			c("line", {
+			_("line", {
 				x1: "8",
 				y1: "17",
 				x2: "12",
 				y2: "17"
 			}, null, -1)
-		]], 4)) : a.value.icon === "video" ? (v(), s("svg", {
+		]], 4)) : i.value.icon === "video" ? (D(), g("svg", {
 			key: 1,
 			width: "40",
 			height: "40",
@@ -1261,18 +846,18 @@ var De = ["data-tpl-theme"], Oe = { class: "tpl:shrink-0 tpl:p-5 tpl:pb-4" }, ke
 			fill: "none",
 			stroke: "currentColor",
 			"stroke-width": "1.5",
-			style: g({ color: a.value.color })
-		}, [...t[1] ||= [c("rect", {
+			style: T({ color: i.value.color })
+		}, [...t[1] ||= [_("rect", {
 			x: "2",
 			y: "4",
 			width: "20",
 			height: "16",
 			rx: "2"
-		}, null, -1), c("polygon", {
+		}, null, -1), _("polygon", {
 			points: "10,8 16,12 10,16",
 			fill: "currentColor",
 			stroke: "none"
-		}, null, -1)]], 4)) : (v(), s("svg", {
+		}, null, -1)]], 4)) : (D(), g("svg", {
 			key: 2,
 			width: "40",
 			height: "40",
@@ -1280,28 +865,28 @@ var De = ["data-tpl-theme"], Oe = { class: "tpl:shrink-0 tpl:p-5 tpl:pb-4" }, ke
 			fill: "none",
 			stroke: "currentColor",
 			"stroke-width": "1.5",
-			style: g({ color: a.value.color })
+			style: T({ color: i.value.color })
 		}, [...t[2] ||= [
-			c("path", { d: "M9 18V5l12-2v13" }, null, -1),
-			c("circle", {
+			_("path", { d: "M9 18V5l12-2v13" }, null, -1),
+			_("circle", {
 				cx: "6",
 				cy: "18",
 				r: "3"
 			}, null, -1),
-			c("circle", {
+			_("circle", {
 				cx: "18",
 				cy: "16",
 				r: "3"
 			}, null, -1)
-		]], 4)), c("span", {
+		]], 4)), _("span", {
 			class: "tpl:text-xs tpl:font-bold tpl:tracking-wider",
-			style: g({ color: a.value.color })
-		}, C(a.value.label), 5)]));
+			style: T({ color: i.value.color })
+		}, M(i.value.label), 5)], 4));
 	}
 });
 //#endregion
 //#region src/utils/formatAbsoluteDate.ts
-function Ct(e, t, n) {
+function Pe(e, t, n) {
 	let r = new Date(e);
 	if (Number.isNaN(r.getTime())) return "";
 	let i = t?.trim().replace(/_/g, "-") || void 0;
@@ -1313,56 +898,80 @@ function Ct(e, t, n) {
 }
 //#endregion
 //#region src/components/media/MediaGrid.vue?vue&type=script&setup=true&lang.ts
-var wt = { class: "tpl:p-4" }, Tt = {
+var Fe = { class: "tpl:p-4" }, Ie = ["aria-label"], Le = {
 	key: 1,
 	class: "tpl:flex tpl:flex-col tpl:items-center tpl:justify-center tpl:py-16"
-}, Et = {
+}, Re = {
 	class: "tpl:text-xs",
 	style: { color: "var(--tpl-text-muted)" }
-}, Dt = {
-	key: 2,
-	class: "tpl:grid tpl:grid-cols-4 tpl:gap-3"
-}, Ot = [
+}, ze = ["aria-label"], Be = [
 	"data-media-id",
+	"aria-selected",
+	"aria-label",
 	"onClick",
-	"onDblclick"
-], kt = { class: "tpl:aspect-square" }, At = ["src", "alt"], jt = { class: "tpl:px-2 tpl:py-1.5" }, Mt = {
+	"onDblclick",
+	"onKeydown"
+], Ve = { class: "tpl:aspect-square" }, He = ["src", "alt"], Ue = { class: "tpl:px-2 tpl:py-1.5" }, We = {
 	class: "tpl:truncate tpl:text-[10px] tpl:font-medium",
 	style: { color: "var(--tpl-text)" }
-}, Nt = {
-	class: "tpl:flex tpl:justify-between tpl:text-[9px]",
+}, Ge = {
+	class: "tpl:flex tpl:justify-between tpl:text-[10px]",
 	style: { color: "var(--tpl-text-muted)" }
-}, Pt = { key: 0 }, Ft = { key: 1 }, It = { class: "tpl:absolute tpl:top-1.5 tpl:left-1.5 tpl:flex tpl:gap-1 tpl:opacity-0 tpl:transition-opacity tpl:duration-150 tpl:group-hover:opacity-100" }, Lt = ["title", "onClick"], Rt = ["title", "onClick"], zt = {
+}, Ke = { key: 0 }, qe = { key: 1 }, Je = [
+	"title",
+	"aria-label",
+	"onClick"
+], Ye = [
+	"title",
+	"aria-label",
+	"onClick"
+], Xe = {
 	key: 0,
-	class: "tpl:absolute tpl:top-1.5 tpl:right-1.5 tpl:flex tpl:size-5 tpl:items-center tpl:justify-center tpl:rounded-full tpl:text-white",
-	style: { "background-color": "var(--tpl-primary)" }
-}, Bt = {
-	key: 3,
-	class: "tpl:flex tpl:flex-col tpl:gap-1"
-}, Vt = [
+	"aria-hidden": "true",
+	class: "tpl:absolute tpl:top-1.5 tpl:right-1.5 tpl:flex tpl:size-5 tpl:items-center tpl:justify-center tpl:rounded-full",
+	style: {
+		"background-color": "var(--tpl-primary)",
+		color: "var(--tpl-on-primary)"
+	}
+}, Ze = ["aria-label"], Qe = [
 	"data-media-id",
+	"aria-selected",
+	"aria-label",
 	"onClick",
-	"onDblclick"
-], Ht = {
+	"onDblclick",
+	"onKeydown"
+], $e = {
 	class: "tpl:size-10 tpl:shrink-0 tpl:overflow-hidden tpl:rounded",
 	style: { "background-color": "var(--tpl-bg-hover)" }
-}, Ut = ["src", "alt"], Wt = {
+}, et = ["src", "alt"], tt = {
 	key: 1,
 	class: "tpl-list-icon tpl:size-full"
-}, Gt = { class: "tpl:min-w-0 tpl:flex-1" }, Kt = {
+}, nt = { class: "tpl:min-w-0 tpl:flex-1" }, rt = {
 	class: "tpl:truncate tpl:text-xs tpl:font-medium",
 	style: { color: "var(--tpl-text)" }
-}, qt = {
+}, it = {
 	class: "tpl:text-[10px]",
 	style: { color: "var(--tpl-text-muted)" }
-}, Jt = { class: "tpl:flex tpl:gap-1 tpl:opacity-0 tpl:transition-opacity tpl:duration-150 tpl:group-hover:opacity-100" }, Yt = ["title", "onClick"], Xt = ["title", "onClick"], Zt = {
+}, at = [
+	"title",
+	"aria-label",
+	"onClick"
+], ot = [
+	"title",
+	"aria-label",
+	"onClick"
+], st = {
 	key: 0,
-	class: "tpl:flex tpl:size-5 tpl:shrink-0 tpl:items-center tpl:justify-center tpl:rounded-full tpl:text-white",
-	style: { "background-color": "var(--tpl-primary)" }
-}, Qt = {
+	"aria-hidden": "true",
+	class: "tpl:flex tpl:size-5 tpl:shrink-0 tpl:items-center tpl:justify-center tpl:rounded-full",
+	style: {
+		"background-color": "var(--tpl-primary)",
+		color: "var(--tpl-on-primary)"
+	}
+}, ct = {
 	key: 4,
 	class: "tpl:flex tpl:justify-center tpl:py-4"
-}, $t = /*#__PURE__*/ st(/* @__PURE__ */ d({
+}, lt = /*#__PURE__*/ i(/* @__PURE__ */ x({
 	__name: "MediaGrid",
 	props: {
 		items: {},
@@ -1383,189 +992,241 @@ var wt = { class: "tpl:p-4" }, Tt = {
 		"replace",
 		"confirm"
 	],
-	setup(t, { emit: n }) {
-		let r = t, i = n, { isAcceptedMimeType: d, isImageMimeType: f } = $();
-		function m(e) {
+	setup(e, { emit: r }) {
+		let i = e, a = r, { isAcceptedMimeType: s, isImageMimeType: c } = o();
+		function u(e) {
 			return e.mimeType ?? "";
 		}
-		function _(e) {
+		function d(e) {
 			return e.thumbnailUrl ?? e.url;
 		}
-		function y(e) {
-			return !r.accept || r.accept.length === 0 || d(m(e), r.accept);
+		function f(e) {
+			return !i.accept || i.accept.length === 0 || s(u(e), i.accept);
 		}
-		function S(e) {
-			return r.canUpdate === !0 && e.canUpdate !== !1;
+		function p(e) {
+			return i.canUpdate === !0 && e.canUpdate !== !1;
 		}
-		function w(e) {
-			return r.canReplace === !0 && e.canUpdate !== !1;
+		function b(e) {
+			return i.canReplace === !0 && e.canUpdate !== !1;
 		}
-		function T(e, t) {
+		function x(e, t) {
 			if (t.metaKey || t.ctrlKey) {
-				i("toggle", e.id);
+				a("toggle", e.id);
 				return;
 			}
-			i("select", e);
+			a("select", e);
 		}
-		function D(e) {
-			y(e) && i("confirm", e);
+		function S(e) {
+			f(e) && a("confirm", e);
+		}
+		function E(e, t) {
+			(t.key === "Enter" || t.key === " ") && (t.preventDefault(), t.stopPropagation(), a("select", e));
+		}
+		function O(e) {
+			return i.selectedIds.has(e.id);
 		}
-		let { t: O } = Q(), k = p(me, null), A = b(null);
-		X(A, ([{ isIntersecting: e }]) => {
-			e && r.hasMore && !r.isLoading && i("loadMore");
-		}, { threshold: .1 });
 		function j(e) {
+			return O(e) ? "tpl:opacity-100" : "tpl:opacity-0 tpl:group-hover:opacity-100 tpl:group-focus-within:opacity-100";
+		}
+		let { t: N } = n(), P = C(t, null), I = k(null);
+		pe(I, ([{ isIntersecting: e }]) => {
+			e && i.hasMore && !i.isLoading && a("loadMore");
+		}, { threshold: .1 });
+		function L(e) {
 			return e < 1024 ? `${e} B` : e < 1048576 ? `${(e / 1024).toFixed(1)} KB` : `${(e / 1048576).toFixed(1)} MB`;
 		}
-		function P(e) {
-			return Ct(e, k?.value, {
+		function R(e) {
+			return Pe(e, P?.value, {
 				year: "numeric",
 				month: "short",
 				day: "numeric"
 			});
 		}
-		return (n, r) => (v(), s("div", wt, [
-			t.isLoading && t.items.length === 0 ? (v(), s("div", {
+		return (t, n) => (D(), g("div", Fe, [
+			e.isLoading && e.items.length === 0 ? (D(), g("div", {
 				key: 0,
 				role: "status",
 				"aria-busy": "true",
-				class: h(t.layout === "list" ? "tpl:flex tpl:flex-col tpl:gap-1" : "tpl:grid tpl:grid-cols-4 tpl:gap-3")
-			}, [(v(), s(e, null, x(8, (e) => c("div", {
-				key: e,
-				class: h(["tpl-pulse tpl:rounded-lg", t.layout === "list" ? "tpl:h-12" : "tpl:aspect-square"]),
+				"aria-label": F(N).mediaLibrary.loading,
+				class: w(e.layout === "list" ? "tpl:flex tpl:flex-col tpl:gap-1" : "tpl:grid tpl:grid-cols-4 tpl:gap-3")
+			}, [(D(), g(l, null, A(8, (t) => _("div", {
+				key: t,
+				class: w(["tpl-pulse tpl:rounded-lg", e.layout === "list" ? "tpl:h-12" : "tpl:aspect-square"]),
 				style: { "background-color": "var(--tpl-bg-hover)" },
 				"aria-hidden": "true"
-			}, null, 2)), 64))], 2)) : t.items.length === 0 ? (v(), s("div", Tt, [u(E(I), {
+			}, null, 2)), 64))], 10, Ie)) : e.items.length === 0 ? (D(), g("div", Le, [y(F(U), {
 				class: "tpl:mb-3",
 				size: 40,
 				"stroke-width": 1,
 				style: { color: "var(--tpl-text-dim)" }
-			}), c("p", Et, C(t.searchQuery ? E(O).mediaLibrary.noSearchResults : E(O).mediaLibrary.noFiles), 1)])) : t.layout === "list" ? (v(), s("div", Bt, [(v(!0), s(e, null, x(t.items, (n) => (v(), s("div", {
-				key: n.id,
+			}), _("p", Re, M(e.searchQuery ? F(N).mediaLibrary.noSearchResults : F(N).mediaLibrary.noFiles), 1)])) : e.layout === "list" ? (D(), g("div", {
+				key: 3,
+				role: "listbox",
+				"aria-label": F(N).mediaLibrary.filesListAriaLabel,
+				"aria-multiselectable": "true",
+				class: "tpl:flex tpl:flex-col tpl:gap-1"
+			}, [(D(!0), g(l, null, A(e.items, (e) => (D(), g("div", {
+				key: e.id,
+				role: "option",
+				tabindex: "0",
 				"data-testid": "media-library-item",
-				class: h(["tpl-media-list-item tpl:group tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-3 tpl:rounded-lg tpl:px-3 tpl:py-2 tpl:transition-all tpl:duration-150", [!y(n) && !t.selectedIds.has(n.id) ? "tpl:opacity-60" : ""]]),
-				"data-media-id": n.id,
-				style: g({ backgroundColor: t.selectedIds.has(n.id) ? "var(--tpl-bg-hover)" : "transparent" }),
-				onClick: (e) => T(n, e),
-				onDblclick: (e) => D(n)
+				class: w(["tpl-media-list-item tpl:group tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-3 tpl:rounded-lg tpl:px-3 tpl:py-2 tpl:transition-all tpl:duration-150", [!f(e) && !O(e) ? "tpl:opacity-60" : ""]]),
+				"data-media-id": e.id,
+				"aria-selected": O(e),
+				"aria-label": e.filename || e.url,
+				style: T({ backgroundColor: O(e) ? "var(--tpl-bg-hover)" : "transparent" }),
+				onClick: (t) => x(e, t),
+				onDblclick: (t) => S(e),
+				onKeydown: (t) => E(e, t)
 			}, [
-				c("div", Ht, [E(f)(m(n)) ? (v(), s("img", {
+				_("div", $e, [F(c)(u(e)) ? (D(), g("img", {
 					key: 0,
-					src: _(n),
-					alt: n.filename || n.url,
+					src: d(e),
+					alt: e.filename || e.url,
 					class: "tpl:size-full tpl:object-cover",
 					loading: "lazy"
-				}, null, 8, Ut)) : (v(), s("div", Wt, [u(St, { "mime-type": m(n) }, null, 8, ["mime-type"])]))]),
-				c("div", Gt, [c("p", Kt, C(n.filename || n.url), 1), c("p", qt, [
-					n.size == null ? o("", !0) : (v(), s(e, { key: 0 }, [l(C(j(n.size)), 1)], 64)),
-					n.createdAt ? (v(), s(e, { key: 1 }, [n.size == null ? o("", !0) : (v(), s(e, { key: 0 }, [l(" · ")], 64)), l(" " + C(P(n.createdAt)), 1)], 64)) : o("", !0),
-					E(f)(m(n)) && n.width && n.height ? (v(), s(e, { key: 2 }, [l(" · " + C(n.width) + "×" + C(n.height), 1)], 64)) : o("", !0)
+				}, null, 8, et)) : (D(), g("div", tt, [y(Ne, { "mime-type": u(e) }, null, 8, ["mime-type"])]))]),
+				_("div", nt, [_("p", rt, M(e.filename || e.url), 1), _("p", it, [
+					e.size == null ? h("", !0) : (D(), g(l, { key: 0 }, [v(M(L(e.size)), 1)], 64)),
+					e.createdAt ? (D(), g(l, { key: 1 }, [e.size == null ? h("", !0) : (D(), g(l, { key: 0 }, [v(" · ")], 64)), v(" " + M(R(e.createdAt)), 1)], 64)) : h("", !0),
+					F(c)(u(e)) && e.width && e.height ? (D(), g(l, { key: 2 }, [v(" · " + M(e.width) + "×" + M(e.height), 1)], 64)) : h("", !0)
 				])]),
-				c("div", Jt, [S(n) ? (v(), s("button", {
+				_("div", { class: w(["tpl:flex tpl:gap-1 tpl:transition-opacity tpl:duration-150", j(e)]) }, [p(e) ? (D(), g("button", {
 					key: 0,
+					type: "button",
 					"data-testid": "media-edit",
 					class: "tpl:flex tpl:size-6 tpl:shrink-0 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded",
 					style: { color: "var(--tpl-text-muted)" },
-					title: E(O).mediaLibrary.editFile,
-					onClick: M((e) => i("edit", n), ["stop"])
-				}, [u(E(U), {
+					title: F(N).mediaLibrary.editFile,
+					"aria-label": F(N).mediaLibrary.editFile,
+					onClick: V((t) => a("edit", e), ["stop"])
+				}, [y(F(q), {
 					size: 12,
 					"stroke-width": 2
-				})], 8, Yt)) : o("", !0), w(n) ? (v(), s("button", {
+				})], 8, at)) : h("", !0), b(e) ? (D(), g("button", {
 					key: 1,
+					type: "button",
 					"data-testid": "media-replace",
 					class: "tpl:flex tpl:size-6 tpl:shrink-0 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded",
 					style: { color: "var(--tpl-text-muted)" },
-					title: E(O).mediaLibrary.replaceFile,
-					onClick: M((e) => i("replace", n), ["stop"])
-				}, [u(E(G), {
+					title: F(N).mediaLibrary.replaceFile,
+					"aria-label": F(N).mediaLibrary.replaceFile,
+					onClick: V((t) => a("replace", e), ["stop"])
+				}, [y(F(Y), {
 					size: 12,
 					"stroke-width": 2
-				})], 8, Xt)) : o("", !0)]),
-				t.selectedIds.has(n.id) ? (v(), s("div", Zt, [u(E(N), {
+				})], 8, ot)) : h("", !0)], 2),
+				O(e) ? (D(), g("div", st, [y(F(H), {
 					size: 12,
 					"stroke-width": 3
-				})])) : o("", !0)
-			], 46, Vt))), 128))])) : (v(), s("div", Dt, [(v(!0), s(e, null, x(t.items, (e) => (v(), s("div", {
+				})])) : h("", !0)
+			], 46, Qe))), 128))], 8, Ze)) : (D(), g("div", {
+				key: 2,
+				role: "listbox",
+				"aria-label": F(N).mediaLibrary.filesListAriaLabel,
+				"aria-multiselectable": "true",
+				class: "tpl:grid tpl:grid-cols-4 tpl:gap-3"
+			}, [(D(!0), g(l, null, A(e.items, (e) => (D(), g("div", {
 				key: e.id,
+				role: "option",
+				tabindex: "0",
 				"data-testid": "media-library-item",
-				class: h(["tpl-media-item tpl:group tpl:relative tpl:overflow-hidden tpl:rounded-lg tpl:border-2 tpl:transition-all tpl:duration-150", [
+				class: w(["tpl-media-item tpl:group tpl:relative tpl:overflow-hidden tpl:rounded-lg tpl:border-2 tpl:transition-all tpl:duration-150", [
 					"tpl:cursor-pointer",
-					!y(e) && !t.selectedIds.has(e.id) ? "tpl:opacity-60" : "",
-					t.selectedIds.has(e.id) ? "tpl-media-item--selected" : ""
+					!f(e) && !O(e) ? "tpl:opacity-60" : "",
+					O(e) ? "tpl-media-item--selected" : ""
 				]]),
 				"data-media-id": e.id,
-				style: g({
-					borderColor: t.selectedIds.has(e.id) ? "var(--tpl-primary)" : "transparent",
-					backgroundColor: !y(e) && !t.selectedIds.has(e.id) ? "var(--tpl-bg)" : "var(--tpl-bg-hover)"
+				"aria-selected": O(e),
+				"aria-label": e.filename || e.url,
+				style: T({
+					borderColor: O(e) ? "var(--tpl-primary)" : "transparent",
+					backgroundColor: !f(e) && !O(e) ? "var(--tpl-bg)" : "var(--tpl-bg-hover)"
 				}),
-				onClick: (t) => T(e, t),
-				onDblclick: (t) => D(e)
+				onClick: (t) => x(e, t),
+				onDblclick: (t) => S(e),
+				onKeydown: (t) => E(e, t)
 			}, [
-				c("div", kt, [E(f)(m(e)) ? (v(), s("img", {
+				_("div", Ve, [F(c)(u(e)) ? (D(), g("img", {
 					key: 0,
-					src: _(e),
+					src: d(e),
 					alt: e.filename || e.url,
 					class: "tpl:size-full tpl:object-cover",
 					loading: "lazy"
-				}, null, 8, At)) : (v(), a(St, {
+				}, null, 8, He)) : (D(), m(Ne, {
 					key: 1,
-					"mime-type": m(e)
+					"mime-type": u(e)
 				}, null, 8, ["mime-type"]))]),
-				c("div", jt, [c("p", Mt, C(e.filename || e.url), 1), c("p", Nt, [e.size == null ? o("", !0) : (v(), s("span", Pt, C(j(e.size)), 1)), E(f)(m(e)) && e.width && e.height ? (v(), s("span", Ft, C(e.width) + "×" + C(e.height), 1)) : o("", !0)])]),
-				c("div", It, [S(e) ? (v(), s("button", {
+				_("div", Ue, [_("p", We, M(e.filename || e.url), 1), _("p", Ge, [e.size == null ? h("", !0) : (D(), g("span", Ke, M(L(e.size)), 1)), F(c)(u(e)) && e.width && e.height ? (D(), g("span", qe, M(e.width) + "×" + M(e.height), 1)) : h("", !0)])]),
+				_("div", { class: w(["tpl:absolute tpl:top-1.5 tpl:left-1.5 tpl:flex tpl:gap-1 tpl:transition-opacity tpl:duration-150", j(e)]) }, [p(e) ? (D(), g("button", {
 					key: 0,
+					type: "button",
 					"data-testid": "media-edit",
-					class: "tpl:flex tpl:size-6 tpl:items-center tpl:justify-center tpl:rounded-full tpl:text-white",
-					style: { "background-color": "rgba(0, 0, 0, 0.6)" },
-					title: E(O).mediaLibrary.editFile,
-					onClick: M((t) => i("edit", e), ["stop"])
-				}, [u(E(U), {
+					class: "tpl:flex tpl:size-6 tpl:items-center tpl:justify-center tpl:rounded-full",
+					style: {
+						"background-color": "var(--tpl-overlay)",
+						color: "var(--tpl-on-primary)"
+					},
+					title: F(N).mediaLibrary.editFile,
+					"aria-label": F(N).mediaLibrary.editFile,
+					onClick: V((t) => a("edit", e), ["stop"])
+				}, [y(F(q), {
 					size: 11,
 					"stroke-width": 2
-				})], 8, Lt)) : o("", !0), w(e) ? (v(), s("button", {
+				})], 8, Je)) : h("", !0), b(e) ? (D(), g("button", {
 					key: 1,
+					type: "button",
 					"data-testid": "media-replace",
-					class: "tpl:flex tpl:size-6 tpl:items-center tpl:justify-center tpl:rounded-full tpl:text-white",
-					style: { "background-color": "rgba(0, 0, 0, 0.6)" },
-					title: E(O).mediaLibrary.replaceFile,
-					onClick: M((t) => i("replace", e), ["stop"])
-				}, [u(E(G), {
+					class: "tpl:flex tpl:size-6 tpl:items-center tpl:justify-center tpl:rounded-full",
+					style: {
+						"background-color": "var(--tpl-overlay)",
+						color: "var(--tpl-on-primary)"
+					},
+					title: F(N).mediaLibrary.replaceFile,
+					"aria-label": F(N).mediaLibrary.replaceFile,
+					onClick: V((t) => a("replace", e), ["stop"])
+				}, [y(F(Y), {
 					size: 11,
 					"stroke-width": 2
-				})], 8, Rt)) : o("", !0)]),
-				t.selectedIds.has(e.id) ? (v(), s("div", zt, [u(E(N), {
+				})], 8, Ye)) : h("", !0)], 2),
+				O(e) ? (D(), g("div", Xe, [y(F(H), {
 					size: 12,
 					"stroke-width": 3
-				})])) : o("", !0)
-			], 46, Ot))), 128))])),
-			c("div", {
+				})])) : h("", !0)
+			], 46, Be))), 128))], 8, ze)),
+			_("div", {
 				ref_key: "sentinelRef",
-				ref: A,
+				ref: I,
 				class: "tpl:h-4"
 			}, null, 512),
-			t.isLoading && t.items.length > 0 ? (v(), s("div", Qt, [u(E(V), {
+			e.isLoading && e.items.length > 0 ? (D(), g("div", ct, [y(F(K), {
 				class: "tpl-spinner",
 				size: 20,
 				"stroke-width": 2,
 				style: { color: "var(--tpl-primary)" }
-			})])) : o("", !0)
+			})])) : h("", !0)
 		]));
 	}
-}), [["__scopeId", "data-v-02bd861d"]]), en = ["data-tpl-theme"], tn = {
-	class: "tpl:max-h-[90%] tpl:w-full tpl:max-w-sm tpl:overflow-y-auto tpl:rounded-lg tpl:p-5 tpl:shadow-xl",
-	style: { "background-color": "var(--tpl-bg-elevated)" }
-}, nn = {
+}), [["__scopeId", "data-v-9d25c128"]]), ut = ["data-tpl-theme"], dt = {
+	id: "tpl-media-import-title",
 	class: "tpl:mb-4 tpl:text-sm tpl:font-semibold",
 	style: { color: "var(--tpl-text)" }
-}, rn = { class: "tpl:mb-3" }, an = ["placeholder", "disabled"], on = {
+}, ft = { class: "tpl:mb-3" }, pt = [
+	"aria-label",
+	"aria-invalid",
+	"aria-describedby",
+	"placeholder",
+	"disabled"
+], mt = {
 	key: 0,
+	id: "tpl-media-import-error",
+	role: "alert",
 	class: "tpl:mb-3 tpl:text-xs",
 	style: { color: "var(--tpl-danger)" }
-}, sn = { class: "tpl:flex tpl:justify-end tpl:gap-2" }, cn = ["disabled"], ln = ["disabled"], un = {
+}, ht = { class: "tpl:flex tpl:justify-end tpl:gap-2" }, gt = ["disabled"], _t = ["disabled"], vt = {
 	key: 0,
 	class: "tpl:flex tpl:items-center tpl:gap-1.5"
-}, dn = { key: 1 }, fn = /* @__PURE__ */ d({
+}, yt = { key: 1 }, bt = /* @__PURE__ */ x({
 	__name: "MediaImportUrlModal",
 	props: {
 		visible: { type: Boolean },
@@ -1573,22 +1234,24 @@ var wt = { class: "tpl:p-4" }, Tt = {
 		error: {}
 	},
 	emits: ["import", "close"],
-	setup(e, { emit: r }) {
-		let i = e, d = r, { t: f } = Q(), m = p(Z, null), g = p(fe, b(null)), _ = b("");
-		O(() => i.visible, (e) => {
-			e && (_.value = "");
+	setup(e, { emit: t }) {
+		let i = e, o = t, { t: s } = n(), l = C(r, null), p = C(a, k(null)), b = k("");
+		L(() => i.visible, (e) => {
+			e && (b.value = "");
 		});
-		function y() {
-			let e = _.value.trim();
-			e && !i.isImporting && d("import", e);
-		}
 		function x() {
-			i.isImporting || d("close");
+			let e = b.value.trim();
+			e && !i.isImporting && o("import", e);
 		}
-		function S(e) {
-			e.key === "Enter" && (e.preventDefault(), y()), e.key === "Escape" && x();
+		function S() {
+			i.isImporting || o("close");
+		}
+		let T = k(null), E = f(() => i.visible);
+		c(T, E);
+		function O(e) {
+			e.stopPropagation(), e.key === "Enter" && (e.preventDefault(), x()), e.key === "Escape" && S();
 		}
-		return (r, i) => (v(), a(t, { to: E(g) || "body" }, [u(n, {
+		return (t, n) => (D(), m(u, { to: F(p) || "body" }, [y(d, {
 			"enter-active-class": "tpl:transition tpl:ease-out tpl:duration-150",
 			"enter-from-class": "tpl:opacity-0",
 			"enter-to-class": "tpl:opacity-100",
@@ -1596,77 +1259,91 @@ var wt = { class: "tpl:p-4" }, Tt = {
 			"leave-from-class": "tpl:opacity-100",
 			"leave-to-class": "tpl:opacity-0"
 		}, {
-			default: k(() => [e.visible ? (v(), s("div", {
+			default: R(() => [e.visible ? (D(), g("div", {
 				key: 0,
-				"data-tpl-theme": E(m),
-				class: "tpl tpl:fixed tpl:inset-0 tpl:z-10 tpl:flex tpl:items-center tpl:justify-center tpl:p-4",
+				"data-tpl-theme": F(l),
+				class: w([F(p) ? void 0 : "tpl", "tpl:fixed tpl:inset-0 tpl:z-10 tpl:flex tpl:items-center tpl:justify-center tpl:p-4"]),
 				style: { "background-color": "var(--tpl-overlay)" },
-				onClick: M(x, ["self"]),
-				onKeydown: S
-			}, [c("div", tn, [
-				c("h3", nn, C(E(f).mediaLibrary.importFromUrl), 1),
-				c("div", rn, [A(c("input", {
-					"onUpdate:modelValue": i[0] ||= (e) => _.value = e,
+				onClick: V(S, ["self"]),
+				onKeydown: O
+			}, [_("div", {
+				ref_key: "dialogRef",
+				ref: T,
+				role: "dialog",
+				"aria-modal": "true",
+				"aria-labelledby": "tpl-media-import-title",
+				class: "tpl:max-h-[90%] tpl:w-full tpl:max-w-sm tpl:overflow-y-auto tpl:rounded-lg tpl:p-5 tpl:shadow-xl",
+				style: { "background-color": "var(--tpl-bg-elevated)" }
+			}, [
+				_("h3", dt, M(F(s).mediaLibrary.importFromUrl), 1),
+				_("div", ft, [z(_("input", {
+					"onUpdate:modelValue": n[0] ||= (e) => b.value = e,
 					type: "url",
+					"aria-label": F(s).mediaLibrary.importFromUrl,
+					"aria-invalid": !!e.error,
+					"aria-describedby": e.error ? "tpl-media-import-error" : void 0,
 					class: "tpl:w-full tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:outline-none",
 					style: {
 						"border-color": "var(--tpl-border)",
 						"background-color": "var(--tpl-bg)",
 						color: "var(--tpl-text)"
 					},
-					placeholder: E(f).mediaLibrary.importUrlPlaceholder,
+					placeholder: F(s).mediaLibrary.importUrlPlaceholder,
 					disabled: e.isImporting,
 					autofocus: ""
-				}, null, 8, an), [[D, _.value]])]),
-				e.error ? (v(), s("p", on, C(e.error), 1)) : o("", !0),
-				c("div", sn, [c("button", {
-					class: h(["tpl:cursor-pointer tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150", { "tpl:cursor-not-allowed tpl:opacity-50": e.isImporting }]),
+				}, null, 8, pt), [[I, b.value]])]),
+				e.error ? (D(), g("p", mt, M(e.error), 1)) : h("", !0),
+				_("div", ht, [_("button", {
+					class: w(["tpl:cursor-pointer tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150", { "tpl:cursor-not-allowed tpl:opacity-50": e.isImporting }]),
 					style: {
 						"border-color": "var(--tpl-border)",
 						color: "var(--tpl-text)",
 						"background-color": "var(--tpl-bg)"
 					},
 					disabled: e.isImporting,
+					onClick: S
+				}, M(F(s).mediaLibrary.cancel), 11, gt), _("button", {
+					class: "tpl:cursor-pointer tpl:rounded-md tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150 tpl:hover:bg-[var(--tpl-primary-hover)] tpl:disabled:cursor-not-allowed tpl:disabled:opacity-50",
+					style: {
+						"background-color": "var(--tpl-primary)",
+						color: "var(--tpl-on-primary)"
+					},
+					disabled: !b.value.trim() || e.isImporting,
 					onClick: x
-				}, C(E(f).mediaLibrary.cancel), 11, cn), c("button", {
-					class: "tpl:cursor-pointer tpl:rounded-md tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:text-white tpl:transition-all tpl:duration-150 tpl:disabled:cursor-not-allowed tpl:disabled:opacity-50",
-					style: { background: "linear-gradient(\n                  135deg,\n                  var(--tpl-primary),\n                  var(--tpl-primary-hover)\n                )" },
-					disabled: !_.value.trim() || e.isImporting,
-					onClick: y
-				}, [e.isImporting ? (v(), s("span", un, [u(E(V), {
+				}, [e.isImporting ? (D(), g("span", vt, [y(F(K), {
 					class: "tpl:animate-spin",
 					size: 12,
 					"stroke-width": 2
-				}), l(" " + C(E(f).mediaLibrary.importing), 1)])) : (v(), s("span", dn, C(E(f).mediaLibrary.import), 1))], 8, ln)])
-			])], 40, en)) : o("", !0)]),
+				}), v(" " + M(F(s).mediaLibrary.importing), 1)])) : (D(), g("span", yt, M(F(s).mediaLibrary.import), 1))], 8, _t)])
+			], 512)], 42, ut)) : h("", !0)]),
 			_: 1
 		})], 8, ["to"]));
 	}
-}), pn = { class: "tpl:max-h-56 tpl:overflow-y-auto tpl:py-1" }, mn = ["disabled", "onClick"], hn = { class: "tpl:truncate" }, gn = {
+}), xt = { class: "tpl:max-h-56 tpl:overflow-y-auto tpl:py-1" }, St = ["disabled", "onClick"], Ct = { class: "tpl:truncate" }, wt = {
 	key: 0,
 	class: "tpl:shrink-0",
 	style: { color: "var(--tpl-text-dim)" }
-}, _n = /* @__PURE__ */ d({
+}, Tt = /* @__PURE__ */ x({
 	__name: "MediaMovePicker",
 	props: {
 		folders: {},
 		currentFolderId: {}
 	},
 	emits: ["select", "close"],
-	setup(t, { emit: n }) {
-		let r = n, { t: i } = Q(), a = b(null);
-		function d(e, t = 0) {
+	setup(e, { emit: t }) {
+		let r = t, { t: i } = n(), a = k(null);
+		function o(e, t = 0) {
 			let n = [];
 			for (let r of e) n.push({
 				id: r.id,
 				name: r.name,
 				depth: t
-			}), r.children.length && n.push(...d(r.children, t + 1));
+			}), r.children.length && n.push(...o(r.children, t + 1));
 			return n;
 		}
-		return J(a, () => {
+		return Q(a, () => {
 			r("close");
-		}), (n, f) => (v(), s("div", {
+		}), (t, n) => (D(), g("div", {
 			ref_key: "pickerRef",
 			ref: a,
 			class: "tpl:absolute tpl:bottom-full tpl:left-0 tpl:z-10 tpl:mb-2 tpl:w-56 tpl:overflow-hidden tpl:rounded-lg tpl:border tpl:shadow-lg",
@@ -1674,139 +1351,143 @@ var wt = { class: "tpl:p-4" }, Tt = {
 				"border-color": "var(--tpl-border)",
 				"background-color": "var(--tpl-bg-elevated)"
 			}
-		}, [c("div", pn, [t.currentFolderId === null ? o("", !0) : (v(), s("button", {
+		}, [_("div", xt, [e.currentFolderId === null ? h("", !0) : (D(), g("button", {
 			key: 0,
 			class: "tpl:flex tpl:w-full tpl:items-center tpl:gap-1.5 tpl:px-3 tpl:py-1.5 tpl:text-left tpl:text-xs tpl:transition-colors tpl:duration-100",
 			style: { color: "var(--tpl-text)" },
-			onClick: f[0] ||= (e) => r("select", null)
-		}, [u(E(I), {
+			onClick: n[0] ||= (e) => r("select", null)
+		}, [y(F(U), {
 			class: "tpl:shrink-0",
 			size: 14,
 			"stroke-width": 1.5
-		}), l(" " + C(E(i).mediaLibrary.moveToRoot), 1)])), (v(!0), s(e, null, x(d(t.folders), (e) => (v(), s("button", {
-			key: e.id,
+		}), v(" " + M(F(i).mediaLibrary.moveToRoot), 1)])), (D(!0), g(l, null, A(o(e.folders), (t) => (D(), g("button", {
+			key: t.id,
 			class: "tpl:flex tpl:w-full tpl:items-center tpl:gap-1.5 tpl:py-1.5 tpl:pr-3 tpl:text-left tpl:text-xs tpl:transition-colors tpl:duration-100",
-			style: g({
-				paddingLeft: `${e.depth * 16 + 12}px`,
-				color: e.id === t.currentFolderId ? "var(--tpl-text-dim)" : "var(--tpl-text)",
-				opacity: e.id === t.currentFolderId ? .5 : 1
+			style: T({
+				paddingLeft: `${t.depth * 16 + 12}px`,
+				color: t.id === e.currentFolderId ? "var(--tpl-text-dim)" : "var(--tpl-text)",
+				opacity: t.id === e.currentFolderId ? .5 : 1
 			}),
-			disabled: e.id === t.currentFolderId,
-			onClick: (t) => r("select", e.id)
+			disabled: t.id === e.currentFolderId,
+			onClick: (e) => r("select", t.id)
 		}, [
-			u(E(L), {
+			y(F(W), {
 				class: "tpl:shrink-0",
 				size: 14,
 				"stroke-width": 1.5
 			}),
-			c("span", hn, C(e.name), 1),
-			e.id === t.currentFolderId ? (v(), s("span", gn, C(E(i).mediaLibrary.currentFolder), 1)) : o("", !0)
-		], 12, mn))), 128))])], 512));
+			_("span", Ct, M(t.name), 1),
+			t.id === e.currentFolderId ? (D(), g("span", wt, M(F(i).mediaLibrary.currentFolder), 1)) : h("", !0)
+		], 12, St))), 128))])], 512));
 	}
-}), vn = { class: "tpl:flex tpl:items-center tpl:gap-3" }, yn = ["src", "alt"], bn = {
+}), Et = { class: "tpl:flex tpl:items-center tpl:gap-3" }, Dt = ["src", "alt"], Ot = {
 	key: 1,
 	class: "tpl:flex tpl:size-10 tpl:shrink-0 tpl:items-center tpl:justify-center tpl:overflow-hidden tpl:rounded",
 	style: { border: "1px solid var(--tpl-border)" }
-}, xn = { class: "tpl:min-w-0 tpl:flex-1" }, Sn = {
+}, kt = { class: "tpl:min-w-0 tpl:flex-1" }, At = {
 	class: "tpl:truncate tpl:text-xs tpl:font-medium",
 	style: { color: "var(--tpl-text)" }
-}, Cn = {
+}, jt = {
 	class: "tpl:mt-0.5 tpl:text-[10px]",
 	style: { color: "var(--tpl-text-muted)" }
-}, wn = /*#__PURE__*/ st(/* @__PURE__ */ d({
+}, Mt = /*#__PURE__*/ i(/* @__PURE__ */ x({
 	__name: "MediaPreviewPanel",
 	props: {
 		item: {},
 		folders: {}
 	},
-	setup(t) {
-		let n = t, i = p(me, null), { isImageMimeType: a } = $();
-		function d(e, t, n = []) {
+	setup(e) {
+		let n = e, r = C(t, null), { isImageMimeType: i } = o();
+		function a(e, t, n = []) {
 			for (let r of e) {
 				let e = [...n, r.name];
 				if (r.id === t) return e;
 				if (r.children.length) {
-					let n = d(r.children, t, e);
+					let n = a(r.children, t, e);
 					if (n) return n;
 				}
 			}
 			return null;
 		}
-		let f = r(() => {
+		let s = f(() => {
 			if (!n.item.folderId || !n.folders) return null;
-			let e = d(n.folders, n.item.folderId);
+			let e = a(n.folders, n.item.folderId);
 			return e ? e.join("/") : null;
-		}), m = r(() => n.item.mimeType ?? ""), g = r(() => a(m.value));
-		function _(e) {
+		}), c = f(() => n.item.mimeType ?? ""), u = f(() => i(c.value));
+		function d(e) {
 			return e < 1024 ? `${e} B` : e < 1048576 ? `${(e / 1024).toFixed(1)} KB` : `${(e / 1048576).toFixed(1)} MB`;
 		}
-		function y(e) {
-			return Ct(e, i?.value, {
+		function p(e) {
+			return Pe(e, r?.value, {
 				year: "numeric",
 				month: "short",
 				day: "numeric"
 			});
 		}
-		let b = r(() => n.item.filename || n.item.url);
-		return (n, r) => (v(), s("div", vn, [g.value ? (v(), s("img", {
+		let m = f(() => n.item.filename || n.item.url);
+		return (t, n) => (D(), g("div", Et, [u.value ? (D(), g("img", {
 			key: 0,
-			src: t.item.url,
-			alt: t.item.alt || b.value,
+			src: e.item.url,
+			alt: e.item.alt || m.value,
 			class: "tpl:size-10 tpl:shrink-0 tpl:rounded tpl:object-cover",
 			style: { border: "1px solid var(--tpl-border)" }
-		}, null, 8, yn)) : (v(), s("div", bn, [u(St, {
-			"mime-type": m.value,
+		}, null, 8, Dt)) : (D(), g("div", Ot, [y(Ne, {
+			"mime-type": c.value,
 			class: "tpl-preview-icon"
-		}, null, 8, ["mime-type"])])), c("div", xn, [
-			c("p", Sn, C(b.value), 1),
-			c("p", Cn, [
-				t.item.size == null ? o("", !0) : (v(), s(e, { key: 0 }, [l(C(_(t.item.size)), 1)], 64)),
-				t.item.createdAt ? (v(), s(e, { key: 1 }, [t.item.size == null ? o("", !0) : (v(), s(e, { key: 0 }, [l(" · ")], 64)), l(" " + C(y(t.item.createdAt)), 1)], 64)) : o("", !0),
-				g.value && t.item.width && t.item.height ? (v(), s(e, { key: 2 }, [l(" · " + C(t.item.width) + "×" + C(t.item.height) + "px ", 1)], 64)) : o("", !0),
-				f.value ? (v(), s(e, { key: 3 }, [
-					r[0] ||= l(" · ", -1),
-					u(E(L), {
+		}, null, 8, ["mime-type"])])), _("div", kt, [
+			_("p", At, M(m.value), 1),
+			_("p", jt, [
+				e.item.size == null ? h("", !0) : (D(), g(l, { key: 0 }, [v(M(d(e.item.size)), 1)], 64)),
+				e.item.createdAt ? (D(), g(l, { key: 1 }, [e.item.size == null ? h("", !0) : (D(), g(l, { key: 0 }, [v(" · ")], 64)), v(" " + M(p(e.item.createdAt)), 1)], 64)) : h("", !0),
+				u.value && e.item.width && e.item.height ? (D(), g(l, { key: 2 }, [v(" · " + M(e.item.width) + "×" + M(e.item.height) + "px ", 1)], 64)) : h("", !0),
+				s.value ? (D(), g(l, { key: 3 }, [
+					n[0] ||= v(" · ", -1),
+					y(F(W), {
 						class: "tpl:mb-px tpl:inline",
 						size: 9,
 						"stroke-width": 2
 					}),
-					l(" " + C(f.value), 1)
-				], 64)) : o("", !0)
+					v(" " + M(s.value), 1)
+				], 64)) : h("", !0)
 			]),
-			g.value ? (v(), s("p", {
+			u.value ? (D(), g("p", {
 				key: 0,
-				class: h(["tpl:mt-0.5 tpl:truncate tpl:text-[10px] tpl:italic", { "tpl:invisible": !t.item.alt }]),
+				class: w(["tpl:mt-0.5 tpl:truncate tpl:text-[10px] tpl:italic", { "tpl:invisible": !e.item.alt }]),
 				style: { color: "var(--tpl-text-dim)" }
-			}, C(t.item.alt || "\xA0"), 3)) : o("", !0)
+			}, M(e.item.alt || "\xA0"), 3)) : h("", !0)
 		])]));
 	}
-}), [["__scopeId", "data-v-c7fe5962"]]), Tn = ["data-tpl-theme"], En = {
-	class: "tpl:max-h-[90%] tpl:w-full tpl:max-w-sm tpl:overflow-y-auto tpl:rounded-lg tpl:p-5 tpl:shadow-xl",
-	style: { "background-color": "var(--tpl-bg-elevated)" }
-}, Dn = {
+}), [["__scopeId", "data-v-c7fe5962"]]), Nt = ["data-tpl-theme"], Pt = {
+	id: "tpl-media-replace-title",
 	class: "tpl:mb-2 tpl:text-sm tpl:font-semibold",
 	style: { color: "var(--tpl-text)" }
-}, On = {
+}, Ft = {
 	class: "tpl:mb-2 tpl:text-xs",
 	style: { color: "var(--tpl-text-muted)" }
-}, kn = {
+}, It = {
 	key: 0,
 	class: "tpl:mb-3 tpl:text-xs",
-	style: { color: "var(--tpl-warning)" }
-}, An = {
+	style: { color: "var(--tpl-text-muted)" }
+}, Lt = {
 	class: "tpl:mb-3 tpl:rounded tpl:border tpl:p-2",
 	style: { "border-color": "var(--tpl-border)" }
-}, jn = {
+}, Rt = {
 	class: "tpl:truncate tpl:text-xs tpl:font-medium",
 	style: { color: "var(--tpl-text)" }
-}, Mn = { class: "tpl:mb-4" }, Nn = {
+}, zt = { class: "tpl:mb-4" }, Bt = {
 	class: "tpl:mb-1 tpl:block tpl:text-xs tpl:font-medium",
 	style: { color: "var(--tpl-text-muted)" }
-}, Pn = ["accept"], Fn = {
+}, Vt = [
+	"accept",
+	"aria-invalid",
+	"aria-describedby"
+], Ht = {
 	key: 1,
+	id: "tpl-media-replace-error",
+	role: "alert",
 	class: "tpl:mb-3 tpl:text-xs",
 	style: { color: "var(--tpl-danger)" }
-}, In = { class: "tpl:flex tpl:justify-end tpl:gap-2" }, Ln = ["disabled"], Rn = ["disabled"], zn = /* @__PURE__ */ d({
+}, Ut = { class: "tpl:flex tpl:justify-end tpl:gap-2" }, Wt = ["disabled"], Gt = ["disabled"], Kt = /* @__PURE__ */ x({
 	__name: "MediaReplaceModal",
 	props: {
 		visible: { type: Boolean },
@@ -1816,26 +1497,28 @@ var wt = { class: "tpl:p-4" }, Tt = {
 		error: {}
 	},
 	emits: ["replace", "close"],
-	setup(e, { emit: i }) {
-		let l = e, d = i, { t: f } = Q(), m = p(Z, null), h = p(fe, b(null)), g = b(null), _ = b(null), y = r(() => {
-			if (!l.item) return "";
-			let e = (l.item.filename ?? "").split(".");
+	setup(e, { emit: t }) {
+		let i = e, o = t, { t: s } = n(), l = C(r, null), p = C(a, k(null)), v = k(null), b = k(null), x = f(() => {
+			if (!i.item) return "";
+			let e = (i.item.filename ?? "").split(".");
 			return e.length > 1 ? e[e.length - 1].toLowerCase() : "";
-		}), x = r(() => y.value ? `.${y.value}` : "*"), S = r(() => (l.usageInfo?.templateCount ?? 0) > 0);
-		O(() => l.visible, (e) => {
-			e || (_.value = null, g.value && (g.value.value = ""));
+		}), S = f(() => x.value ? `.${x.value}` : "*"), T = f(() => (i.usageInfo?.templateCount ?? 0) > 0);
+		L(() => i.visible, (e) => {
+			e || (b.value = null, v.value && (v.value.value = ""));
 		});
-		function w(e) {
+		function E(e) {
 			let t = e.target;
-			t.files && t.files.length > 0 && (_.value = t.files[0]);
+			t.files && t.files.length > 0 && (b.value = t.files[0]);
 		}
-		function T() {
-			_.value && d("replace", _.value);
+		function O() {
+			b.value && o("replace", b.value);
 		}
-		function D(e) {
-			e.key === "Escape" && d("close");
+		let A = k(null), j = f(() => i.visible && i.item !== null);
+		c(A, j);
+		function N(e) {
+			e.stopPropagation(), e.key === "Escape" && o("close");
 		}
-		return (r, i) => (v(), a(t, { to: E(h) || "body" }, [u(n, {
+		return (t, n) => (D(), m(u, { to: F(p) || "body" }, [y(d, {
 			"enter-active-class": "tpl:transition tpl:ease-out tpl:duration-150",
 			"enter-from-class": "tpl:opacity-0",
 			"enter-to-class": "tpl:opacity-100",
@@ -1843,33 +1526,43 @@ var wt = { class: "tpl:p-4" }, Tt = {
 			"leave-from-class": "tpl:opacity-100",
 			"leave-to-class": "tpl:opacity-0"
 		}, {
-			default: k(() => [e.visible && e.item ? (v(), s("div", {
+			default: R(() => [e.visible && e.item ? (D(), g("div", {
 				key: 0,
-				"data-tpl-theme": E(m),
-				class: "tpl tpl:fixed tpl:inset-0 tpl:z-10 tpl:flex tpl:items-center tpl:justify-center tpl:p-4",
+				"data-tpl-theme": F(l),
+				class: w([F(p) ? void 0 : "tpl", "tpl:fixed tpl:inset-0 tpl:z-10 tpl:flex tpl:items-center tpl:justify-center tpl:p-4"]),
 				style: { "background-color": "var(--tpl-overlay)" },
-				onClick: i[1] ||= M((e) => d("close"), ["self"]),
-				onKeydown: D
-			}, [c("div", En, [
-				c("h3", Dn, C(E(f).mediaLibrary.replaceWarningTitle), 1),
-				c("p", On, C(E(f).mediaLibrary.replaceWarningMessage.replace("{extension}", `.${y.value}`)), 1),
-				S.value ? (v(), s("p", kn, C(E(f).mediaLibrary.replaceWarningUsageNote.replace("{count}", e.usageInfo.templateCount.toString())), 1)) : o("", !0),
-				c("div", An, [c("p", jn, C(e.item.filename), 1)]),
-				c("div", Mn, [c("label", Nn, C(E(f).mediaLibrary.replaceSelectFile), 1), c("input", {
+				onClick: n[1] ||= V((e) => o("close"), ["self"]),
+				onKeydown: N
+			}, [_("div", {
+				ref_key: "dialogRef",
+				ref: A,
+				role: "dialog",
+				"aria-modal": "true",
+				"aria-labelledby": "tpl-media-replace-title",
+				class: "tpl:max-h-[90%] tpl:w-full tpl:max-w-sm tpl:overflow-y-auto tpl:rounded-lg tpl:p-5 tpl:shadow-xl",
+				style: { "background-color": "var(--tpl-bg-elevated)" }
+			}, [
+				_("h3", Pt, M(F(s).mediaLibrary.replaceWarningTitle), 1),
+				_("p", Ft, M(F(s).mediaLibrary.replaceWarningMessage.replace("{extension}", `.${x.value}`)), 1),
+				T.value ? (D(), g("p", It, M(F(s).mediaLibrary.replaceWarningUsageNote.replace("{count}", e.usageInfo.templateCount.toString())), 1)) : h("", !0),
+				_("div", Lt, [_("p", Rt, M(e.item.filename), 1)]),
+				_("div", zt, [_("label", Bt, M(F(s).mediaLibrary.replaceSelectFile), 1), _("input", {
 					ref_key: "fileInputRef",
-					ref: g,
+					ref: v,
 					type: "file",
-					accept: x.value,
+					accept: S.value,
+					"aria-invalid": !!e.error,
+					"aria-describedby": e.error ? "tpl-media-replace-error" : void 0,
 					class: "tpl:w-full tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs",
 					style: {
 						"border-color": "var(--tpl-border)",
 						"background-color": "var(--tpl-bg)",
 						color: "var(--tpl-text)"
 					},
-					onChange: w
-				}, null, 40, Pn)]),
-				e.error ? (v(), s("p", Fn, C(e.error), 1)) : o("", !0),
-				c("div", In, [c("button", {
+					onChange: E
+				}, null, 40, Vt)]),
+				e.error ? (D(), g("p", Ht, M(e.error), 1)) : h("", !0),
+				_("div", Ut, [_("button", {
 					class: "tpl:cursor-pointer tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
 					style: {
 						"border-color": "var(--tpl-border)",
@@ -1877,94 +1570,100 @@ var wt = { class: "tpl:p-4" }, Tt = {
 						"background-color": "var(--tpl-bg)"
 					},
 					disabled: e.isReplacing,
-					onClick: i[0] ||= (e) => d("close")
-				}, C(E(f).mediaLibrary.cancel), 9, Ln), c("button", {
-					class: "tpl:cursor-pointer tpl:rounded-md tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:text-white tpl:transition-all tpl:duration-150 tpl:disabled:cursor-not-allowed tpl:disabled:opacity-50",
-					style: { background: "linear-gradient(\n                  135deg,\n                  var(--tpl-primary),\n                  var(--tpl-primary-hover)\n                )" },
-					disabled: !_.value || e.isReplacing,
-					onClick: T
-				}, C(e.isReplacing ? E(f).mediaLibrary.replacing : E(f).mediaLibrary.replace), 9, Rn)])
-			])], 40, Tn)) : o("", !0)]),
+					onClick: n[0] ||= (e) => o("close")
+				}, M(F(s).mediaLibrary.cancel), 9, Wt), _("button", {
+					class: "tpl:cursor-pointer tpl:rounded-md tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150 tpl:hover:bg-[var(--tpl-primary-hover)] tpl:disabled:cursor-not-allowed tpl:disabled:opacity-50",
+					style: {
+						"background-color": "var(--tpl-primary)",
+						color: "var(--tpl-on-primary)"
+					},
+					disabled: !b.value || e.isReplacing,
+					onClick: O
+				}, M(e.isReplacing ? F(s).mediaLibrary.replacing : F(s).mediaLibrary.replace), 9, Gt)])
+			], 512)], 42, Nt)) : h("", !0)]),
 			_: 1
 		})], 8, ["to"]));
 	}
-}), Bn = {
+}), qt = ["aria-label", "aria-busy"], Jt = {
 	key: 0,
 	class: "tpl:flex tpl:items-center tpl:gap-2"
-}, Vn = {
+}, Yt = {
 	class: "tpl:text-xs",
 	style: { color: "var(--tpl-text-muted)" }
-}, Hn = {
+}, Xt = {
 	class: "tpl:text-xs",
 	style: { color: "var(--tpl-text-muted)" }
-}, Un = {
+}, Zt = {
 	class: "tpl:mt-1 tpl:text-[10px]",
 	style: { color: "var(--tpl-text-dim)" }
-}, Wn = /* @__PURE__ */ d({
+}, Qt = /* @__PURE__ */ x({
 	__name: "MediaUploadZone",
 	props: {
 		isUploading: { type: Boolean },
 		uploadProgress: {}
 	},
 	emits: ["upload"],
-	setup(t, { emit: n }) {
-		let r = n, { t: i, format: a } = Q(), { allAcceptedInputString: o, isAcceptedFile: l } = $(), d = b();
-		function f(e) {
+	setup(e, { emit: t }) {
+		let r = t, { t: i, format: a } = n(), { allAcceptedInputString: s, isAcceptedFile: c } = o(), u = k();
+		function d(e) {
 			let t = [];
-			for (let n of Array.from(e)) l(n) && t.push(n);
+			for (let n of Array.from(e)) c(n) && t.push(n);
 			return t;
 		}
-		function p(e) {
-			let t = f(e);
+		function f(e) {
+			let t = d(e);
 			t.length && r("upload", t);
 		}
-		let { isOverDropZone: m } = ae(d, { onDrop: (e) => {
-			e?.length && p(e);
-		} }), { open: g, onChange: _ } = se({
-			accept: o.value,
+		let { isOverDropZone: p } = ue(u, { onDrop: (e) => {
+			e?.length && f(e);
+		} }), { open: m, onChange: h } = fe({
+			accept: s.value,
 			multiple: !0
 		});
-		return _((e) => {
-			e?.length && p(e);
-		}), (n, r) => (v(), s("div", {
+		return h((e) => {
+			e?.length && f(e);
+		}), (t, n) => (D(), g("button", {
 			ref_key: "dropZoneRef",
-			ref: d,
+			ref: u,
+			type: "button",
 			"data-testid": "media-upload-zone",
-			class: h(["tpl-upload-zone tpl:flex tpl:cursor-pointer tpl:flex-col tpl:items-center tpl:justify-center tpl:rounded-lg tpl:border-2 tpl:border-dashed tpl:p-5 tpl:text-center tpl:transition-all tpl:duration-150", E(m) ? "tpl-upload-zone-active" : ""]),
+			class: w(["tpl-upload-zone tpl:flex tpl:w-full tpl:cursor-pointer tpl:flex-col tpl:items-center tpl:justify-center tpl:rounded-lg tpl:border-2 tpl:border-dashed tpl:p-5 tpl:text-center tpl:transition-all tpl:duration-150", F(p) ? "tpl-upload-zone-active" : ""]),
+			"aria-label": F(i).mediaLibrary.dropOrClick,
+			"aria-busy": e.isUploading,
 			style: {
 				"border-color": "var(--tpl-border-light)",
 				"background-color": "var(--tpl-bg)"
 			},
-			onClick: r[0] ||= (e) => E(g)()
-		}, [t.isUploading ? (v(), s("div", Bn, [u(E(V), {
+			onClick: n[0] ||= (e) => F(m)()
+		}, [e.isUploading ? (D(), g("div", Jt, [y(F(K), {
 			class: "tpl-spinner",
 			size: 20,
 			"stroke-width": 2,
 			style: { color: "var(--tpl-primary)" }
-		}), c("span", Vn, C(t.uploadProgress && t.uploadProgress.total > 1 ? E(a)(E(i).mediaLibrary.uploadingProgress, {
-			current: t.uploadProgress.current,
-			total: t.uploadProgress.total
-		}) : E(i).mediaLibrary.uploading), 1)])) : (v(), s(e, { key: 1 }, [
-			u(E(q), {
+		}), _("span", Yt, M(e.uploadProgress && e.uploadProgress.total > 1 ? F(a)(F(i).mediaLibrary.uploadingProgress, {
+			current: e.uploadProgress.current,
+			total: e.uploadProgress.total
+		}) : F(i).mediaLibrary.uploading), 1)])) : (D(), g(l, { key: 1 }, [
+			y(F(Z), {
 				class: "tpl:mb-2",
 				size: 24,
 				"stroke-width": 1.5,
 				style: { color: "var(--tpl-text-dim)" }
 			}),
-			c("p", Hn, C(E(i).mediaLibrary.dropOrClick), 1),
-			c("p", Un, C(E(i).mediaLibrary.acceptedFormats), 1)
-		], 64))], 2));
+			_("p", Xt, M(F(i).mediaLibrary.dropOrClick), 1),
+			_("p", Zt, M(F(i).mediaLibrary.acceptedFormats), 1)
+		], 64))], 10, qt));
 	}
-}), Gn = [
+}), $t = ["aria-label"], en = [
 	"width",
 	"height",
 	"viewBox"
-], Kn = [
+], tn = [
 	"cx",
 	"cy",
 	"r",
 	"stroke-width"
-], qn = [
+], nn = [
 	"cx",
 	"cy",
 	"r",
@@ -1972,14 +1671,14 @@ var wt = { class: "tpl:p-4" }, Tt = {
 	"stroke",
 	"stroke-dasharray",
 	"stroke-dashoffset"
-], Jn = {
+], rn = {
 	key: 0,
 	class: "tpl:absolute tpl:top-full tpl:left-1/2 tpl:z-50 tpl:mt-2 tpl:-translate-x-1/2 tpl:rounded-md tpl:px-2.5 tpl:py-1.5 tpl:text-xs tpl:whitespace-nowrap tpl:shadow-lg",
 	style: {
 		"background-color": "var(--tpl-text)",
 		color: "var(--tpl-bg-elevated)"
 	}
-}, Yn = /* @__PURE__ */ d({
+}, an = /* @__PURE__ */ x({
 	__name: "StorageProgressRing",
 	props: {
 		usedBytes: {},
@@ -1987,8 +1686,8 @@ var wt = { class: "tpl:p-4" }, Tt = {
 		size: {}
 	},
 	setup(e) {
-		let t = e, { t: i, format: a } = Q(), d = b(!1), f = r(() => t.size ?? 24), p = r(() => Math.max(2, f.value / 8)), m = r(() => (f.value - p.value) / 2), h = r(() => 2 * Math.PI * m.value), g = r(() => t.limitBytes <= 0 ? 0 : Math.min(100, t.usedBytes / t.limitBytes * 100)), _ = r(() => h.value - g.value / 100 * h.value), y = r(() => g.value >= 95 ? "var(--tpl-danger)" : g.value >= 75 ? "var(--tpl-warning, #f59e0b)" : "var(--tpl-primary)");
-		function x(e) {
+		let t = e, { t: r, format: i } = n(), a = k(!1), o = f(() => t.size ?? 24), s = f(() => Math.max(2, o.value / 8)), c = f(() => (o.value - s.value) / 2), l = f(() => 2 * Math.PI * c.value), u = f(() => t.limitBytes <= 0 ? 0 : Math.min(100, t.usedBytes / t.limitBytes * 100)), p = f(() => l.value - u.value / 100 * l.value), m = f(() => u.value >= 95 ? "var(--tpl-danger)" : u.value >= 75 ? "var(--tpl-warning)" : "var(--tpl-primary)");
+		function b(e) {
 			if (e === 0) return "0 B";
 			let t = 1024, n = [
 				"B",
@@ -1998,40 +1697,44 @@ var wt = { class: "tpl:p-4" }, Tt = {
 			], r = Math.floor(Math.log(e) / Math.log(t)), i = e / t ** r, a = +(r >= 2);
 			return `${i.toFixed(a)} ${n[r]}`;
 		}
-		let S = r(() => x(t.usedBytes)), w = r(() => x(t.limitBytes)), T = r(() => Math.max(0, t.limitBytes - t.usedBytes)), E = r(() => x(T.value)), D = r(() => a(i.mediaLibrary.storageTooltip, {
-			used: S.value,
-			total: w.value,
-			remaining: E.value
+		let x = f(() => b(t.usedBytes)), S = f(() => b(t.limitBytes)), C = f(() => Math.max(0, t.limitBytes - t.usedBytes)), w = f(() => b(C.value)), T = f(() => i(r.mediaLibrary.storageTooltip, {
+			used: x.value,
+			total: S.value,
+			remaining: w.value
 		}));
-		return (e, t) => (v(), s("div", {
+		return (e, t) => (D(), g("div", {
 			"data-testid": "media-storage-ring",
 			class: "tpl:relative tpl:inline-flex tpl:cursor-help tpl:items-center tpl:justify-center",
-			onMouseenter: t[0] ||= (e) => d.value = !0,
-			onMouseleave: t[1] ||= (e) => d.value = !1
-		}, [(v(), s("svg", {
-			width: f.value,
-			height: f.value,
+			tabindex: "0",
+			"aria-label": T.value,
+			onMouseenter: t[0] ||= (e) => a.value = !0,
+			onMouseleave: t[1] ||= (e) => a.value = !1,
+			onFocus: t[2] ||= (e) => a.value = !0,
+			onBlur: t[3] ||= (e) => a.value = !1
+		}, [(D(), g("svg", {
+			width: o.value,
+			height: o.value,
 			class: "tpl:-rotate-90",
-			viewBox: `0 0 ${f.value} ${f.value}`
-		}, [c("circle", {
-			cx: f.value / 2,
-			cy: f.value / 2,
-			r: m.value,
+			viewBox: `0 0 ${o.value} ${o.value}`
+		}, [_("circle", {
+			cx: o.value / 2,
+			cy: o.value / 2,
+			r: c.value,
 			fill: "none",
-			"stroke-width": p.value,
+			"stroke-width": s.value,
 			style: { stroke: "var(--tpl-border)" }
-		}, null, 8, Kn), c("circle", {
-			cx: f.value / 2,
-			cy: f.value / 2,
-			r: m.value,
+		}, null, 8, tn), _("circle", {
+			cx: o.value / 2,
+			cy: o.value / 2,
+			r: c.value,
 			fill: "none",
-			"stroke-width": p.value,
-			stroke: y.value,
+			"stroke-width": s.value,
+			stroke: m.value,
 			"stroke-linecap": "round",
-			"stroke-dasharray": h.value,
-			"stroke-dashoffset": _.value,
+			"stroke-dasharray": l.value,
+			"stroke-dashoffset": p.value,
 			class: "tpl:transition-all tpl:duration-300 tpl:ease-out"
-		}, null, 8, qn)], 8, Gn)), u(n, {
+		}, null, 8, nn)], 8, en)), y(d, {
 			"enter-active-class": "tpl:transition tpl:ease-out tpl:duration-150",
 			"enter-from-class": "tpl:opacity-0 tpl:translate-y-1",
 			"enter-to-class": "tpl:opacity-100 tpl:translate-y-0",
@@ -2039,17 +1742,17 @@ var wt = { class: "tpl:p-4" }, Tt = {
 			"leave-from-class": "tpl:opacity-100 tpl:translate-y-0",
 			"leave-to-class": "tpl:opacity-0 tpl:translate-y-1"
 		}, {
-			default: k(() => [d.value ? (v(), s("div", Jn, [l(C(D.value) + " ", 1), t[2] ||= c("div", {
+			default: R(() => [a.value ? (D(), g("div", rn, [v(M(T.value) + " ", 1), t[4] ||= _("div", {
 				class: "tpl:absolute tpl:-top-1 tpl:left-1/2 tpl:size-2 tpl:-translate-x-1/2 tpl:rotate-45",
 				style: { "background-color": "var(--tpl-text)" }
-			}, null, -1)])) : o("", !0)]),
+			}, null, -1)])) : h("", !0)]),
 			_: 1
-		})], 32));
+		})], 40, $t));
 	}
 });
 //#endregion
 //#region src/utils/treeFolders.ts
-function Xn(e) {
+function on(e) {
 	let t = /* @__PURE__ */ new Map();
 	for (let n of e) t.set(n.id, {
 		...n,
@@ -2064,819 +1767,302 @@ function Xn(e) {
 }
 //#endregion
 //#region src/composables/useMediaLibraryUI.ts
-function Zn(e) {
+function sn(e) {
 	let { library: t, translations: n } = e;
-	function i() {
+	function r() {
 		return "value" in n && typeof n.value == "object" ? n.value : n;
 	}
-	let a = b("grid"), o = b(!1), s = b(""), c = b(null), l = b(!1), u = b(!1), d = r(() => t.previewItem.value?.url ?? null), f = r(() => t.frequentlyUsedItems.value.length > 0), p = r(() => t.viewMode.value === "frequently-used" ? t.frequentlyUsedItems.value : t.items.value), m = r(() => Object.values(t.deleteUsageInfo.value).some((e) => e.templateCount > 0)), h = r(() => Xn(t.folders.value)), g = {
-		images: () => i().mediaLibrary.filterImages,
-		documents: () => i().mediaLibrary.filterDocuments,
-		videos: () => i().mediaLibrary.filterVideos,
-		audio: () => i().mediaLibrary.filterAudio
+	let i = k("grid"), a = k(!1), o = k(""), s = k(null), c = k(!1), l = k(!1), u = f(() => t.previewItem.value?.url ?? null), d = f(() => t.frequentlyUsedItems.value.length > 0), p = f(() => t.viewMode.value === "frequently-used" ? t.frequentlyUsedItems.value : t.items.value), m = f(() => Object.values(t.deleteUsageInfo.value).some((e) => e.templateCount > 0)), h = f(() => on(t.folders.value)), g = {
+		images: () => r().mediaLibrary.filterImages,
+		documents: () => r().mediaLibrary.filterDocuments,
+		videos: () => r().mediaLibrary.filterVideos,
+		audio: () => r().mediaLibrary.filterAudio
 	};
 	function _(e) {
 		return g[e]?.() ?? e;
 	}
-	O(o, (e) => {
+	L(a, (e) => {
 		e && t.loadFolders();
 	});
-	let v = ie((e) => {
+	let v = le((e) => {
 		t.search(e);
 	}, 300);
 	function y(e) {
-		s.value = e, v(e);
+		o.value = e, v(e);
 	}
-	let { copy: x, copied: S } = Y({
+	let { copy: b, copied: x } = ce({
 		copiedDuring: 2e3,
 		legacy: !0
 	});
-	async function C(e) {
+	async function S(e) {
 		await t.uploadFiles(e);
 	}
-	function w(e) {
+	function C(e) {
 		t.selectItem(e);
 	}
-	async function T(e, n) {
+	async function w(e, n) {
 		await t.createFolder(e, n);
 	}
-	async function E(e, n) {
+	async function T(e, n) {
 		await t.renameFolder(e, n);
 	}
-	async function D(e) {
+	async function E(e) {
 		await t.deleteFolder(e);
 	}
-	function k(e) {
-		c.value = e;
+	function D(e) {
+		s.value = e;
 	}
-	async function A(e, n, r, i) {
-		i && await t.replaceMediaDirectly(e, i.file), await t.updateFile(e, n, r), c.value = null;
+	async function O(e, n, r, i) {
+		i && await t.replaceMediaDirectly(e, i.file), await t.updateFile(e, n, r), s.value = null;
 	}
-	async function j(e) {
-		await t.importFromUrl(e) && (l.value = !1);
+	async function A(e) {
+		await t.importFromUrl(e) && (c.value = !1);
 	}
-	async function M(e) {
-		u.value = !1, await t.moveSelected(e);
+	async function j(e) {
+		l.value = !1, await t.moveSelected(e);
 	}
-	async function N() {
+	async function M() {
 		await t.checkUsageBeforeDelete();
 	}
-	function P(e) {
+	function N(e) {
 		t.checkUsageBeforeReplace(e);
 	}
-	async function F(e) {
+	async function P(e) {
 		await t.replaceFile(e);
 	}
-	function I() {
-		t.clearSelection(), t.cancelDelete(), t.cancelReplace(), s.value = "", t.searchQuery.value = "", t.categoryFilter.value = null, t.sortOption.value = "newest", t.viewMode.value = "files", c.value = null, l.value = !1;
+	function F() {
+		t.clearSelection(), t.cancelDelete(), t.cancelReplace(), o.value = "", t.searchQuery.value = "", t.categoryFilter.value = null, t.sortOption.value = "newest", t.viewMode.value = "files", s.value = null, c.value = !1;
 	}
 	return {
-		layoutMode: a,
-		showSidebar: o,
-		searchInput: s,
-		editingItem: c,
-		showImportUrlModal: l,
-		showMovePicker: u,
-		selectedUrl: d,
-		hasFrequentlyUsed: f,
+		layoutMode: i,
+		showSidebar: a,
+		searchInput: o,
+		editingItem: s,
+		showImportUrlModal: c,
+		showMovePicker: l,
+		selectedUrl: u,
+		hasFrequentlyUsed: d,
 		displayItems: p,
 		hasUsedFiles: m,
 		folderTree: h,
-		copy: x,
-		copied: S,
+		copy: b,
+		copied: x,
 		getCategoryLabel: _,
 		handleSearchInput: y,
-		handleUpload: C,
-		handleSelect: w,
-		handleCreateFolder: T,
-		handleRenameFolder: E,
-		handleDeleteFolder: D,
-		handleEditItem: k,
-		handleEditSave: A,
-		handleImportFromUrl: j,
-		handleMoveToFolder: M,
-		handleDeleteClick: N,
-		handleReplaceItem: P,
-		handleReplaceFile: F,
-		resetUI: I
+		handleUpload: S,
+		handleSelect: C,
+		handleCreateFolder: w,
+		handleRenameFolder: T,
+		handleDeleteFolder: E,
+		handleEditItem: D,
+		handleEditSave: O,
+		handleImportFromUrl: A,
+		handleMoveToFolder: j,
+		handleDeleteClick: M,
+		handleReplaceItem: N,
+		handleReplaceFile: P,
+		resetUI: F
 	};
 }
 //#endregion
-//#region src/i18n/index.ts
-var Qn = /* #__PURE__ */ Object.assign({
-	"./locales/ca.ts": () => import("./ca-CGf3MuE2.js"),
-	"./locales/de.ts": () => import("./de-D5ebAV5i.js"),
-	"./locales/en.ts": () => Promise.resolve().then(() => he),
-	"./locales/es.ts": () => import("./es-BG--QNW0.js"),
-	"./locales/fr.ts": () => import("./fr-Mdi4AlCR.js"),
-	"./locales/nl.ts": () => import("./nl-D-6hT8te.js"),
-	"./locales/pt-BR.ts": () => import("./pt-BR-DMfAgDWi.js")
-});
-function $n(e) {
-	return Object.keys(e).map((e) => e.match(/\/([^/]+)\.ts$/)?.[1]).filter((e) => !!e);
-}
-var er = $n(Qn);
-function tr(e) {
-	return e.trim().replace(/_/g, "-").toLowerCase();
-}
-function nr(e) {
-	let t = tr(e);
-	return er.find((e) => tr(e) === t);
-}
-function rr(e) {
-	return tr(e).split("-")[0];
-}
-function ir(e) {
-	return nr(e) ?? nr(rr(e)) ?? "en";
-}
-async function ar(e) {
-	let t = Qn[`./locales/${ir(e)}.ts`];
-	return (await t()).default;
-}
-//#endregion
-//#region src/components/MediaLibraryModal.vue?vue&type=script&setup=true&lang.ts
-var or = ["data-tpl-theme"], sr = {
-	class: "tpl-media-modal tpl-scale-in tpl:flex tpl:flex-col tpl:overflow-hidden tpl:rounded-[var(--tpl-radius-lg)]",
-	style: {
-		width: "900px",
-		height: "650px",
-		"max-width": "100%",
-		"max-height": "90%",
-		"background-color": "var(--tpl-bg-elevated)",
-		border: "1px solid var(--tpl-border)",
-		"box-shadow": "var(--tpl-shadow-xl)"
-	}
-}, cr = {
+//#region src/components/MediaLibraryChrome.vue?vue&type=script&setup=true&lang.ts
+var cn = { class: "tpl:relative tpl:flex tpl:min-h-0 tpl:flex-1 tpl:flex-col tpl:overflow-hidden" }, ln = {
 	class: "tpl:flex tpl:shrink-0 tpl:items-center tpl:justify-between tpl:border-b tpl:px-5 tpl:py-3.5",
 	style: { "border-color": "var(--tpl-border)" }
-}, lr = {
+}, un = {
+	id: "tpl-media-library-title",
 	class: "tpl:text-sm tpl:font-semibold",
 	style: { color: "var(--tpl-text)" }
-}, ur = { class: "tpl:flex tpl:items-center tpl:gap-3" }, dr = { class: "tpl:relative" }, fr = [
+}, dn = { class: "tpl:flex tpl:items-center tpl:gap-3" }, fn = { class: "tpl:relative" }, pn = [
 	"value",
 	"disabled",
+	"aria-label",
 	"placeholder"
-], pr = { class: "tpl:flex tpl:min-h-0 tpl:flex-1 tpl:overflow-hidden" }, mr = {
+], mn = ["aria-label"], hn = { class: "tpl:flex tpl:min-h-0 tpl:flex-1 tpl:overflow-hidden" }, gn = {
 	key: 0,
 	class: "tpl:flex tpl:w-48 tpl:shrink-0 tpl:flex-col tpl:border-r",
 	style: {
 		"border-color": "var(--tpl-border)",
 		"background-color": "var(--tpl-bg)"
 	}
-}, hr = { class: "tpl:flex tpl:min-w-0 tpl:flex-1 tpl:flex-col" }, gr = {
+}, _n = { class: "tpl:flex tpl:min-w-0 tpl:flex-1 tpl:flex-col" }, vn = {
 	class: "tpl:flex tpl:shrink-0 tpl:items-center tpl:justify-between tpl:border-b tpl:px-4 tpl:py-2.5",
 	style: { "border-color": "var(--tpl-border)" }
-}, _r = { class: "tpl:flex tpl:items-center tpl:gap-2" }, vr = ["title"], yr = {
+}, yn = { class: "tpl:flex tpl:items-center tpl:gap-2" }, bn = [
+	"title",
+	"aria-label",
+	"aria-pressed"
+], xn = {
 	key: 1,
 	class: "tpl:text-xs tpl:font-medium",
 	style: { color: "var(--tpl-text)" }
-}, br = {
+}, Sn = {
 	class: "tpl:flex tpl:rounded-md tpl:p-0.5",
 	style: {
 		border: "1px solid var(--tpl-border)",
 		"background-color": "var(--tpl-bg)"
 	}
-}, xr = ["title"], Sr = ["title"], Cr = { class: "tpl:flex tpl:items-center tpl:gap-2" }, wr = ["value"], Tr = { value: "" }, Er = ["value"], Dr = { class: "tpl:min-h-0 tpl:flex-1 tpl:overflow-y-auto" }, Or = {
+}, Cn = [
+	"title",
+	"aria-label",
+	"aria-pressed"
+], wn = [
+	"title",
+	"aria-label",
+	"aria-pressed"
+], Tn = { class: "tpl:flex tpl:items-center tpl:gap-2" }, En = ["aria-label", "value"], Dn = { value: "" }, On = ["value"], kn = { class: "tpl:min-h-0 tpl:flex-1 tpl:overflow-y-auto" }, An = {
 	key: 0,
 	class: "tpl:px-4 tpl:pt-3"
-}, kr = {
+}, jn = {
 	class: "tpl-scale-in tpl:mx-4 tpl:w-full tpl:max-w-sm tpl:rounded-[var(--tpl-radius-lg)] tpl:p-5",
 	style: {
 		"background-color": "var(--tpl-bg-elevated)",
 		"box-shadow": "var(--tpl-shadow-xl)"
 	}
-}, Ar = {
+}, Mn = {
+	id: "tpl-media-delete-title",
 	class: "tpl:mb-2 tpl:text-sm tpl:font-semibold",
 	style: { color: "var(--tpl-text)" }
-}, jr = {
+}, Nn = {
 	key: 0,
 	"data-testid": "media-delete-usage",
 	class: "tpl:mb-4 tpl:text-xs",
 	style: { color: "var(--tpl-text-muted)" }
-}, Mr = {
+}, Pn = {
 	key: 1,
 	class: "tpl:mb-4 tpl:max-h-32 tpl:overflow-y-auto tpl:rounded tpl:border tpl:p-2",
 	style: { "border-color": "var(--tpl-border)" }
-}, Nr = { class: "tpl:font-medium" }, Pr = { style: { color: "var(--tpl-text-muted)" } }, Fr = { class: "tpl:flex tpl:justify-end tpl:gap-2" }, Ir = {
+}, Fn = { class: "tpl:font-medium" }, In = { style: { color: "var(--tpl-text-muted)" } }, Ln = { class: "tpl:flex tpl:justify-end tpl:gap-2" }, Rn = {
 	class: "tpl:flex tpl:shrink-0 tpl:items-center tpl:justify-between tpl:border-t tpl:px-5 tpl:py-3",
 	style: { "border-color": "var(--tpl-border)" }
-}, Lr = { class: "tpl:flex tpl:min-w-0 tpl:flex-1 tpl:items-center tpl:gap-3" }, Rr = { class: "tpl:flex tpl:items-center tpl:gap-5" }, zr = {
+}, zn = { class: "tpl:flex tpl:min-w-0 tpl:flex-1 tpl:items-center tpl:gap-3" }, Bn = { class: "tpl:flex tpl:items-center tpl:gap-5" }, Vn = {
 	key: 0,
 	class: "tpl:flex tpl:items-center tpl:gap-2"
-}, Br = {
+}, Hn = {
 	key: 1,
 	class: "tpl:relative"
-}, Vr = { class: "tpl:flex tpl:items-center tpl:gap-2" }, Hr = ["disabled"], Ur = /* @__PURE__ */ d({
-	__name: "MediaLibraryModal",
+}, Un = { class: "tpl:flex tpl:items-center tpl:gap-2" }, Wn = ["data-testid", "disabled"], Gn = /* @__PURE__ */ x({
+	__name: "MediaLibraryChrome",
 	props: {
-		visible: { type: Boolean },
 		provider: {},
 		accept: {},
-		popoverTarget: {},
-		locale: {},
-		uiTheme: {},
 		templateId: {},
-		onError: { type: Function }
+		onError: { type: Function },
+		translations: {},
+		showClose: { type: Boolean },
+		showConfirm: { type: Boolean },
+		confirmTestId: {}
 	},
-	emits: ["close", "select"],
-	setup(i, { emit: d }) {
-		let f = i, p = d, m = b(null);
-		O(() => f.locale, async (e) => {
-			m.value = await ar(e ?? "en");
-		}, { immediate: !0 }), y(pe, m);
-		let _ = r(() => m.value), S = r(() => f.uiTheme);
-		y(Z, S);
-		let T = w(() => f.popoverTarget ?? null);
-		y(fe, T), y(me, w(() => f.locale));
-		let D = {
+	emits: [
+		"close",
+		"confirm",
+		"ready"
+	],
+	setup(t, { expose: n, emit: r }) {
+		let i = t, a = r, s = b(() => import("./MediaEditModal-DltAfTVH.js")), c = f(() => i.translations), u = f(() => i.confirmTestId ?? "media-confirm"), p = {
 			get maxFileSize() {
-				return f.provider.maxFileSize;
+				return i.provider.maxFileSize;
 			},
 			get mimeTypes() {
-				return f.provider.mimeTypes;
+				return i.provider.mimeTypes;
 			},
 			get accept() {
-				return f.accept;
+				return i.accept;
 			}
 		};
-		y(de, D);
-		let { isAcceptedMimeType: A, availableCategories: j } = $(D), P = ue({
-			provider: f.provider,
-			templateId: () => f.templateId,
-			onError: (e) => f.onError?.(e)
-		}), I = Zn({
-			library: P,
-			translations: _
-		}), L = r(() => typeof f.provider.create == "function"), V = r(() => f.provider.folders !== !1), U = r(() => typeof f.provider.importFromUrl == "function"), W = r(() => typeof f.provider.delete == "function"), G = r(() => typeof f.provider.update == "function"), K = r(() => typeof f.provider.replace == "function"), te = r(() => typeof f.provider.frequentlyUsed == "function"), q = r(() => {
-			let e = f.provider.folders;
+		O(e, p);
+		let { isAcceptedMimeType: x, availableCategories: S } = o(p), C = me({
+			provider: i.provider,
+			templateId: () => i.templateId,
+			onError: (e) => i.onError?.(e)
+		}), k = sn({
+			library: C,
+			translations: c
+		}), j = f(() => typeof i.provider.create == "function"), N = f(() => i.provider.folders !== !1), P = f(() => typeof i.provider.importFromUrl == "function"), I = f(() => typeof i.provider.delete == "function"), z = f(() => typeof i.provider.update == "function"), B = f(() => typeof i.provider.replace == "function"), ee = f(() => typeof i.provider.frequentlyUsed == "function"), U = f(() => {
+			let e = i.provider.folders;
 			return e !== !1 && typeof e.move == "function";
-		}), re = r(() => {
-			let e = f.provider.folders;
+		}), W = f(() => {
+			let e = i.provider.folders;
 			return e !== !1 && typeof e.create == "function";
-		}), J = r(() => {
-			let e = f.provider.folders;
+		}), K = f(() => {
+			let e = i.provider.folders;
 			return e !== !1 && typeof e.update == "function";
-		}), Y = r(() => {
-			let e = f.provider.folders;
+		}), q = f(() => {
+			let e = i.provider.folders;
 			return e !== !1 && typeof e.delete == "function";
-		}), ie = r(() => P.isLoading.value && I.displayItems.value.length === 0), ae = r(() => {
-			let e = P.previewItem.value;
-			return e ? !f.accept?.length || A(e.mimeType ?? "", f.accept) : !1;
-		}), se = r(() => {
-			if (!W.value) return 0;
+		}), J = f(() => C.isLoading.value && k.displayItems.value.length === 0), Y = f(() => {
+			let e = C.previewItem.value;
+			return e ? !i.accept?.length || x(e.mimeType ?? "", i.accept) : !1;
+		}), oe = f(() => {
+			if (!I.value) return 0;
 			let e = 0;
-			for (let t of P.selectedItems.value) I.displayItems.value.find((e) => e.id === t)?.canDelete !== !1 && (e += 1);
+			for (let t of C.selectedItems.value) k.displayItems.value.find((e) => e.id === t)?.canDelete !== !1 && (e += 1);
 			return e;
-		});
-		O(() => f.visible, (e) => {
-			e ? (f.accept?.length === 1 && (P.categoryFilter.value = f.accept[0]), P.loadItems(), P.loadFrequentlyUsed(), P.loadStorage()) : I.resetUI();
-		}, { immediate: !0 });
-		function X(e) {
-			e.key === "Escape" && p("close");
+		}), X = f(() => k.showImportUrlModal.value || k.editingItem.value !== null || C.showReplaceWarning.value);
+		function Z() {
+			return X.value ? !0 : k.showMovePicker.value ? (k.showMovePicker.value = !1, !0) : C.showDeleteWarning.value ? (C.cancelDelete(), !0) : !1;
 		}
-		oe(document, "keydown", X);
-		function ce() {
-			ae.value && P.previewItem.value && (p("select", P.previewItem.value), p("close"));
+		function Q() {
+			Y.value && C.previewItem.value && a("confirm", C.previewItem.value);
 		}
-		function le(e) {
+		function ce(e) {
 			let t = e.target.value;
-			P.filterByCategory(t || null);
+			C.filterByCategory(t || null);
 		}
-		async function he() {
+		async function le() {
 			let e = /* @__PURE__ */ new Set();
-			for (let t of P.selectedItems.value) I.displayItems.value.find((e) => e.id === t)?.canDelete !== !1 && e.add(t);
-			P.selectedItems.value = e, await I.handleDeleteClick();
-		}
-		return (r, d) => (v(), a(t, { to: i.popoverTarget || "body" }, [u(n, {
-			"enter-active-class": "tpl:transition tpl:duration-200",
-			"enter-from-class": "tpl:opacity-0",
-			"enter-to-class": "tpl:opacity-100",
-			"leave-active-class": "tpl:transition tpl:duration-150",
-			"leave-from-class": "tpl:opacity-100",
-			"leave-to-class": "tpl:opacity-0"
-		}, {
-			default: k(() => [i.visible && m.value ? (v(), s("div", {
-				key: 0,
-				"data-testid": "media-library-modal",
-				"data-tpl-theme": S.value,
-				class: "tpl tpl-media-overlay tpl:fixed tpl:inset-0 tpl:z-10 tpl:flex tpl:items-center tpl:justify-center tpl:p-4",
-				onClick: d[14] ||= M((e) => p("close"), ["self"])
-			}, [c("div", sr, [
-				c("div", cr, [c("h2", lr, C(_.value.mediaLibrary.title), 1), c("div", ur, [
-					E(P).storageInfo.value ? (v(), a(Yn, {
-						key: 0,
-						"used-bytes": E(P).storageInfo.value.usedBytes,
-						"limit-bytes": E(P).storageInfo.value.limitBytes,
-						size: 22
-					}, null, 8, ["used-bytes", "limit-bytes"])) : o("", !0),
-					c("div", dr, [c("input", {
-						value: E(I).searchInput.value,
-						type: "text",
-						disabled: ie.value,
-						class: "tpl:w-52 tpl:rounded-md tpl:border tpl:py-1.5 tpl:pr-3 tpl:pl-8 tpl:text-xs tpl:shadow-xs tpl:transition-all tpl:duration-150 tpl:outline-none tpl:focus:shadow-[var(--tpl-ring)] tpl:disabled:cursor-not-allowed tpl:disabled:opacity-50",
-						style: {
-							"border-color": "var(--tpl-border)",
-							"background-color": "var(--tpl-bg)",
-							color: "var(--tpl-text)"
-						},
-						placeholder: _.value.mediaLibrary.searchPlaceholder,
-						onInput: d[0] ||= (e) => E(I).handleSearchInput(e.target.value)
-					}, null, 40, fr), u(E(ee), {
-						class: "tpl:absolute tpl:top-1/2 tpl:left-2.5 tpl:-translate-y-1/2",
-						size: 13,
-						"stroke-width": 2,
-						style: { color: "var(--tpl-text-dim)" }
-					})]),
-					c("button", {
-						class: "tpl:flex tpl:size-7 tpl:items-center tpl:justify-center tpl:rounded-md tpl:transition-all tpl:duration-150",
-						style: { color: "var(--tpl-text-muted)" },
-						onClick: d[1] ||= (e) => p("close")
-					}, [u(E(ne), {
-						size: 18,
-						"stroke-width": 2
-					})])
-				])]),
-				c("div", pr, [u(n, {
-					"enter-active-class": "tpl:transition-all tpl:duration-200 tpl:ease-out",
-					"enter-from-class": "tpl:-ml-48 tpl:opacity-0",
-					"enter-to-class": "tpl:ml-0 tpl:opacity-100",
-					"leave-active-class": "tpl:transition-all tpl:duration-150 tpl:ease-in",
-					"leave-from-class": "tpl:ml-0 tpl:opacity-100",
-					"leave-to-class": "tpl:-ml-48 tpl:opacity-0"
-				}, {
-					default: k(() => [V.value && E(I).showSidebar.value ? (v(), s("div", mr, [u(bt, {
-						folders: E(I).folderTree.value,
-						"current-folder-id": E(P).currentFolderId.value,
-						"view-mode": E(P).viewMode.value,
-						"has-frequently-used": te.value && E(I).hasFrequentlyUsed.value,
-						"can-create-folder": re.value,
-						"can-rename-folder": J.value,
-						"can-delete-folder": Y.value,
-						onNavigate: E(P).navigateToFolder,
-						onCreateFolder: E(I).handleCreateFolder,
-						onRenameFolder: E(I).handleRenameFolder,
-						onDeleteFolder: E(I).handleDeleteFolder,
-						onShowFrequentlyUsed: E(P).showFrequentlyUsed
-					}, null, 8, [
-						"folders",
-						"current-folder-id",
-						"view-mode",
-						"has-frequently-used",
-						"can-create-folder",
-						"can-rename-folder",
-						"can-delete-folder",
-						"onNavigate",
-						"onCreateFolder",
-						"onRenameFolder",
-						"onDeleteFolder",
-						"onShowFrequentlyUsed"
-					])])) : o("", !0)]),
-					_: 1
-				}), c("div", hr, [c("div", gr, [c("div", _r, [
-					V.value ? (v(), s("button", {
-						key: 0,
-						"data-testid": "media-folder-toggle",
-						class: "tpl:flex tpl:size-7 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded-md tpl:transition-all tpl:duration-150",
-						style: g({
-							color: E(I).showSidebar.value ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
-							backgroundColor: E(I).showSidebar.value ? "var(--tpl-bg)" : "transparent",
-							border: E(I).showSidebar.value ? "1px solid var(--tpl-border)" : "1px solid transparent"
-						}),
-						title: E(I).showSidebar.value ? _.value.mediaLibrary.hideFolders : _.value.mediaLibrary.showFolders,
-						onClick: d[2] ||= (e) => E(I).showSidebar.value = !E(I).showSidebar.value
-					}, [u(E(H), {
-						size: 16,
-						"stroke-width": 2
-					})], 12, vr)) : o("", !0),
-					E(P).viewMode.value === "frequently-used" ? (v(), s("span", yr, C(_.value.mediaLibrary.frequentlyUsed), 1)) : (v(), a(be, {
-						key: 2,
-						folders: E(I).folderTree.value,
-						"current-folder-id": E(P).currentFolderId.value,
-						onNavigate: E(P).navigateToFolder
-					}, null, 8, [
-						"folders",
-						"current-folder-id",
-						"onNavigate"
-					])),
-					c("div", br, [c("button", {
-						class: "tpl:flex tpl:size-6 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded tpl:transition-all tpl:duration-150",
-						style: g({
-							color: E(I).layoutMode.value === "grid" ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
-							backgroundColor: E(I).layoutMode.value === "grid" ? "var(--tpl-bg-elevated)" : "transparent"
-						}),
-						title: _.value.mediaLibrary.viewGrid,
-						onClick: d[3] ||= (e) => E(I).layoutMode.value = "grid"
-					}, [u(E(R), {
-						size: 14,
-						"stroke-width": 2
-					})], 12, xr), c("button", {
-						class: "tpl:flex tpl:size-6 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded tpl:transition-all tpl:duration-150",
-						style: g({
-							color: E(I).layoutMode.value === "list" ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
-							backgroundColor: E(I).layoutMode.value === "list" ? "var(--tpl-bg-elevated)" : "transparent"
-						}),
-						title: _.value.mediaLibrary.viewList,
-						onClick: d[4] ||= (e) => E(I).layoutMode.value = "list"
-					}, [u(E(B), {
-						size: 14,
-						"stroke-width": 2
-					})], 12, Sr)])
-				]), c("div", Cr, [E(j).length > 1 ? (v(), s("select", {
+			for (let t of C.selectedItems.value) k.displayItems.value.find((e) => e.id === t)?.canDelete !== !1 && e.add(t);
+			C.selectedItems.value = e, await k.handleDeleteClick();
+		}
+		return L(() => i.accept, (e) => {
+			e?.length === 1 && (C.categoryFilter.value = e[0]);
+		}, { immediate: !0 }), C.loadItems(), C.loadFrequentlyUsed(), C.loadStorage(), a("ready"), E(() => {
+			k.resetUI();
+		}), n({
+			nestedDialogOpen: X,
+			handleEscape: Z,
+			library: C,
+			ui: k
+		}), (e, n) => (D(), g("div", cn, [
+			_("div", ln, [_("h2", un, M(c.value.mediaLibrary.title), 1), _("div", dn, [
+				F(C).storageInfo.value ? (D(), m(an, {
 					key: 0,
-					class: "tpl:rounded-md tpl:border tpl:py-1.5 tpl:pr-7 tpl:pl-2.5 tpl:text-xs tpl:transition-all tpl:duration-150 tpl:outline-none",
+					"used-bytes": F(C).storageInfo.value.usedBytes,
+					"limit-bytes": F(C).storageInfo.value.limitBytes,
+					size: 22
+				}, null, 8, ["used-bytes", "limit-bytes"])) : h("", !0),
+				_("div", fn, [_("input", {
+					value: F(k).searchInput.value,
+					type: "search",
+					disabled: J.value,
+					"aria-label": c.value.mediaLibrary.searchAriaLabel,
+					class: "tpl:w-52 tpl:rounded-md tpl:border tpl:py-1.5 tpl:pr-3 tpl:pl-8 tpl:text-xs tpl:shadow-xs tpl:transition-all tpl:duration-150 tpl:outline-none tpl:focus:shadow-[var(--tpl-ring)] tpl:disabled:cursor-not-allowed tpl:disabled:opacity-50",
 					style: {
 						"border-color": "var(--tpl-border)",
 						"background-color": "var(--tpl-bg)",
 						color: "var(--tpl-text)"
 					},
-					value: E(P).categoryFilter.value ?? "",
-					onChange: le
-				}, [c("option", Tr, C(_.value.mediaLibrary.filterAll), 1), (v(!0), s(e, null, x(E(j), (e) => (v(), s("option", {
-					key: e,
-					value: e
-				}, C(E(I).getCategoryLabel(e)), 9, Er))), 128))], 40, wr)) : o("", !0)])]), c("div", Dr, [E(P).viewMode.value === "files" && (L.value || U.value) ? (v(), s("div", Or, [L.value ? (v(), a(Wn, {
-					key: 0,
-					"is-uploading": E(P).isUploading.value,
-					"upload-progress": E(P).uploadProgress.value,
-					onUpload: E(I).handleUpload
-				}, null, 8, [
-					"is-uploading",
-					"upload-progress",
-					"onUpload"
-				])) : o("", !0), U.value ? (v(), s("button", {
-					key: 1,
-					"data-testid": "media-import-url",
-					class: "tpl:mt-2 tpl:flex tpl:w-full tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded-md tpl:border tpl:border-dashed tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
-					style: {
-						"border-color": "var(--tpl-border)",
-						color: "var(--tpl-text-muted)",
-						"background-color": "var(--tpl-bg)"
-					},
-					onClick: d[5] ||= (e) => E(I).showImportUrlModal.value = !0
-				}, [u(E(z), {
-					size: 14,
-					"stroke-width": 2
-				}), l(" " + C(_.value.mediaLibrary.importFromUrl), 1)])) : o("", !0)])) : o("", !0), u($t, {
-					items: E(I).displayItems.value,
-					"selected-ids": E(P).selectedItems.value,
-					"is-loading": E(P).isLoading.value,
-					"has-more": E(P).viewMode.value === "files" && E(P).hasMore.value,
-					accept: i.accept,
-					layout: E(I).layoutMode.value,
-					"search-query": E(P).searchQuery.value,
-					"can-update": G.value,
-					"can-replace": K.value,
-					onSelect: E(I).handleSelect,
-					onToggle: E(P).toggleSelection,
-					onLoadMore: E(P).loadMore,
-					onEdit: E(I).handleEditItem,
-					onReplace: E(I).handleReplaceItem,
-					onConfirm: ce
-				}, null, 8, [
-					"items",
-					"selected-ids",
-					"is-loading",
-					"has-more",
-					"accept",
-					"layout",
-					"search-query",
-					"can-update",
-					"can-replace",
-					"onSelect",
-					"onToggle",
-					"onLoadMore",
-					"onEdit",
-					"onReplace"
-				])])])]),
-				u(fn, {
-					visible: E(I).showImportUrlModal.value,
-					"is-importing": E(P).isImportingFromUrl.value,
-					error: E(P).importFromUrlError.value,
-					onImport: E(I).handleImportFromUrl,
-					onClose: d[6] ||= (e) => E(I).showImportUrlModal.value = !1
-				}, null, 8, [
-					"visible",
-					"is-importing",
-					"error",
-					"onImport"
-				]),
-				u(ct, {
-					visible: !!E(I).editingItem.value,
-					item: E(I).editingItem.value,
-					onSave: E(I).handleEditSave,
-					onClose: d[7] ||= (e) => E(I).editingItem.value = null
-				}, null, 8, [
-					"visible",
-					"item",
-					"onSave"
-				]),
-				u(zn, {
-					visible: E(P).showReplaceWarning.value,
-					item: E(P).pendingReplaceItem.value,
-					"usage-info": E(P).replaceUsageInfo.value,
-					"is-replacing": E(P).isReplacing.value,
-					error: E(P).replaceError.value,
-					onReplace: E(I).handleReplaceFile,
-					onClose: E(P).cancelReplace
-				}, null, 8, [
-					"visible",
-					"item",
-					"usage-info",
-					"is-replacing",
-					"error",
-					"onReplace",
-					"onClose"
-				]),
-				u(n, {
-					"enter-active-class": "tpl:transition tpl:ease-out tpl:duration-150",
-					"enter-from-class": "tpl:opacity-0",
-					"enter-to-class": "tpl:opacity-100",
-					"leave-active-class": "tpl:transition tpl:ease-in tpl:duration-100",
-					"leave-from-class": "tpl:opacity-100",
-					"leave-to-class": "tpl:opacity-0"
-				}, {
-					default: k(() => [E(P).showDeleteWarning.value ? (v(), s("div", {
-						key: 0,
-						class: "tpl:absolute tpl:inset-0 tpl:z-10 tpl:flex tpl:items-center tpl:justify-center tpl:rounded-[var(--tpl-radius-lg)]",
-						style: {
-							"background-color": "var(--tpl-overlay)",
-							"backdrop-filter": "blur(8px)",
-							"-webkit-backdrop-filter": "blur(8px)"
-						},
-						onClick: d[10] ||= M((...e) => E(P).cancelDelete && E(P).cancelDelete(...e), ["self"])
-					}, [c("div", kr, [
-						c("h3", Ar, C(_.value.mediaLibrary.deleteWarningTitle), 1),
-						c("p", {
-							class: h(["tpl:text-xs", E(I).hasUsedFiles.value ? "tpl:mb-2" : "tpl:mb-4"]),
-							style: { color: "var(--tpl-text-muted)" }
-						}, C(_.value.mediaLibrary.deleteWarningMessage), 3),
-						E(I).hasUsedFiles.value ? (v(), s("p", jr, C(_.value.mediaLibrary.deleteWarningUsageNote), 1)) : o("", !0),
-						E(I).hasUsedFiles.value ? (v(), s("div", Mr, [(v(!0), s(e, null, x(E(P).deleteUsageInfo.value, (t, n) => (v(), s("div", {
-							key: n,
-							class: "tpl:text-xs",
-							style: { color: "var(--tpl-text)" }
-						}, [t.templateCount > 0 ? (v(), s(e, { key: 0 }, [c("span", Nr, C(E(I).displayItems.value.find((e) => e.id === n)?.filename || n), 1), c("span", Pr, " - " + C(_.value.mediaLibrary.usedInTemplates.replace("{count}", t.templateCount.toString())), 1)], 64)) : o("", !0)]))), 128))])) : o("", !0),
-						c("div", Fr, [c("button", {
-							class: "tpl:cursor-pointer tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
-							style: {
-								"border-color": "var(--tpl-border)",
-								color: "var(--tpl-text)",
-								"background-color": "var(--tpl-bg)"
-							},
-							onClick: d[8] ||= (...e) => E(P).cancelDelete && E(P).cancelDelete(...e)
-						}, C(_.value.mediaLibrary.cancel), 1), c("button", {
-							class: "tpl:cursor-pointer tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
-							style: {
-								"border-color": "var(--tpl-danger)",
-								color: "var(--tpl-danger)",
-								"background-color": "var(--tpl-danger-light)"
-							},
-							onClick: d[9] ||= (...e) => E(P).confirmDelete && E(P).confirmDelete(...e)
-						}, C(E(I).hasUsedFiles.value ? _.value.mediaLibrary.deleteAnyway : _.value.mediaLibrary.confirmDelete), 1)])
-					])])) : o("", !0)]),
-					_: 1
-				}),
-				c("div", Ir, [c("div", Lr, [E(P).previewItem.value ? (v(), a(wn, {
-					key: 0,
-					item: E(P).previewItem.value,
-					folders: E(I).folderTree.value
-				}, null, 8, ["item", "folders"])) : o("", !0)]), c("div", Rr, [E(P).selectedItems.value.size > 0 ? (v(), s("div", zr, [E(P).previewItem.value ? (v(), s("button", {
-					key: 0,
-					class: "tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-1 tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
-					style: g({
-						borderColor: E(I).copied.value ? "var(--tpl-success)" : "var(--tpl-border)",
-						color: E(I).copied.value ? "var(--tpl-success)" : "var(--tpl-text)",
-						backgroundColor: "var(--tpl-bg)"
-					}),
-					onClick: d[11] ||= (e) => E(I).copy(E(I).selectedUrl.value)
-				}, [E(I).copied.value ? (v(), a(E(N), {
+					placeholder: c.value.mediaLibrary.searchPlaceholder,
+					onInput: n[0] ||= (e) => F(k).handleSearchInput(e.target.value)
+				}, null, 40, pn), y(F(ae), {
+					class: "tpl:absolute tpl:top-1/2 tpl:left-2.5 tpl:-translate-y-1/2",
+					size: 13,
+					"stroke-width": 2,
+					style: { color: "var(--tpl-text-dim)" }
+				})]),
+				t.showClose ? (D(), g("button", {
 					key: 1,
-					size: 12,
-					"stroke-width": 2
-				})) : (v(), a(E(F), {
-					key: 0,
-					size: 12,
+					type: "button",
+					"aria-label": c.value.mediaLibrary.close,
+					class: "tpl:flex tpl:size-7 tpl:items-center tpl:justify-center tpl:rounded-md tpl:transition-all tpl:duration-150",
+					style: { color: "var(--tpl-text-muted)" },
+					onClick: n[1] ||= (e) => a("close")
+				}, [y(F(se), {
+					size: 18,
 					"stroke-width": 2
-				})), l(" " + C(E(I).copied.value ? _.value.mediaLibrary.copied : _.value.mediaLibrary.copyUrl), 1)], 4)) : o("", !0), q.value ? (v(), s("div", Br, [c("button", {
-					class: "tpl:cursor-pointer tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
-					style: {
-						"border-color": "var(--tpl-border)",
-						color: "var(--tpl-text)",
-						"background-color": "var(--tpl-bg)"
-					},
-					onClick: d[12] ||= (e) => E(I).showMovePicker.value = !E(I).showMovePicker.value
-				}, C(_.value.mediaLibrary.moveSelected), 1), E(I).showMovePicker.value ? (v(), a(_n, {
-					key: 0,
-					folders: E(I).folderTree.value,
-					"current-folder-id": E(P).currentFolderId.value,
-					onSelect: E(I).handleMoveToFolder,
-					onClose: d[13] ||= (e) => E(I).showMovePicker.value = !1
-				}, null, 8, [
-					"folders",
-					"current-folder-id",
-					"onSelect"
-				])) : o("", !0)])) : o("", !0)])) : o("", !0), c("div", Vr, [se.value > 0 ? (v(), s("button", {
-					key: 0,
-					"data-testid": "media-delete",
-					class: "tpl:cursor-pointer tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
-					style: {
-						"border-color": "var(--tpl-danger)",
-						color: "var(--tpl-danger)",
-						"background-color": "var(--tpl-danger-light)"
-					},
-					onClick: he
-				}, C(_.value.mediaLibrary.deleteSelected), 1)) : o("", !0), c("button", {
-					"data-testid": "media-confirm",
-					class: "tpl:cursor-pointer tpl:rounded-md tpl:px-4 tpl:py-1.5 tpl:text-sm tpl:font-medium tpl:shadow-xs tpl:transition-all tpl:duration-150 tpl:hover:opacity-90 tpl:disabled:cursor-not-allowed tpl:disabled:opacity-50",
-					style: {
-						"background-color": "var(--tpl-primary)",
-						color: "var(--tpl-bg)"
-					},
-					disabled: !ae.value,
-					onClick: ce
-				}, C(i.accept?.length ? _.value.mediaLibrary.selectImage : _.value.mediaLibrary.selectFile), 9, Hr)])])])
-			])], 8, or)) : o("", !0)]),
-			_: 1
-		})], 8, ["to"]));
-	}
-});
-//#endregion
-//#region src/composables/useMediaPicker.ts
-function Wr() {
-	let e = p("onRequestMedia"), t = b(!1), n = r(() => !!e);
-	async function i(n) {
-		if (!e) return null;
-		t.value = !0;
-		try {
-			return await e(n ?? {});
-		} finally {
-			t.value = !1;
-		}
-	}
-	return {
-		isPluggableMediaEnabled: n,
-		isRequesting: t,
-		requestMedia: i
-	};
-}
-//#endregion
-//#region src/standalone/MediaLibrary.vue?vue&type=script&setup=true&lang.ts
-var Gr = {
-	class: "tpl tpl:flex tpl:flex-col tpl:overflow-hidden tpl:rounded-[var(--tpl-radius-lg)]",
-	style: {
-		width: "100%",
-		height: "100%",
-		"background-color": "var(--tpl-bg-elevated)",
-		border: "1px solid var(--tpl-border)"
-	}
-}, Kr = {
-	class: "tpl:flex tpl:shrink-0 tpl:items-center tpl:justify-between tpl:border-b tpl:px-5 tpl:py-3.5",
-	style: { "border-color": "var(--tpl-border)" }
-}, qr = {
-	class: "tpl:text-sm tpl:font-semibold",
-	style: { color: "var(--tpl-text)" }
-}, Jr = { class: "tpl:flex tpl:items-center tpl:gap-3" }, Yr = { class: "tpl:relative" }, Xr = [
-	"value",
-	"disabled",
-	"placeholder"
-], Zr = { class: "tpl:flex tpl:min-h-0 tpl:flex-1 tpl:overflow-hidden" }, Qr = {
-	key: 0,
-	class: "tpl:flex tpl:w-48 tpl:shrink-0 tpl:flex-col tpl:border-r",
-	style: {
-		"border-color": "var(--tpl-border)",
-		"background-color": "var(--tpl-bg)"
-	}
-}, $r = { class: "tpl:flex tpl:min-w-0 tpl:flex-1 tpl:flex-col" }, ei = {
-	class: "tpl:flex tpl:shrink-0 tpl:items-center tpl:justify-between tpl:border-b tpl:px-4 tpl:py-2.5",
-	style: { "border-color": "var(--tpl-border)" }
-}, ti = { class: "tpl:flex tpl:items-center tpl:gap-2" }, ni = ["title"], ri = {
-	key: 1,
-	class: "tpl:text-xs tpl:font-medium",
-	style: { color: "var(--tpl-text)" }
-}, ii = {
-	class: "tpl:flex tpl:rounded-md tpl:p-0.5",
-	style: {
-		border: "1px solid var(--tpl-border)",
-		"background-color": "var(--tpl-bg)"
-	}
-}, ai = ["title"], oi = ["title"], si = { class: "tpl:flex tpl:items-center tpl:gap-2" }, ci = ["value"], li = { value: "" }, ui = ["value"], di = { class: "tpl:min-h-0 tpl:flex-1 tpl:overflow-y-auto" }, fi = {
-	key: 0,
-	class: "tpl:px-4 tpl:pt-3"
-}, pi = {
-	class: "tpl-scale-in tpl:mx-4 tpl:w-full tpl:max-w-sm tpl:rounded-[var(--tpl-radius-lg)] tpl:p-5",
-	style: {
-		"background-color": "var(--tpl-bg-elevated)",
-		"box-shadow": "var(--tpl-shadow-xl)"
-	}
-}, mi = {
-	class: "tpl:mb-2 tpl:text-sm tpl:font-semibold",
-	style: { color: "var(--tpl-text)" }
-}, hi = {
-	key: 0,
-	"data-testid": "media-delete-usage",
-	class: "tpl:mb-4 tpl:text-xs",
-	style: { color: "var(--tpl-text-muted)" }
-}, gi = {
-	key: 1,
-	class: "tpl:mb-4 tpl:max-h-32 tpl:overflow-y-auto tpl:rounded tpl:border tpl:p-2",
-	style: { "border-color": "var(--tpl-border)" }
-}, _i = { class: "tpl:font-medium" }, vi = { style: { color: "var(--tpl-text-muted)" } }, yi = { class: "tpl:flex tpl:justify-end tpl:gap-2" }, bi = {
-	class: "tpl:flex tpl:shrink-0 tpl:items-center tpl:justify-between tpl:border-t tpl:px-5 tpl:py-3",
-	style: { "border-color": "var(--tpl-border)" }
-}, xi = { class: "tpl:flex tpl:min-w-0 tpl:flex-1 tpl:items-center tpl:gap-3" }, Si = { class: "tpl:flex tpl:items-center tpl:gap-5" }, Ci = {
-	key: 0,
-	class: "tpl:flex tpl:items-center tpl:gap-2"
-}, wi = {
-	key: 1,
-	class: "tpl:relative"
-}, Ti = { class: "tpl:flex tpl:items-center tpl:gap-2" }, Ei = ["disabled"], Di = /* @__PURE__ */ d({
-	__name: "MediaLibrary",
-	props: {
-		provider: {},
-		translations: {},
-		onSelect: { type: Function },
-		accept: {},
-		locale: {}
-	},
-	emits: ["ready"],
-	setup(t, { emit: i }) {
-		let d = t, f = i, p = r(() => d.translations);
-		y(pe, b(d.translations)), y(me, w(() => d.locale));
-		let m = {
-			get maxFileSize() {
-				return d.provider.maxFileSize;
-			},
-			get mimeTypes() {
-				return d.provider.mimeTypes;
-			},
-			get accept() {
-				return d.accept;
-			}
-		};
-		y(de, m);
-		let { isAcceptedMimeType: S, availableCategories: T } = $(m), D = ue({ provider: d.provider }), O = Zn({
-			library: D,
-			translations: p
-		}), A = r(() => typeof d.provider.create == "function"), j = r(() => d.provider.folders !== !1), P = r(() => typeof d.provider.importFromUrl == "function"), I = r(() => typeof d.provider.delete == "function"), L = r(() => typeof d.provider.update == "function"), V = r(() => typeof d.provider.replace == "function"), U = r(() => typeof d.provider.frequentlyUsed == "function"), W = r(() => {
-			let e = d.provider.folders;
-			return e !== !1 && typeof e.move == "function";
-		}), G = r(() => {
-			let e = d.provider.folders;
-			return e !== !1 && typeof e.create == "function";
-		}), K = r(() => {
-			let e = d.provider.folders;
-			return e !== !1 && typeof e.update == "function";
-		}), te = r(() => {
-			let e = d.provider.folders;
-			return e !== !1 && typeof e.delete == "function";
-		}), q = r(() => D.isLoading.value && O.displayItems.value.length === 0), ne = r(() => {
-			let e = D.previewItem.value;
-			return e ? !d.accept?.length || S(e.mimeType ?? "", d.accept) : !1;
-		}), re = r(() => {
-			if (!I.value) return 0;
-			let e = 0;
-			for (let t of D.selectedItems.value) O.displayItems.value.find((e) => e.id === t)?.canDelete !== !1 && (e += 1);
-			return e;
-		});
-		function J() {
-			d.onSelect && ne.value && D.previewItem.value && d.onSelect(D.previewItem.value);
-		}
-		function Y(e) {
-			let t = e.target.value;
-			D.filterByCategory(t || null);
-		}
-		async function ie() {
-			let e = /* @__PURE__ */ new Set();
-			for (let t of D.selectedItems.value) O.displayItems.value.find((e) => e.id === t)?.canDelete !== !1 && e.add(t);
-			D.selectedItems.value = e, await O.handleDeleteClick();
-		}
-		return _(() => {
-			d.accept?.length === 1 && (D.categoryFilter.value = d.accept[0]), D.loadItems(), D.loadFrequentlyUsed(), D.loadStorage(), f("ready");
-		}), (r, i) => (v(), s("div", Gr, [
-			c("div", Kr, [c("h2", qr, C(p.value.mediaLibrary.title), 1), c("div", Jr, [E(D).storageInfo.value ? (v(), a(Yn, {
-				key: 0,
-				"used-bytes": E(D).storageInfo.value.usedBytes,
-				"limit-bytes": E(D).storageInfo.value.limitBytes,
-				size: 22
-			}, null, 8, ["used-bytes", "limit-bytes"])) : o("", !0), c("div", Yr, [c("input", {
-				value: E(O).searchInput.value,
-				type: "text",
-				disabled: q.value,
-				class: "tpl:w-52 tpl:rounded-md tpl:border tpl:py-1.5 tpl:pr-3 tpl:pl-8 tpl:text-xs tpl:shadow-xs tpl:transition-all tpl:duration-150 tpl:outline-none tpl:focus:shadow-[var(--tpl-ring)] tpl:disabled:cursor-not-allowed tpl:disabled:opacity-50",
-				style: {
-					"border-color": "var(--tpl-border)",
-					"background-color": "var(--tpl-bg)",
-					color: "var(--tpl-text)"
-				},
-				placeholder: p.value.mediaLibrary.searchPlaceholder,
-				onInput: i[0] ||= (e) => E(O).handleSearchInput(e.target.value)
-			}, null, 40, Xr), u(E(ee), {
-				class: "tpl:absolute tpl:top-1/2 tpl:left-2.5 tpl:-translate-y-1/2",
-				size: 13,
-				"stroke-width": 2,
-				style: { color: "var(--tpl-text-dim)" }
-			})])])]),
-			c("div", Zr, [u(n, {
+				})], 8, mn)) : h("", !0)
+			])]),
+			_("div", hn, [y(d, {
 				"enter-active-class": "tpl:transition-all tpl:duration-200 tpl:ease-out",
 				"enter-from-class": "tpl:-ml-48 tpl:opacity-0",
 				"enter-to-class": "tpl:ml-0 tpl:opacity-100",
@@ -2884,19 +2070,19 @@ var Gr = {
 				"leave-from-class": "tpl:ml-0 tpl:opacity-100",
 				"leave-to-class": "tpl:-ml-48 tpl:opacity-0"
 			}, {
-				default: k(() => [j.value && E(O).showSidebar.value ? (v(), s("div", Qr, [u(bt, {
-					folders: E(O).folderTree.value,
-					"current-folder-id": E(D).currentFolderId.value,
-					"view-mode": E(D).viewMode.value,
-					"has-frequently-used": U.value && E(O).hasFrequentlyUsed.value,
-					"can-create-folder": G.value,
+				default: R(() => [N.value && F(k).showSidebar.value ? (D(), g("div", gn, [y(Me, {
+					folders: F(k).folderTree.value,
+					"current-folder-id": F(C).currentFolderId.value,
+					"view-mode": F(C).viewMode.value,
+					"has-frequently-used": ee.value && F(k).hasFrequentlyUsed.value,
+					"can-create-folder": W.value,
 					"can-rename-folder": K.value,
-					"can-delete-folder": te.value,
-					onNavigate: E(D).navigateToFolder,
-					onCreateFolder: E(O).handleCreateFolder,
-					onRenameFolder: E(O).handleRenameFolder,
-					onDeleteFolder: E(O).handleDeleteFolder,
-					onShowFrequentlyUsed: E(D).showFrequentlyUsed
+					"can-delete-folder": q.value,
+					onNavigate: F(C).navigateToFolder,
+					onCreateFolder: F(k).handleCreateFolder,
+					onRenameFolder: F(k).handleRenameFolder,
+					onDeleteFolder: F(k).handleDeleteFolder,
+					onShowFrequentlyUsed: F(C).showFrequentlyUsed
 				}, null, 8, [
 					"folders",
 					"current-folder-id",
@@ -2910,80 +2096,90 @@ var Gr = {
 					"onRenameFolder",
 					"onDeleteFolder",
 					"onShowFrequentlyUsed"
-				])])) : o("", !0)]),
+				])])) : h("", !0)]),
 				_: 1
-			}), c("div", $r, [c("div", ei, [c("div", ti, [
-				j.value ? (v(), s("button", {
+			}), _("div", _n, [_("div", vn, [_("div", yn, [
+				N.value ? (D(), g("button", {
 					key: 0,
+					type: "button",
 					"data-testid": "media-folder-toggle",
 					class: "tpl:flex tpl:size-7 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded-md tpl:transition-all tpl:duration-150",
-					style: g({
-						color: E(O).showSidebar.value ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
-						backgroundColor: E(O).showSidebar.value ? "var(--tpl-bg)" : "transparent",
-						border: E(O).showSidebar.value ? "1px solid var(--tpl-border)" : "1px solid transparent"
+					style: T({
+						color: F(k).showSidebar.value ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
+						backgroundColor: F(k).showSidebar.value ? "var(--tpl-bg)" : "transparent",
+						border: F(k).showSidebar.value ? "1px solid var(--tpl-border)" : "1px solid transparent"
 					}),
-					title: E(O).showSidebar.value ? p.value.mediaLibrary.hideFolders : p.value.mediaLibrary.showFolders,
-					onClick: i[1] ||= (e) => E(O).showSidebar.value = !E(O).showSidebar.value
-				}, [u(E(H), {
+					title: F(k).showSidebar.value ? c.value.mediaLibrary.hideFolders : c.value.mediaLibrary.showFolders,
+					"aria-label": F(k).showSidebar.value ? c.value.mediaLibrary.hideFolders : c.value.mediaLibrary.showFolders,
+					"aria-pressed": F(k).showSidebar.value,
+					onClick: n[2] ||= (e) => F(k).showSidebar.value = !F(k).showSidebar.value
+				}, [y(F(ie), {
 					size: 16,
 					"stroke-width": 2
-				})], 12, ni)) : o("", !0),
-				E(D).viewMode.value === "frequently-used" ? (v(), s("span", ri, C(p.value.mediaLibrary.frequentlyUsed), 1)) : (v(), a(be, {
+				})], 12, bn)) : h("", !0),
+				F(C).viewMode.value === "frequently-used" ? (D(), g("span", xn, M(c.value.mediaLibrary.frequentlyUsed), 1)) : (D(), m(ve, {
 					key: 2,
-					folders: E(O).folderTree.value,
-					"current-folder-id": E(D).currentFolderId.value,
-					onNavigate: E(D).navigateToFolder
+					folders: F(k).folderTree.value,
+					"current-folder-id": F(C).currentFolderId.value,
+					onNavigate: F(C).navigateToFolder
 				}, null, 8, [
 					"folders",
 					"current-folder-id",
 					"onNavigate"
 				])),
-				c("div", ii, [c("button", {
+				_("div", Sn, [_("button", {
+					type: "button",
 					class: "tpl:flex tpl:size-6 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded tpl:transition-all tpl:duration-150",
-					style: g({
-						color: E(O).layoutMode.value === "grid" ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
-						backgroundColor: E(O).layoutMode.value === "grid" ? "var(--tpl-bg-elevated)" : "transparent"
+					style: T({
+						color: F(k).layoutMode.value === "grid" ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
+						backgroundColor: F(k).layoutMode.value === "grid" ? "var(--tpl-bg-elevated)" : "transparent"
 					}),
-					title: p.value.mediaLibrary.viewGrid,
-					onClick: i[2] ||= (e) => E(O).layoutMode.value = "grid"
-				}, [u(E(R), {
+					title: c.value.mediaLibrary.viewGrid,
+					"aria-label": c.value.mediaLibrary.viewGrid,
+					"aria-pressed": F(k).layoutMode.value === "grid",
+					onClick: n[3] ||= (e) => F(k).layoutMode.value = "grid"
+				}, [y(F(G), {
 					size: 14,
 					"stroke-width": 2
-				})], 12, ai), c("button", {
+				})], 12, Cn), _("button", {
+					type: "button",
 					class: "tpl:flex tpl:size-6 tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:rounded tpl:transition-all tpl:duration-150",
-					style: g({
-						color: E(O).layoutMode.value === "list" ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
-						backgroundColor: E(O).layoutMode.value === "list" ? "var(--tpl-bg-elevated)" : "transparent"
+					style: T({
+						color: F(k).layoutMode.value === "list" ? "var(--tpl-primary)" : "var(--tpl-text-muted)",
+						backgroundColor: F(k).layoutMode.value === "list" ? "var(--tpl-bg-elevated)" : "transparent"
 					}),
-					title: p.value.mediaLibrary.viewList,
-					onClick: i[3] ||= (e) => E(O).layoutMode.value = "list"
-				}, [u(E(B), {
+					title: c.value.mediaLibrary.viewList,
+					"aria-label": c.value.mediaLibrary.viewList,
+					"aria-pressed": F(k).layoutMode.value === "list",
+					onClick: n[4] ||= (e) => F(k).layoutMode.value = "list"
+				}, [y(F(re), {
 					size: 14,
 					"stroke-width": 2
-				})], 12, oi)])
-			]), c("div", si, [E(T).length > 1 ? (v(), s("select", {
+				})], 12, wn)])
+			]), _("div", Tn, [F(S).length > 1 ? (D(), g("select", {
 				key: 0,
+				"aria-label": c.value.mediaLibrary.filterAriaLabel,
 				class: "tpl:rounded-md tpl:border tpl:py-1.5 tpl:pr-7 tpl:pl-2.5 tpl:text-xs tpl:transition-all tpl:duration-150 tpl:outline-none",
 				style: {
 					"border-color": "var(--tpl-border)",
 					"background-color": "var(--tpl-bg)",
 					color: "var(--tpl-text)"
 				},
-				value: E(D).categoryFilter.value ?? "",
-				onChange: Y
-			}, [c("option", li, C(p.value.mediaLibrary.filterAll), 1), (v(!0), s(e, null, x(E(T), (e) => (v(), s("option", {
+				value: F(C).categoryFilter.value ?? "",
+				onChange: ce
+			}, [_("option", Dn, M(c.value.mediaLibrary.filterAll), 1), (D(!0), g(l, null, A(F(S), (e) => (D(), g("option", {
 				key: e,
 				value: e
-			}, C(E(O).getCategoryLabel(e)), 9, ui))), 128))], 40, ci)) : o("", !0)])]), c("div", di, [E(D).viewMode.value === "files" && (A.value || P.value) ? (v(), s("div", fi, [A.value ? (v(), a(Wn, {
+			}, M(F(k).getCategoryLabel(e)), 9, On))), 128))], 40, En)) : h("", !0)])]), _("div", kn, [F(C).viewMode.value === "files" && (j.value || P.value) ? (D(), g("div", An, [j.value ? (D(), m(Qt, {
 				key: 0,
-				"is-uploading": E(D).isUploading.value,
-				"upload-progress": E(D).uploadProgress.value,
-				onUpload: E(O).handleUpload
+				"is-uploading": F(C).isUploading.value,
+				"upload-progress": F(C).uploadProgress.value,
+				onUpload: F(k).handleUpload
 			}, null, 8, [
 				"is-uploading",
 				"upload-progress",
 				"onUpload"
-			])) : o("", !0), P.value ? (v(), s("button", {
+			])) : h("", !0), P.value ? (D(), g("button", {
 				key: 1,
 				"data-testid": "media-import-url",
 				class: "tpl:mt-2 tpl:flex tpl:w-full tpl:cursor-pointer tpl:items-center tpl:justify-center tpl:gap-1.5 tpl:rounded-md tpl:border tpl:border-dashed tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
@@ -2992,26 +2188,26 @@ var Gr = {
 					color: "var(--tpl-text-muted)",
 					"background-color": "var(--tpl-bg)"
 				},
-				onClick: i[4] ||= (e) => E(O).showImportUrlModal.value = !0
-			}, [u(E(z), {
+				onClick: n[5] ||= (e) => F(k).showImportUrlModal.value = !0
+			}, [y(F(ne), {
 				size: 14,
 				"stroke-width": 2
-			}), l(" " + C(p.value.mediaLibrary.importFromUrl), 1)])) : o("", !0)])) : o("", !0), u($t, {
-				items: E(O).displayItems.value,
-				"selected-ids": E(D).selectedItems.value,
-				"is-loading": E(D).isLoading.value,
-				"has-more": E(D).viewMode.value === "files" && E(D).hasMore.value,
+			}), v(" " + M(c.value.mediaLibrary.importFromUrl), 1)])) : h("", !0)])) : h("", !0), y(lt, {
+				items: F(k).displayItems.value,
+				"selected-ids": F(C).selectedItems.value,
+				"is-loading": F(C).isLoading.value,
+				"has-more": F(C).viewMode.value === "files" && F(C).hasMore.value,
 				accept: t.accept,
-				layout: E(O).layoutMode.value,
-				"search-query": E(D).searchQuery.value,
-				"can-update": L.value,
-				"can-replace": V.value,
-				onSelect: E(O).handleSelect,
-				onToggle: E(D).toggleSelection,
-				onLoadMore: E(D).loadMore,
-				onEdit: E(O).handleEditItem,
-				onReplace: E(O).handleReplaceItem,
-				onConfirm: J
+				layout: F(k).layoutMode.value,
+				"search-query": F(C).searchQuery.value,
+				"can-update": z.value,
+				"can-replace": B.value,
+				onSelect: F(k).handleSelect,
+				onToggle: F(C).toggleSelection,
+				onLoadMore: F(C).loadMore,
+				onEdit: F(k).handleEditItem,
+				onReplace: F(k).handleReplaceItem,
+				onConfirm: Q
 			}, null, 8, [
 				"items",
 				"selected-ids",
@@ -3028,36 +2224,33 @@ var Gr = {
 				"onEdit",
 				"onReplace"
 			])])])]),
-			u(fn, {
-				visible: E(O).showImportUrlModal.value,
-				"is-importing": E(D).isImportingFromUrl.value,
-				error: E(D).importFromUrlError.value,
-				onImport: E(O).handleImportFromUrl,
-				onClose: i[5] ||= (e) => E(O).showImportUrlModal.value = !1
+			y(bt, {
+				visible: F(k).showImportUrlModal.value,
+				"is-importing": F(C).isImportingFromUrl.value,
+				error: F(C).importFromUrlError.value,
+				onImport: F(k).handleImportFromUrl,
+				onClose: n[6] ||= (e) => F(k).showImportUrlModal.value = !1
 			}, null, 8, [
 				"visible",
 				"is-importing",
 				"error",
 				"onImport"
 			]),
-			u(ct, {
-				visible: !!E(O).editingItem.value,
-				item: E(O).editingItem.value,
-				onSave: E(O).handleEditSave,
-				onClose: i[6] ||= (e) => E(O).editingItem.value = null
-			}, null, 8, [
-				"visible",
-				"item",
-				"onSave"
-			]),
-			u(zn, {
-				visible: E(D).showReplaceWarning.value,
-				item: E(D).pendingReplaceItem.value,
-				"usage-info": E(D).replaceUsageInfo.value,
-				"is-replacing": E(D).isReplacing.value,
-				error: E(D).replaceError.value,
-				onReplace: E(O).handleReplaceFile,
-				onClose: E(D).cancelReplace
+			F(k).editingItem.value ? (D(), m(F(s), {
+				key: 0,
+				visible: !0,
+				item: F(k).editingItem.value,
+				onSave: F(k).handleEditSave,
+				onClose: n[7] ||= (e) => F(k).editingItem.value = null
+			}, null, 8, ["item", "onSave"])) : h("", !0),
+			y(Kt, {
+				visible: F(C).showReplaceWarning.value,
+				item: F(C).pendingReplaceItem.value,
+				"usage-info": F(C).replaceUsageInfo.value,
+				"is-replacing": F(C).isReplacing.value,
+				error: F(C).replaceError.value,
+				onReplace: F(k).handleReplaceFile,
+				onClose: F(C).cancelReplace
 			}, null, 8, [
 				"visible",
 				"item",
@@ -3067,7 +2260,7 @@ var Gr = {
 				"onReplace",
 				"onClose"
 			]),
-			u(n, {
+			y(d, {
 				"enter-active-class": "tpl:transition tpl:ease-out tpl:duration-150",
 				"enter-from-class": "tpl:opacity-0",
 				"enter-to-class": "tpl:opacity-100",
@@ -3075,147 +2268,343 @@ var Gr = {
 				"leave-from-class": "tpl:opacity-100",
 				"leave-to-class": "tpl:opacity-0"
 			}, {
-				default: k(() => [E(D).showDeleteWarning.value ? (v(), s("div", {
+				default: R(() => [F(C).showDeleteWarning.value ? (D(), g("div", {
 					key: 0,
+					role: "dialog",
+					"aria-modal": "true",
+					"aria-labelledby": "tpl-media-delete-title",
 					class: "tpl:absolute tpl:inset-0 tpl:z-10 tpl:flex tpl:items-center tpl:justify-center tpl:rounded-[var(--tpl-radius-lg)]",
 					style: {
 						"background-color": "var(--tpl-overlay)",
 						"backdrop-filter": "blur(8px)",
 						"-webkit-backdrop-filter": "blur(8px)"
 					},
-					onClick: i[9] ||= M((...e) => E(D).cancelDelete && E(D).cancelDelete(...e), ["self"])
-				}, [c("div", pi, [
-					c("h3", mi, C(p.value.mediaLibrary.deleteWarningTitle), 1),
-					c("p", {
-						class: h(["tpl:text-xs", E(O).hasUsedFiles.value ? "tpl:mb-2" : "tpl:mb-4"]),
+					onClick: n[10] ||= V((...e) => F(C).cancelDelete && F(C).cancelDelete(...e), ["self"])
+				}, [_("div", jn, [
+					_("h3", Mn, M(c.value.mediaLibrary.deleteWarningTitle), 1),
+					_("p", {
+						class: w(["tpl:text-xs", F(k).hasUsedFiles.value ? "tpl:mb-2" : "tpl:mb-4"]),
 						style: { color: "var(--tpl-text-muted)" }
-					}, C(p.value.mediaLibrary.deleteWarningMessage), 3),
-					E(O).hasUsedFiles.value ? (v(), s("p", hi, C(p.value.mediaLibrary.deleteWarningUsageNote), 1)) : o("", !0),
-					E(O).hasUsedFiles.value ? (v(), s("div", gi, [(v(!0), s(e, null, x(E(D).deleteUsageInfo.value, (t, n) => (v(), s("div", {
-						key: n,
+					}, M(c.value.mediaLibrary.deleteWarningMessage), 3),
+					F(k).hasUsedFiles.value ? (D(), g("p", Nn, M(c.value.mediaLibrary.deleteWarningUsageNote), 1)) : h("", !0),
+					F(k).hasUsedFiles.value ? (D(), g("div", Pn, [(D(!0), g(l, null, A(F(C).deleteUsageInfo.value, (e, t) => (D(), g("div", {
+						key: t,
 						class: "tpl:text-xs",
 						style: { color: "var(--tpl-text)" }
-					}, [t.templateCount > 0 ? (v(), s(e, { key: 0 }, [c("span", _i, C(E(O).displayItems.value.find((e) => e.id === n)?.filename || n), 1), c("span", vi, " - " + C(p.value.mediaLibrary.usedInTemplates.replace("{count}", t.templateCount.toString())), 1)], 64)) : o("", !0)]))), 128))])) : o("", !0),
-					c("div", yi, [c("button", {
+					}, [e.templateCount > 0 ? (D(), g(l, { key: 0 }, [_("span", Fn, M(F(k).displayItems.value.find((e) => e.id === t)?.filename || t), 1), _("span", In, " - " + M(c.value.mediaLibrary.usedInTemplates.replace("{count}", e.templateCount.toString())), 1)], 64)) : h("", !0)]))), 128))])) : h("", !0),
+					_("div", Ln, [_("button", {
 						class: "tpl:cursor-pointer tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
 						style: {
 							"border-color": "var(--tpl-border)",
 							color: "var(--tpl-text)",
 							"background-color": "var(--tpl-bg)"
 						},
-						onClick: i[7] ||= (...e) => E(D).cancelDelete && E(D).cancelDelete(...e)
-					}, C(p.value.mediaLibrary.cancel), 1), c("button", {
+						onClick: n[8] ||= (...e) => F(C).cancelDelete && F(C).cancelDelete(...e)
+					}, M(c.value.mediaLibrary.cancel), 1), _("button", {
 						class: "tpl:cursor-pointer tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
 						style: {
 							"border-color": "var(--tpl-danger)",
 							color: "var(--tpl-danger)",
-							"background-color": "var(--tpl-danger-light)"
+							"background-color": "var(--tpl-bg)"
 						},
-						onClick: i[8] ||= (...e) => E(D).confirmDelete && E(D).confirmDelete(...e)
-					}, C(E(O).hasUsedFiles.value ? p.value.mediaLibrary.deleteAnyway : p.value.mediaLibrary.confirmDelete), 1)])
-				])])) : o("", !0)]),
+						onClick: n[9] ||= (...e) => F(C).confirmDelete && F(C).confirmDelete(...e)
+					}, M(F(k).hasUsedFiles.value ? c.value.mediaLibrary.deleteAnyway : c.value.mediaLibrary.confirmDelete), 1)])
+				])])) : h("", !0)]),
 				_: 1
 			}),
-			c("div", bi, [c("div", xi, [E(D).previewItem.value ? (v(), a(wn, {
+			_("div", Rn, [_("div", zn, [F(C).previewItem.value ? (D(), m(Mt, {
 				key: 0,
-				item: E(D).previewItem.value,
-				folders: E(O).folderTree.value
-			}, null, 8, ["item", "folders"])) : o("", !0)]), c("div", Si, [E(D).selectedItems.value.size > 0 ? (v(), s("div", Ci, [E(D).previewItem.value ? (v(), s("button", {
+				item: F(C).previewItem.value,
+				folders: F(k).folderTree.value
+			}, null, 8, ["item", "folders"])) : h("", !0)]), _("div", Bn, [F(C).selectedItems.value.size > 0 ? (D(), g("div", Vn, [F(C).previewItem.value ? (D(), g("button", {
 				key: 0,
 				class: "tpl:flex tpl:cursor-pointer tpl:items-center tpl:gap-1 tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
-				style: g({
-					borderColor: E(O).copied.value ? "var(--tpl-success)" : "var(--tpl-border)",
-					color: E(O).copied.value ? "var(--tpl-success)" : "var(--tpl-text)",
+				style: T({
+					borderColor: F(k).copied.value ? "var(--tpl-success)" : "var(--tpl-border)",
+					color: F(k).copied.value ? "var(--tpl-success)" : "var(--tpl-text)",
 					backgroundColor: "var(--tpl-bg)"
 				}),
-				onClick: i[10] ||= (e) => E(O).copy(E(O).selectedUrl.value)
-			}, [E(O).copied.value ? (v(), a(E(N), {
+				onClick: n[11] ||= (e) => F(k).copy(F(k).selectedUrl.value)
+			}, [F(k).copied.value ? (D(), m(F(H), {
 				key: 1,
 				size: 12,
 				"stroke-width": 2
-			})) : (v(), a(E(F), {
+			})) : (D(), m(F(te), {
 				key: 0,
 				size: 12,
 				"stroke-width": 2
-			})), l(" " + C(E(O).copied.value ? p.value.mediaLibrary.copied : p.value.mediaLibrary.copyUrl), 1)], 4)) : o("", !0), W.value ? (v(), s("div", wi, [c("button", {
+			})), v(" " + M(F(k).copied.value ? c.value.mediaLibrary.copied : c.value.mediaLibrary.copyUrl), 1)], 4)) : h("", !0), U.value ? (D(), g("div", Hn, [_("button", {
 				class: "tpl:cursor-pointer tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
 				style: {
 					"border-color": "var(--tpl-border)",
 					color: "var(--tpl-text)",
 					"background-color": "var(--tpl-bg)"
 				},
-				onClick: i[11] ||= (e) => E(O).showMovePicker.value = !E(O).showMovePicker.value
-			}, C(p.value.mediaLibrary.moveSelected), 1), E(O).showMovePicker.value ? (v(), a(_n, {
+				onClick: n[12] ||= (e) => F(k).showMovePicker.value = !F(k).showMovePicker.value
+			}, M(c.value.mediaLibrary.moveSelected), 1), F(k).showMovePicker.value ? (D(), m(Tt, {
 				key: 0,
-				folders: E(O).folderTree.value,
-				"current-folder-id": E(D).currentFolderId.value,
-				onSelect: E(O).handleMoveToFolder,
-				onClose: i[12] ||= (e) => E(O).showMovePicker.value = !1
+				folders: F(k).folderTree.value,
+				"current-folder-id": F(C).currentFolderId.value,
+				onSelect: F(k).handleMoveToFolder,
+				onClose: n[13] ||= (e) => F(k).showMovePicker.value = !1
 			}, null, 8, [
 				"folders",
 				"current-folder-id",
 				"onSelect"
-			])) : o("", !0)])) : o("", !0)])) : o("", !0), c("div", Ti, [re.value > 0 ? (v(), s("button", {
+			])) : h("", !0)])) : h("", !0)])) : h("", !0), _("div", Un, [oe.value > 0 ? (D(), g("button", {
 				key: 0,
 				"data-testid": "media-delete",
 				class: "tpl:cursor-pointer tpl:rounded-md tpl:border tpl:px-3 tpl:py-1.5 tpl:text-xs tpl:font-medium tpl:transition-all tpl:duration-150",
 				style: {
 					"border-color": "var(--tpl-danger)",
 					color: "var(--tpl-danger)",
-					"background-color": "var(--tpl-danger-light)"
+					"background-color": "var(--tpl-bg)"
 				},
-				onClick: ie
-			}, C(p.value.mediaLibrary.deleteSelected), 1)) : o("", !0), t.onSelect ? (v(), s("button", {
+				onClick: le
+			}, M(c.value.mediaLibrary.deleteSelected), 1)) : h("", !0), t.showConfirm ? (D(), g("button", {
 				key: 1,
-				"data-testid": "media-select",
-				class: "tpl:cursor-pointer tpl:rounded-md tpl:px-4 tpl:py-1.5 tpl:text-sm tpl:font-medium tpl:shadow-xs tpl:transition-all tpl:duration-150 tpl:hover:opacity-90 tpl:disabled:cursor-not-allowed tpl:disabled:opacity-50",
+				"data-testid": u.value,
+				class: "tpl:cursor-pointer tpl:rounded-md tpl:px-4 tpl:py-1.5 tpl:text-sm tpl:font-medium tpl:shadow-xs tpl:transition-all tpl:duration-150 tpl:hover:bg-[var(--tpl-primary-hover)] tpl:disabled:cursor-not-allowed tpl:disabled:opacity-50",
 				style: {
 					"background-color": "var(--tpl-primary)",
-					color: "var(--tpl-bg)"
+					color: "var(--tpl-on-primary)"
 				},
-				disabled: !ne.value,
-				onClick: J
-			}, C(t.accept?.length ? p.value.mediaLibrary.selectImage : p.value.mediaLibrary.selectFile), 9, Ei)) : o("", !0)])])])
+				disabled: !Y.value,
+				onClick: Q
+			}, M(t.accept?.length ? c.value.mediaLibrary.selectImage : c.value.mediaLibrary.selectFile), 9, Wn)) : h("", !0)])])])
 		]));
 	}
-}), Oi = null, ki = b(null);
-async function Ai(e) {
+}), Kn = /* #__PURE__ */ Object.assign({
+	"./locales/ca.ts": () => import("./ca-B1Ig3u8O.js"),
+	"./locales/de.ts": () => import("./de-BNbyJubD.js"),
+	"./locales/en.ts": () => import("./en-CQxhpwqd.js").then((e) => e.n),
+	"./locales/es.ts": () => import("./es-B2EH-TdJ.js"),
+	"./locales/fr.ts": () => import("./fr-9SWy_n9K.js"),
+	"./locales/nl.ts": () => import("./nl-DJasgSvI.js"),
+	"./locales/pt-BR.ts": () => import("./pt-BR-BtCfbqSj.js")
+});
+function qn(e) {
+	return Object.keys(e).map((e) => e.match(/\/([^/]+)\.ts$/)?.[1]).filter((e) => !!e);
+}
+var Jn = qn(Kn);
+function Yn(e) {
+	return e.trim().replace(/_/g, "-").toLowerCase();
+}
+function Xn(e) {
+	let t = Yn(e);
+	return Jn.find((e) => Yn(e) === t);
+}
+function Zn(e) {
+	return Yn(e).split("-")[0];
+}
+function Qn(e) {
+	return Xn(e) ?? Xn(Zn(e)) ?? "en";
+}
+async function $n(e) {
+	let t = Kn[`./locales/${Qn(e)}.ts`];
+	return (await t()).default;
+}
+//#endregion
+//#region src/components/MediaLibraryModal.vue?vue&type=script&setup=true&lang.ts
+var er = ["data-tpl-theme"], tr = /* @__PURE__ */ x({
+	__name: "MediaLibraryModal",
+	props: {
+		visible: { type: Boolean },
+		provider: {},
+		accept: {},
+		popoverTarget: {},
+		locale: {},
+		uiTheme: {},
+		templateId: {},
+		onError: { type: Function }
+	},
+	emits: ["close", "select"],
+	setup(e, { emit: n }) {
+		let i = e, o = n, l = k(null);
+		L(() => i.locale, async (e) => {
+			l.value = await $n(e ?? "en");
+		}, { immediate: !0 }), O(s, l);
+		let p = f(() => i.uiTheme);
+		O(r, p);
+		let v = N(() => i.popoverTarget ?? null);
+		O(a, v), O(t, N(() => i.locale));
+		let b = k(null), x = k(null), S = f(() => i.visible && l.value !== null && !x.value?.nestedDialogOpen);
+		c(b, S);
+		function C(e) {
+			if (e.key === "Escape") {
+				if (x.value?.handleEscape()) {
+					e.preventDefault();
+					return;
+				}
+				o("close");
+			}
+		}
+		de(document, "keydown", C);
+		function T(e) {
+			o("select", e), o("close");
+		}
+		return (t, n) => (D(), m(u, { to: e.popoverTarget || "body" }, [y(d, {
+			"enter-active-class": "tpl:transition tpl:duration-200",
+			"enter-from-class": "tpl:opacity-0",
+			"enter-to-class": "tpl:opacity-100",
+			"leave-active-class": "tpl:transition tpl:duration-150",
+			"leave-from-class": "tpl:opacity-100",
+			"leave-to-class": "tpl:opacity-0"
+		}, {
+			default: R(() => [e.visible && l.value ? (D(), g("div", {
+				key: 0,
+				"data-testid": "media-library-modal",
+				"data-tpl-theme": p.value,
+				class: w([e.popoverTarget ? void 0 : "tpl", "tpl-media-overlay tpl:fixed tpl:inset-0 tpl:z-10 tpl:flex tpl:items-center tpl:justify-center tpl:p-4"]),
+				style: {
+					"background-color": "var(--tpl-overlay)",
+					"backdrop-filter": "blur(8px)",
+					"-webkit-backdrop-filter": "blur(8px)"
+				},
+				onClick: n[1] ||= V((e) => o("close"), ["self"])
+			}, [_("div", {
+				ref_key: "dialogRef",
+				ref: b,
+				role: "dialog",
+				"aria-modal": "true",
+				"aria-labelledby": "tpl-media-library-title",
+				"data-testid": "media-library-dialog",
+				class: "tpl-media-modal tpl-scale-in tpl:flex tpl:flex-col tpl:overflow-hidden tpl:rounded-[var(--tpl-radius-lg)]",
+				style: {
+					width: "900px",
+					height: "650px",
+					"max-width": "100%",
+					"max-height": "90%",
+					"background-color": "var(--tpl-bg-elevated)",
+					border: "1px solid var(--tpl-border)",
+					"box-shadow": "var(--tpl-shadow-xl)"
+				}
+			}, [y(Gn, {
+				ref_key: "chromeRef",
+				ref: x,
+				provider: e.provider,
+				accept: e.accept,
+				"template-id": e.templateId,
+				"on-error": e.onError,
+				translations: l.value,
+				"show-close": "",
+				"show-confirm": "",
+				"confirm-test-id": "media-confirm",
+				onClose: n[0] ||= (e) => o("close"),
+				onConfirm: T
+			}, null, 8, [
+				"provider",
+				"accept",
+				"template-id",
+				"on-error",
+				"translations"
+			])], 512)], 10, er)) : h("", !0)]),
+			_: 1
+		})], 8, ["to"]));
+	}
+});
+//#endregion
+//#region src/composables/useMediaPicker.ts
+function nr() {
+	let e = C("onRequestMedia"), t = k(!1), n = f(() => !!e);
+	async function r(n) {
+		if (!e) return null;
+		t.value = !0;
+		try {
+			return await e(n ?? {});
+		} finally {
+			t.value = !1;
+		}
+	}
+	return {
+		isPluggableMediaEnabled: n,
+		isRequesting: t,
+		requestMedia: r
+	};
+}
+//#endregion
+//#region src/standalone/MediaLibrary.vue
+var rr = /* @__PURE__ */ x({
+	__name: "MediaLibrary",
+	props: {
+		provider: {},
+		translations: {},
+		onSelect: { type: Function },
+		accept: {},
+		locale: {}
+	},
+	emits: ["ready"],
+	setup(e, { emit: n }) {
+		let r = e, i = n, o = f(() => r.translations);
+		O(s, k(r.translations)), O(t, N(() => r.locale));
+		let c = k(null);
+		O(a, c);
+		function l(e) {
+			r.onSelect?.(e);
+		}
+		return (t, n) => (D(), g("div", {
+			ref_key: "popoverRoot",
+			ref: c,
+			class: "tpl tpl:flex tpl:flex-col tpl:overflow-hidden tpl:rounded-[var(--tpl-radius-lg)]",
+			style: {
+				width: "100%",
+				height: "100%",
+				"background-color": "var(--tpl-bg-elevated)",
+				border: "1px solid var(--tpl-border)"
+			}
+		}, [y(Gn, {
+			provider: e.provider,
+			accept: e.accept,
+			translations: o.value,
+			"show-confirm": !!e.onSelect,
+			"confirm-test-id": "media-select",
+			onConfirm: l,
+			onReady: n[0] ||= (e) => i("ready")
+		}, null, 8, [
+			"provider",
+			"accept",
+			"translations",
+			"show-confirm"
+		])], 512));
+	}
+}), $ = null, ir = k(null);
+async function ar(e) {
 	let t = typeof e.container == "string" ? document.querySelector(e.container) : e.container;
 	if (!t) throw Error(`Container element not found: ${e.container}`);
-	let n = await ar(e.locale ?? "en");
-	return Mi(t, e.theme), Oi && ji(), new Promise((r, a) => {
+	let n = await $n(e.locale ?? "en");
+	return sr(t, e.theme), $ && or(), new Promise((r, i) => {
 		try {
-			Oi = i({ setup() {
+			$ = p({ setup() {
 				let i = () => {
 					r({
-						setTheme: (e) => Mi(t, e),
-						unmount: ji
+						setTheme: (e) => sr(t, e),
+						unmount: or
 					});
 				};
-				return () => f(Di, {
+				return () => S(rr, {
 					provider: e.provider,
 					translations: n,
 					onSelect: e.onSelect,
 					accept: e.accept,
 					locale: e.locale,
-					ref: ki,
+					ref: ir,
 					onReady: i
 				});
-			} }), Oi.mount(t);
+			} }), $.mount(t);
 		} catch (e) {
-			a(e);
+			i(e);
 		}
 	});
 }
-function ji() {
-	Oi && (Oi.unmount(), Oi = null, ki.value = null);
+function or() {
+	$ && ($.unmount(), $ = null, ir.value = null);
 }
-function Mi(e, t) {
-	t && (t.primaryColor && e.style.setProperty("--tpl-primary", t.primaryColor), t.borderRadius !== void 0 && (e.style.setProperty("--tpl-radius", `${t.borderRadius}px`), e.style.setProperty("--tpl-radius-sm", `${Math.max(0, t.borderRadius - 3)}px`), e.style.setProperty("--tpl-radius-lg", `${t.borderRadius + 4}px`)));
+function sr(e, t) {
+	t && (t.primaryColor && e.style.setProperty("--tpl-user-primary", t.primaryColor), t.borderRadius !== void 0 && (e.style.setProperty("--tpl-user-radius", `${t.borderRadius}px`), e.style.setProperty("--tpl-user-radius-sm", `${Math.max(0, t.borderRadius - 3)}px`), e.style.setProperty("--tpl-user-radius-lg", `${t.borderRadius + 4}px`)));
 }
 typeof window < "u" && (window.TemplaticalMedia = {
-	init: Ai,
-	unmount: ji
+	init: ar,
+	unmount: or
 });
 //#endregion
-export { Ur as MediaLibraryModal, Ai as init, ji as unmount, Q as useI18n, $ as useMediaCategories, ue as useMediaLibrary, Wr as useMediaPicker };
+export { tr as MediaLibraryModal, ar as init, or as unmount, n as useI18n, o as useMediaCategories, me as useMediaLibrary, nr as useMediaPicker };