@phtngyn/cms 0.2.0-beta.7 → 0.3.0

package/studio/chunks/MediaUploadPanel-C7Kyg6aR.js

@@ -0,0 +1,1173 @@
+import { $ as e, B as t, E as n, Ut as r, Wt as i, _t as a, b as o, bt as s, dt as c, m as l, mt as u, nn as d, o as f, s as p, t as m, tn as h, tt as ee, y as g } from "./Button-BT3ztSPx.js";
+import { st as _, tt as v } from "./Search-BEgCe9Aj.js";
+import { a as y, d as b, n as te, r as ne } from "./studioContext-I8HozGU1.js";
+import { $t as re, A as x, B as S, Ci as C, Cr as w, E as T, K as E, M as D, N as O, Nn as k, Or as A, Pn as j, Qt as M, R as N, V as P, _i as ie, fa as F, fr as ae, gi as I, gn as L, ii as R, k as z, li as oe, mr as se, ni as B, o as V, ra as H, ui as U, un as W, vi as G, zn as ce } from "./runtime-core.esm-bundler-DKFA9Rep.js";
+import { a as le } from "./overlay-DnqFLZTc.js";
+import { t as ue } from "./SelectMenu-DSweWGMz.js";
+import { t as de } from "./FormField-CgM6l2Yn.js";
+import { t as fe } from "./english-Cs_Adu-u.js";
+import { t as pe } from "./Alert-D0D24z_a.js";
+import { c as me, r as K, s as he, t as q } from "./presentation-DF83w0hE.js";
+import { t as ge } from "./usePointerMotion-DwRcwBNQ.js";
+import { n as _e, t as J } from "./studioQueries-BR-9NT5F.js";
+import { t as Y } from "./Slideover-QMMHAAys.js";
+import { t as X } from "./useStudioPages-DR9qmYLg.js";
+//#region ../../node_modules/.pnpm/@nuxt+ui@4.11.3_cb98d253b9bf6e94cc4ec1fe3cbbcc2e/node_modules/@nuxt/ui/dist/runtime/composables/useFileUpload.js
+function ve(e) {
+	return !e || e === "*" ? [] : e.split(",").map((e) => {
+		let t = e.trim();
+		return t.includes("/") && t.endsWith("/*") && t.split("/")[0] || t;
+	}).filter((e) => !e.startsWith("."));
+}
+function ye(e) {
+	let { accept: t = "*", reset: n = !1, multiple: r = !1, dropzone: i = !0, onUpdate: a } = e, o = R(), s = R(), l = T(() => ve(C(t))), d = (e, t = !1) => {
+		if (e && e.length !== 0) {
+			if (e instanceof FileList && (e = Array.from(e)), e.length > 1 && !C(r) && (e = [e[0]]), t && o.value?.$el) try {
+				let t = new DataTransfer();
+				e.forEach((e) => t.items.add(e)), o.value.$el.files = t.files;
+			} catch (e) {
+				console.warn("Could not sync files to input element:", e);
+			}
+			a(e);
+		}
+	}, f = R(!1), p = B({ open: () => {} });
+	function m() {
+		p.open();
+	}
+	return W(() => {
+		let { isOverDropZone: e } = i ? c(s, {
+			dataTypes: l,
+			onDrop: (e) => d(e, !0)
+		}) : { isOverDropZone: R(!1) };
+		w(e, (e) => {
+			f.value = e;
+		});
+		let { onChange: a, open: m } = u({
+			accept: t,
+			multiple: r,
+			input: T(() => C(o)?.$el),
+			reset: n
+		});
+		p.open = m, a((e) => d(e, !1));
+	}), {
+		isDragging: f,
+		open: m,
+		inputRef: o,
+		dropzoneRef: s
+	};
+}
+//#endregion
+//#region src/media/useMediaLibrary.ts
+var Z = {
+	assets: [],
+	folders: [],
+	total: 0
+};
+function Q(e, t, n) {
+	if (n) return {
+		..._e(() => e()(n()), Z, { active: t }),
+		reset: () => {},
+		loadMore: async () => {}
+	};
+	let r = X({
+		active: t,
+		query: e,
+		start: 0,
+		next: (e, t) => t + e.assets.length < e.total && e.assets.length ? t + e.assets.length : void 0,
+		items: (e) => e.assets,
+		key: (e) => e.id
+	});
+	return {
+		...r,
+		data: T(() => ({
+			...r.data.value.page ?? Z,
+			assets: r.data.value.items
+		}))
+	};
+}
+function be(e = {}) {
+	let t = b(), n = U(""), a = U(), o = U(e.initialKind ?? ""), s = U("newest"), c = U(), l = U({
+		search: n.value,
+		folder: a.value,
+		kind: o.value,
+		sort: s.value
+	}), u = U(!1), d = () => e.active === void 0 || G(e.active), f = Q(() => {
+		let t = l.value;
+		return (n) => J.media({
+			...t,
+			kind: t.kind || void 0,
+			offset: n,
+			limit: e.limit ?? 30
+		});
+	}, () => d() && !u.value, e.page === void 0 ? void 0 : () => (Math.max(1, G(e.page) ?? 1) - 1) * (e.limit ?? 30)), p = T(() => f.data.value.assets), m = T(() => f.data.value.folders), h = T(() => f.data.value.total), ee = T(() => p.value.find((e) => e.id === c.value) ?? (c.value !== null && e.selectFirst !== !1 ? p.value[0] ?? null : null)), g = T(() => d() && (u.value || f.loading.value)), _ = () => {
+		l.value = {
+			search: n.value,
+			folder: a.value,
+			kind: o.value,
+			sort: s.value
+		}, u.value = !1;
+	}, v = i(_, 250);
+	w([
+		n,
+		a,
+		o,
+		s
+	], () => {
+		u.value = !0, c.value = void 0, v();
+	}, { flush: "sync" }), r(() => v.cancel());
+	async function y() {
+		return v.cancel(), u.value && _(), await f.settled();
+	}
+	async function te(e = !0) {
+		if (v.cancel(), d()) {
+			if (u.value) {
+				await y();
+				return;
+			}
+			e ? (f.reset(), await t.invalidate(["media"]), await f.settled()) : await f.loadMore();
+		}
+	}
+	function ne() {
+		f.reset(), c.value = void 0;
+	}
+	function re(e) {
+		c.value = e?.id ?? null;
+	}
+	return {
+		assets: p,
+		folders: m,
+		selected: ee,
+		search: n,
+		folder: a,
+		kind: o,
+		sort: s,
+		total: h,
+		loading: g,
+		error: f.error,
+		load: te,
+		settled: y,
+		selectAsset: re,
+		reset: ne
+	};
+}
+//#endregion
+//#region virtual:nuxt-ui-templates/ui/file-upload.ts
+var xe = {
+	slots: {
+		root: "relative flex flex-col",
+		base: ["w-full flex-1 bg-default border border-default flex flex-col gap-2 items-stretch justify-center rounded-lg focus-visible:outline-3", "transition-[background] ease-out"],
+		wrapper: "flex flex-col items-center justify-center text-center",
+		icon: "shrink-0",
+		avatar: "shrink-0",
+		label: "font-medium text-default mt-2",
+		description: "text-muted mt-1",
+		actions: "flex flex-wrap gap-1.5 shrink-0 mt-4",
+		files: "",
+		file: "relative",
+		fileLeadingAvatar: "shrink-0",
+		fileWrapper: "flex flex-col min-w-0",
+		fileName: "text-default truncate",
+		fileSize: "text-muted truncate",
+		fileTrailingButton: ""
+	},
+	variants: {
+		color: {
+			primary: "",
+			secondary: "",
+			success: "",
+			info: "",
+			warning: "",
+			error: "",
+			neutral: ""
+		},
+		variant: {
+			area: {
+				wrapper: "px-4 py-3",
+				base: "p-4"
+			},
+			button: {}
+		},
+		size: {
+			xs: {
+				base: "text-xs",
+				icon: "size-4",
+				file: "text-xs px-2 py-1 gap-1",
+				fileWrapper: "flex-row gap-1"
+			},
+			sm: {
+				base: "text-xs",
+				icon: "size-4",
+				file: "text-xs px-2.5 py-1.5 gap-1.5",
+				fileWrapper: "flex-row gap-1"
+			},
+			md: {
+				base: "text-sm",
+				icon: "size-5",
+				file: "text-xs px-2.5 py-1.5 gap-1.5"
+			},
+			lg: {
+				base: "text-sm",
+				icon: "size-5",
+				file: "text-sm px-3 py-2 gap-2",
+				fileSize: "text-xs"
+			},
+			xl: {
+				base: "text-base",
+				icon: "size-6",
+				file: "text-sm px-3 py-2 gap-2"
+			}
+		},
+		layout: {
+			list: {
+				root: "gap-2 items-start",
+				files: "flex flex-col w-full gap-2",
+				file: "min-w-0 flex items-center border border-default rounded-md w-full",
+				fileTrailingButton: "ms-auto"
+			},
+			grid: {
+				fileWrapper: "hidden",
+				fileLeadingAvatar: "size-full rounded-lg",
+				fileTrailingButton: "absolute -top-1.5 -end-1.5 p-0 rounded-full border-2 border-bg"
+			}
+		},
+		position: {
+			inside: "",
+			outside: ""
+		},
+		dropzone: { true: "border-dashed data-[dragging=true]:bg-elevated/25" },
+		interactive: { true: "" },
+		highlight: { true: "" },
+		multiple: { true: "" },
+		disabled: { true: "cursor-not-allowed opacity-75" }
+	},
+	compoundVariants: [
+		{
+			color: "primary",
+			class: "outline-primary/25 focus-visible:outline-3 focus-visible:border-primary"
+		},
+		{
+			color: "secondary",
+			class: "outline-secondary/25 focus-visible:outline-3 focus-visible:border-secondary"
+		},
+		{
+			color: "success",
+			class: "outline-success/25 focus-visible:outline-3 focus-visible:border-success"
+		},
+		{
+			color: "info",
+			class: "outline-info/25 focus-visible:outline-3 focus-visible:border-info"
+		},
+		{
+			color: "warning",
+			class: "outline-warning/25 focus-visible:outline-3 focus-visible:border-warning"
+		},
+		{
+			color: "error",
+			class: "outline-error/25 focus-visible:outline-3 focus-visible:border-error"
+		},
+		{
+			color: "primary",
+			highlight: !0,
+			class: "border-primary"
+		},
+		{
+			color: "secondary",
+			highlight: !0,
+			class: "border-secondary"
+		},
+		{
+			color: "success",
+			highlight: !0,
+			class: "border-success"
+		},
+		{
+			color: "info",
+			highlight: !0,
+			class: "border-info"
+		},
+		{
+			color: "warning",
+			highlight: !0,
+			class: "border-warning"
+		},
+		{
+			color: "error",
+			highlight: !0,
+			class: "border-error"
+		},
+		{
+			color: "neutral",
+			class: "outline-inverted/25 focus-visible:outline-3 focus-visible:border-inverted"
+		},
+		{
+			color: "neutral",
+			highlight: !0,
+			class: "border-inverted"
+		},
+		{
+			size: "xs",
+			layout: "list",
+			class: { fileTrailingButton: "-me-1" }
+		},
+		{
+			size: "sm",
+			layout: "list",
+			class: { fileTrailingButton: "-me-1.5" }
+		},
+		{
+			size: "md",
+			layout: "list",
+			class: { fileTrailingButton: "-me-1.5" }
+		},
+		{
+			size: "lg",
+			layout: "list",
+			class: { fileTrailingButton: "-me-2" }
+		},
+		{
+			size: "xl",
+			layout: "list",
+			class: { fileTrailingButton: "-me-2" }
+		},
+		{
+			variant: "button",
+			size: "xs",
+			class: { base: "p-1" }
+		},
+		{
+			variant: "button",
+			size: "sm",
+			class: { base: "p-1.5" }
+		},
+		{
+			variant: "button",
+			size: "md",
+			class: { base: "p-1.5" }
+		},
+		{
+			variant: "button",
+			size: "lg",
+			class: { base: "p-2" }
+		},
+		{
+			variant: "button",
+			size: "xl",
+			class: { base: "p-2" }
+		},
+		{
+			layout: "grid",
+			multiple: !0,
+			class: {
+				files: "grid grid-cols-2 md:grid-cols-3 gap-4 w-full",
+				file: "p-0 aspect-square"
+			}
+		},
+		{
+			layout: "grid",
+			multiple: !1,
+			class: { file: "absolute inset-0 p-0" }
+		},
+		{
+			interactive: !0,
+			disabled: !1,
+			class: "hover:bg-elevated/25"
+		}
+	],
+	defaultVariants: {
+		color: "primary",
+		variant: "area",
+		size: "md"
+	}
+}, Se = /*@__PURE__*/ Object.assign({ inheritAttrs: !1 }, {
+	__name: "FileUpload",
+	props: /*@__PURE__*/ M({
+		as: {
+			type: null,
+			required: !1
+		},
+		id: {
+			type: String,
+			required: !1
+		},
+		name: {
+			type: String,
+			required: !1
+		},
+		icon: {
+			type: [String, Boolean],
+			required: !1,
+			skipCheck: !0
+		},
+		label: {
+			type: String,
+			required: !1
+		},
+		description: {
+			type: String,
+			required: !1
+		},
+		color: {
+			type: null,
+			required: !1
+		},
+		variant: {
+			type: null,
+			required: !1
+		},
+		size: {
+			type: null,
+			required: !1
+		},
+		layout: {
+			type: null,
+			required: !1,
+			default: "grid"
+		},
+		position: {
+			type: null,
+			required: !1,
+			default: "outside"
+		},
+		highlight: {
+			type: Boolean,
+			required: !1
+		},
+		accept: {
+			type: String,
+			required: !1,
+			default: "*"
+		},
+		multiple: {
+			type: Boolean,
+			required: !1,
+			default: !1
+		},
+		reset: {
+			type: Boolean,
+			required: !1,
+			default: !1
+		},
+		dropzone: {
+			type: Boolean,
+			required: !1,
+			default: !0
+		},
+		interactive: {
+			type: Boolean,
+			required: !1,
+			default: !0
+		},
+		required: {
+			type: Boolean,
+			required: !1
+		},
+		disabled: {
+			type: Boolean,
+			required: !1
+		},
+		fileIcon: {
+			type: null,
+			required: !1
+		},
+		fileImage: {
+			type: Boolean,
+			required: !1,
+			default: !0
+		},
+		fileDelete: {
+			type: [Boolean, Object],
+			required: !1,
+			default: !0
+		},
+		fileDeleteIcon: {
+			type: null,
+			required: !1
+		},
+		preview: {
+			type: Boolean,
+			required: !1,
+			default: !0
+		},
+		class: {
+			type: null,
+			required: !1
+		},
+		ui: {
+			type: Object,
+			required: !1
+		}
+	}, {
+		modelValue: { type: null },
+		modelModifiers: {}
+	}),
+	emits: /*@__PURE__*/ M(["change"], ["update:modelValue"]),
+	setup(r, { expose: i, emit: a, attrs: s }) {
+		let c = r, u = a, _ = se(), v = ae(r, "modelValue"), y = o("fileUpload", c), b = e(), { t: te } = t(), [ne, E] = ee(), { accept: M, multiple: N, reset: R } = ie(c), { isDragging: oe, open: B, inputRef: U, dropzoneRef: W } = ye({
+			accept: M,
+			reset: R,
+			multiple: N,
+			dropzone: y.dropzone,
+			onUpdate: Ce
+		}), { emitFormInput: G, emitFormChange: ue, id: de, name: fe, size: pe, color: me, highlight: K, disabled: he, ariaAttrs: q } = f(c), ge = T(() => me.value ?? y.color), _e = T(() => K.value ?? y.highlight), J = T(() => pe.value ?? y.size), Y = T(() => he.value ?? y.disabled), X = T(() => y.multiple ? "area" : y.variant), ve = T(() => y.variant === "button" && !y.multiple ? "grid" : y.layout), Z = T(() => ve.value === "grid" && y.multiple ? "inside" : X.value === "button" ? "outside" : y.position), Q = T(() => g({
+			extend: xe,
+			...b.ui?.fileUpload || {}
+		})({
+			dropzone: y.dropzone,
+			interactive: y.interactive,
+			color: ge.value,
+			size: J.value,
+			variant: X.value,
+			layout: ve.value,
+			position: Z.value,
+			multiple: y.multiple,
+			highlight: _e.value,
+			disabled: Y.value
+		}));
+		function be(e) {
+			if (y.fileImage) return URL.createObjectURL(e);
+		}
+		function Se(e) {
+			if (e === 0) return "0B";
+			let t = 1024, n = [
+				"B",
+				"KB",
+				"MB",
+				"GB"
+			], r = Math.floor(Math.log(e) / Math.log(t)), i = e / t ** r;
+			return `${r === 0 ? i.toString() : i.toFixed(0)}${n[r]}`;
+		}
+		function Ce(e, t = !1) {
+			if (Y.value) return;
+			if (y.multiple) {
+				if (t) v.value = e;
+				else {
+					let t = v.value || [];
+					v.value = [...t, ...e || []];
+				}
+			} else v.value = e?.[0] ?? null;
+			let n = new Event("change", { target: { value: v.value } });
+			u("change", n), ue(), G();
+		}
+		function $(e) {
+			if (!v.value) return;
+			if (!y.multiple || e === void 0) {
+				Ce([], !0), W.value?.focus();
+				return;
+			}
+			let t = [...v.value];
+			t.splice(e, 1), Ce(t, !0), W.value?.focus();
+		}
+		return w(v, (e) => {
+			(y.multiple ? !e?.length : !e) && U.value?.$el && (U.value.$el.value = "");
+		}), i({
+			inputRef: I(() => U.value?.$el),
+			dropzoneRef: W
+		}), (e, t) => (L(), O(V, null, [P(C(ne), null, {
+			default: A(() => [C(y).preview && v.value && (!Array.isArray(v.value) || v.value.length) ? (L(), O(V, { key: 0 }, [
+				j(e.$slots, "files-top", {
+					files: v.value,
+					open: C(B),
+					removeFile: $
+				}),
+				z("div", {
+					"data-slot": "files",
+					class: H(Q.value.files({ class: C(y).ui?.files }))
+				}, [j(e.$slots, "files", {
+					files: v.value,
+					removeFile: $
+				}, () => [(L(!0), O(V, null, k(Array.isArray(v.value) ? v.value : [v.value], (t, n) => (L(), O("div", {
+					key: t.name,
+					"data-slot": "file",
+					class: H(Q.value.file({ class: C(y).ui?.file }))
+				}, [j(e.$slots, "file", {
+					file: t,
+					index: n,
+					removeFile: $
+				}, () => [
+					j(e.$slots, "file-leading", {
+						file: t,
+						index: n,
+						ui: Q.value
+					}, () => [P(p, {
+						as: { img: "img" },
+						src: be(t),
+						icon: C(y).fileIcon || C(b).ui.icons.file,
+						size: J.value,
+						"data-slot": "fileLeadingAvatar",
+						class: H(Q.value.fileLeadingAvatar({ class: C(y).ui?.fileLeadingAvatar }))
+					}, null, 8, [
+						"src",
+						"icon",
+						"size",
+						"class"
+					])]),
+					z("div", {
+						"data-slot": "fileWrapper",
+						class: H(Q.value.fileWrapper({ class: C(y).ui?.fileWrapper }))
+					}, [z("span", {
+						"data-slot": "fileName",
+						class: H(Q.value.fileName({ class: C(y).ui?.fileName }))
+					}, [j(e.$slots, "file-name", {
+						file: t,
+						index: n
+					}, () => [S(F(t.name), 1)])], 2), z("span", {
+						"data-slot": "fileSize",
+						class: H(Q.value.fileSize({ class: C(y).ui?.fileSize }))
+					}, [j(e.$slots, "file-size", {
+						file: t,
+						index: n
+					}, () => [S(F(Se(t.size)), 1)])], 2)], 2),
+					j(e.$slots, "file-trailing", {
+						file: t,
+						index: n,
+						ui: Q.value,
+						removeFile: $
+					}, () => [C(y).fileDelete ? (L(), x(m, re({
+						key: 0,
+						color: "neutral"
+					}, { ref_for: !0 }, {
+						...ve.value === "grid" ? {
+							variant: "solid",
+							size: "xs"
+						} : {
+							variant: "link",
+							size: J.value
+						},
+						...typeof C(y).fileDelete == "object" ? C(y).fileDelete : void 0
+					}, {
+						"aria-label": C(te)("fileUpload.removeFile", { filename: t.name }),
+						"trailing-icon": C(y).fileDeleteIcon || C(b).ui.icons.close,
+						"data-slot": "fileTrailingButton",
+						class: Q.value.fileTrailingButton({ class: C(y).ui?.fileTrailingButton }),
+						onClick: d((e) => $(n), ["stop", "prevent"])
+					}), null, 16, [
+						"aria-label",
+						"trailing-icon",
+						"class",
+						"onClick"
+					])) : D("", !0)])
+				])], 2))), 128))])], 2),
+				j(e.$slots, "files-bottom", {
+					files: v.value,
+					open: C(B),
+					removeFile: $
+				})
+			], 64)) : D("", !0)]),
+			_: 3
+		}), P(C(n), {
+			as: C(y).as,
+			"data-slot": s["data-slot"] ?? "root",
+			class: H(Q.value.root({ class: [C(y).ui?.root, C(y).class] }))
+		}, {
+			default: A(() => [j(e.$slots, "default", {
+				open: C(B),
+				removeFile: $,
+				ui: Q.value
+			}, () => [(L(), x(ce(X.value === "button" ? "button" : "div"), {
+				ref_key: "dropzoneRef",
+				ref: W,
+				type: X.value === "button" ? "button" : void 0,
+				role: X.value === "button" ? void 0 : "button",
+				disabled: X.value === "button" ? Y.value : void 0,
+				"aria-disabled": X.value === "button" ? void 0 : Y.value || void 0,
+				"data-dragging": C(oe),
+				"data-slot": "base",
+				class: H(Q.value.base({ class: C(y).ui?.base })),
+				tabindex: C(y).interactive && !Y.value ? 0 : -1,
+				onClick: t[0] ||= (e) => C(y).interactive && !Y.value && C(B)(),
+				onKeydown: t[1] ||= h(d(() => {}, ["prevent"]), ["space"]),
+				onKeyup: t[2] ||= h((e) => C(y).interactive && !Y.value && C(B)(), ["enter", "space"])
+			}, {
+				default: A(() => [Z.value === "inside" ? (L(), x(C(E), { key: 0 })) : D("", !0), Z.value !== "inside" || !C(y).preview || (C(N) ? !v.value?.length : !v.value) ? (L(), O("div", {
+					key: 1,
+					"data-slot": "wrapper",
+					class: H(Q.value.wrapper({ class: C(y).ui?.wrapper }))
+				}, [j(e.$slots, "leading", { ui: Q.value }, () => [C(y).icon === !1 ? D("", !0) : (L(), O(V, { key: 0 }, [X.value === "button" ? (L(), x(l, {
+					key: 0,
+					name: C(y).icon ?? C(b).ui.icons.upload,
+					"data-slot": "icon",
+					class: H(Q.value.icon({ class: C(y).ui?.icon }))
+				}, null, 8, ["name", "class"])) : (L(), x(p, {
+					key: 1,
+					icon: C(y).icon ?? C(b).ui.icons.upload,
+					size: J.value,
+					"data-slot": "avatar",
+					class: H(Q.value.avatar({ class: C(y).ui?.avatar }))
+				}, null, 8, [
+					"icon",
+					"size",
+					"class"
+				]))], 64))]), X.value === "button" ? D("", !0) : (L(), O(V, { key: 0 }, [
+					C(y).label || _.label ? (L(), O("div", {
+						key: 0,
+						"data-slot": "label",
+						class: H(Q.value.label({ class: C(y).ui?.label }))
+					}, [j(e.$slots, "label", {}, () => [S(F(C(y).label), 1)])], 2)) : D("", !0),
+					C(y).description || _.description ? (L(), O("div", {
+						key: 1,
+						"data-slot": "description",
+						class: H(Q.value.description({ class: C(y).ui?.description }))
+					}, [j(e.$slots, "description", {}, () => [S(F(C(y).description), 1)])], 2)) : D("", !0),
+					_.actions ? (L(), O("div", {
+						key: 2,
+						"data-slot": "actions",
+						class: H(Q.value.actions({ class: C(y).ui?.actions }))
+					}, [j(e.$slots, "actions", {
+						files: v.value,
+						open: C(B),
+						removeFile: $
+					})], 2)) : D("", !0)
+				], 64))], 2)) : D("", !0)]),
+				_: 3
+			}, 40, [
+				"type",
+				"role",
+				"disabled",
+				"aria-disabled",
+				"data-dragging",
+				"class",
+				"tabindex"
+			])), Z.value === "outside" ? (L(), x(C(E), { key: 0 })) : D("", !0)]), P(C(le), re({
+				id: C(de),
+				ref_key: "inputRef",
+				ref: U,
+				as: "input",
+				type: "file",
+				feature: "fully-hidden",
+				name: C(fe),
+				accept: C(M),
+				multiple: C(N),
+				required: C(y).required,
+				disabled: Y.value
+			}, {
+				...s,
+				...C(q),
+				"data-slot": void 0
+			}), null, 16, [
+				"id",
+				"name",
+				"accept",
+				"multiple",
+				"required",
+				"disabled"
+			])]),
+			_: 3
+		}, 8, [
+			"as",
+			"data-slot",
+			"class"
+		])], 64));
+	}
+}), Ce = /* @__PURE__ */ E({
+	__name: "MediaUploadThumbnail",
+	props: { file: {} },
+	setup(e) {
+		let t = e, n = T(() => t.file.type.startsWith("image/") ? t.file : void 0), r = s(n), i = T(() => n.value ? "i-lucide-image-off" : he(t.file.type));
+		return (e, t) => (L(), x(p, {
+			key: C(r),
+			as: { img: "img" },
+			src: C(r),
+			icon: i.value,
+			alt: "",
+			class: "size-12 shrink-0 rounded-lg bg-muted ring-1 ring-default",
+			ui: {
+				image: "object-cover",
+				icon: "size-5 text-muted"
+			}
+		}, null, 8, ["src", "icon"]));
+	}
+}), $ = { class: "@container min-w-0 space-y-3" }, we = {
+	key: 0,
+	class: "text-xs text-muted",
+	role: "status"
+}, Te = ["aria-label"], Ee = { class: "min-w-0" }, De = {
+	class: "text-sm/6 text-highlighted wrap-anywhere",
+	dir: "auto"
+}, Oe = { class: "mt-1 text-xs text-muted" }, ke = {
+	key: 0,
+	class: "mt-1 flex items-center gap-1 text-xs text-muted",
+	role: "status"
+}, Ae = {
+	key: 1,
+	class: "mt-1 text-xs text-error",
+	role: "status"
+}, je = { class: "flex gap-1 @max-[14rem]:justify-self-end" }, Me = ["aria-label"], Ne = { class: "text-xs text-muted" }, Pe = 50, Fe = /* @__PURE__ */ E({
+	__name: "MediaUploadFileQueue",
+	props: {
+		entries: {},
+		disabled: { type: Boolean }
+	},
+	emits: ["remove", "retry"],
+	setup(e, { emit: t }) {
+		let { t: n, number: r, locale: i } = _(), a = e, o = t, s = U(1), c = T(() => Math.max(1, Math.ceil(a.entries.length / Pe))), u = T(() => (s.value - 1) * Pe), d = T(() => a.entries.slice(u.value, u.value + Pe));
+		return w(() => a.entries.length, (e, t) => {
+			s.value = e > t ? 1 : Math.min(s.value, c.value);
+		}), (t, a) => (L(), O("div", $, [
+			c.value > 1 ? (L(), O("p", we, F(C(n)("media.file-range", {
+				start: u.value + 1,
+				end: Math.min(u.value + Pe, e.entries.length),
+				count: e.entries.length
+			})), 1)) : D("", !0),
+			z("ul", {
+				"aria-label": C(n)("media-upload-file-queue.selected-files"),
+				class: "divide-y divide-default"
+			}, [(L(!0), O(V, null, k(d.value, (t) => (L(), O("li", {
+				key: t.id,
+				class: "grid min-w-0 grid-cols-[48px_minmax(0,1fr)_auto] items-start gap-3 py-3 @max-[14rem]:grid-cols-1"
+			}, [
+				P(Ce, { file: t.file }, null, 8, ["file"]),
+				z("div", Ee, [
+					z("p", De, F(t.file.name), 1),
+					z("p", Oe, F(C(K)(t.file.size, C(i), C(n))), 1),
+					t.status === "uploading" ? (L(), O("p", ke, [P(l, {
+						name: "i-lucide-loader-circle",
+						class: "size-3 motion-safe:animate-spin"
+					}), S(" " + F(C(n)("media-upload-file-queue.uploading")), 1)])) : D("", !0),
+					t.error ? (L(), O("p", Ae, F(t.error), 1)) : D("", !0)
+				]),
+				z("div", je, [t.status === "failed" ? (L(), x(m, {
+					key: 0,
+					icon: "i-lucide-rotate-ccw",
+					color: "neutral",
+					variant: "ghost",
+					"aria-label": C(n)("media.retry-file", { name: t.file.name }),
+					disabled: e.disabled,
+					onClick: (e) => o("retry", t.id)
+				}, null, 8, [
+					"aria-label",
+					"disabled",
+					"onClick"
+				])) : D("", !0), P(m, {
+					icon: "i-lucide-x",
+					color: "neutral",
+					variant: "ghost",
+					"aria-label": C(n)("media.remove-file", { name: t.file.name }),
+					disabled: e.disabled,
+					onClick: (e) => o("remove", t.id)
+				}, null, 8, [
+					"aria-label",
+					"disabled",
+					"onClick"
+				])])
+			]))), 128))], 8, Te),
+			c.value > 1 ? (L(), O("nav", {
+				key: 1,
+				"aria-label": C(n)("media-upload-file-queue.selected-file-pages"),
+				class: "flex flex-wrap items-center justify-between gap-2"
+			}, [
+				P(m, {
+					label: C(n)("media-upload-file-queue.previous"),
+					variant: "outline",
+					disabled: s.value === 1,
+					onClick: a[0] ||= (e) => s.value--
+				}, null, 8, ["label", "disabled"]),
+				z("span", Ne, F(s.value) + " / " + F(C(r)(c.value)), 1),
+				P(m, {
+					label: C(n)("media-upload-file-queue.next"),
+					variant: "outline",
+					disabled: s.value === c.value,
+					onClick: a[1] ||= (e) => s.value++
+				}, null, 8, ["label", "disabled"])
+			], 8, Me)) : D("", !0)
+		]));
+	}
+}), Ie = new Set(q);
+function Le(e, t, n = Ie, r = fe, i = "en") {
+	if (!n.has(e.type)) return r("media.unsupported");
+	if (!e.size) return r("media.empty");
+	let a = v(e.type, t);
+	if (e.size > a) return r("media.too-large", { size: K(a, i, r) });
+}
+function Re(e = Ie) {
+	let { t, locale: n } = _(), r = y(), i = b(), a = te(), o = U([]), s = U(!1), c = 1;
+	function l(t) {
+		o.value = [...o.value, ...t.map((t) => {
+			let n = Le(t, a.configuration.mediaUploadLimit, G(e));
+			return {
+				id: c++,
+				file: t,
+				status: n ? "invalid" : "pending",
+				error: n
+			};
+		})];
+	}
+	function u() {
+		s.value || (o.value = []);
+	}
+	function d(e) {
+		s.value || (o.value = o.value.filter((t) => t.id !== e));
+	}
+	function f(e, t) {
+		o.value = o.value.map((n) => n.id === e ? {
+			...n,
+			...t
+		} : n);
+	}
+	async function p(e, t) {
+		if (s.value) return [];
+		let n = o.value.filter((e) => (!t || t.has(e.id)) && (e.status === "pending" || e.status === "failed"));
+		if (!n.length) return [];
+		s.value = !0;
+		let r = Array(n.length).fill(void 0);
+		try {
+			let t = 0;
+			return await Promise.all(Array.from({ length: Math.min(2, n.length) }, async () => {
+				for (; t < n.length;) {
+					let a = t++, s = n[a];
+					f(s.id, {
+						status: "uploading",
+						error: void 0
+					});
+					try {
+						r[a] = await i.upload(s.file, e), o.value = o.value.filter((e) => e.id !== s.id);
+					} catch (e) {
+						f(s.id, {
+							status: "failed",
+							failure: e
+						});
+					}
+				}
+			})), r.filter((e) => e !== void 0);
+		} finally {
+			s.value = !1;
+		}
+	}
+	return {
+		entries: T(() => o.value.map((i) => {
+			let o = i.error;
+			return i.status === "invalid" && (o = Le(i.file, a.configuration.mediaUploadLimit, G(e), t, n.value)), i.status === "failed" && (o = r(i.failure, t("media.upload-failed"))), {
+				id: i.id,
+				file: i.file,
+				status: i.status,
+				error: o
+			};
+		})),
+		isUploading: oe(s),
+		add: l,
+		clear: u,
+		remove: d,
+		upload: p
+	};
+}
+//#endregion
+//#region src/media/MediaUploadPanel.vue?vue&type=script&setup=true&lang.ts
+var ze = { class: "flex min-w-0 flex-col gap-6" }, Be = { class: "flex min-w-0 items-center gap-3 text-sm" }, Ve = { class: "grid size-9 shrink-0 place-items-center rounded-lg bg-muted" }, He = { class: "w-full min-w-0 space-y-4" }, Ue = {
+	key: 1,
+	class: "text-xs/5 text-muted"
+}, We = {
+	class: "text-xs text-muted",
+	role: "status",
+	"aria-live": "polite"
+}, Ge = { class: "flex flex-wrap justify-end gap-2" }, Ke = { class: "text-xs/5 text-muted" }, qe = /* @__PURE__ */ E({
+	__name: "MediaUploadPanel",
+	props: { kind: {} },
+	emits: ["uploaded"],
+	setup(e, { expose: t, emit: n }) {
+		let { t: r, locale: i } = _(), o = ne(), s = e, c = te(), { pointer: u } = ge(), d = n, f = U(!1), p = U(""), h = _e(() => J.mediaFolders, [], { active: f }), ee = T(() => [{
+			label: r("media-asset-details.no-folder"),
+			value: me
+		}, ...[.../* @__PURE__ */ new Set([p.value, ...h.data.value.map((e) => e.folder)])].filter(Boolean).sort((e, t) => e.localeCompare(t)).map((e) => ({
+			label: e,
+			value: e
+		}))]), g = T({
+			get: () => p.value || "/__unfiled__",
+			set: (e) => {
+				p.value = e === "/__unfiled__" ? "" : e;
+			}
+		}), y = a("(max-width: 639px)"), b = U([]), re = T(() => ({
+			all: {
+				mimeTypes: q,
+				title: r("media-upload-panel.upload-media"),
+				description: r("media-upload-panel.bring-your-images-videos-and-documents-into"),
+				label: r("media-upload-panel.drop-your-files-here"),
+				formats: "AVIF, GIF, JPEG, PNG, WebP, MP4, WebM, or PDF"
+			},
+			image: {
+				mimeTypes: q.filter((e) => e.startsWith("image/")),
+				title: r("media-upload-panel.upload-images"),
+				description: r("media-upload-panel.add-images-to-your-library"),
+				label: r("media-upload-panel.drop-images-here"),
+				formats: "AVIF, GIF, JPEG, PNG, or WebP"
+			},
+			video: {
+				mimeTypes: q.filter((e) => e.startsWith("video/")),
+				title: r("media-upload-panel.upload-videos"),
+				description: r("media-upload-panel.add-videos-to-your-library"),
+				label: r("media-upload-panel.drop-videos-here"),
+				formats: "MP4 or WebM"
+			}
+		})), S = T(() => {
+			let e = re.value[s.kind ?? "all"];
+			return {
+				...e,
+				accept: e.mimeTypes.join(",")
+			};
+		}), E = T(() => {
+			let e = K(v("image/png", c.configuration.mediaUploadLimit), i.value, r), t = K(c.configuration.mediaUploadLimit, i.value, r);
+			return s.kind === "image" ? r("media.limit-each", { size: e }) : s.kind === "video" ? r("media.limit-each", { size: t }) : r("media.limits", {
+				imageSize: e,
+				videoSize: t
+			});
+		}), k = Re(() => new Set(S.value.mimeTypes)), j = T(() => K(k.entries.value.reduce((e, t) => e + t.file.size, 0), i.value, r)), M = T(() => k.entries.value.filter((e) => e.status === "pending" || e.status === "failed")), ie = T(() => M.value.length > 0 && M.value.every((e) => e.status === "failed") ? r("media-upload-panel.retry-failed-files") : r("media-upload-panel.add-to-library"));
+		w(b, (e) => {
+			e?.length && (k.add(e), b.value = []);
+		});
+		function ae(e = {}) {
+			f.value || (k.clear(), p.value = e.folder ?? "Uploads"), e.files?.length && k.add(e.files), f.value = !0;
+		}
+		function I(e) {
+			(e || !k.isUploading.value) && (f.value = e, e || (k.clear(), b.value = []));
+		}
+		async function R(e) {
+			let t = await k.upload(p.value.trim(), e);
+			t.length && d("uploaded", t), k.entries.value.length || I(!1);
+		}
+		return t({ open: ae }), (e, t) => {
+			let n = l, i = ue, a = de, s = pe, c = m, d = Se, p = Y;
+			return L(), x(p, {
+				open: f.value,
+				transition: C(u),
+				close: !C(k).isUploading.value,
+				dismissible: !C(k).isUploading.value,
+				title: S.value.title,
+				description: S.value.description,
+				ui: { footer: "flex-col items-stretch gap-4" },
+				"onUpdate:open": I
+			}, {
+				body: A(() => [z("div", ze, [
+					z("div", Be, [z("span", Ve, [P(n, {
+						name: "i-lucide-folder",
+						class: "size-4 text-muted"
+					})]), P(a, {
+						label: C(r)("media-upload-panel.adding-to"),
+						class: "min-w-0 flex-1"
+					}, {
+						default: A(() => [P(i, {
+							modelValue: g.value,
+							"onUpdate:modelValue": t[0] ||= (e) => g.value = e,
+							items: ee.value,
+							"value-key": "value",
+							"aria-label": C(r)("media-upload-panel.upload-folder"),
+							class: "w-full",
+							loading: C(h).loading.value,
+							disabled: C(k).isUploading.value
+						}, null, 8, [
+							"modelValue",
+							"items",
+							"aria-label",
+							"loading",
+							"disabled"
+						])]),
+						_: 1
+					}, 8, ["label"])]),
+					C(h).error.value ? (L(), x(s, {
+						key: 0,
+						role: "alert",
+						title: C(r)("media-upload-panel.folders-could-not-be-loaded"),
+						description: C(h).error.value,
+						color: "error",
+						variant: "subtle",
+						actions: [{
+							label: C(o).actions.retry,
+							onClick: () => C(h).refresh()
+						}]
+					}, null, 8, [
+						"title",
+						"description",
+						"actions"
+					])) : D("", !0),
+					z("div", He, [P(d, {
+						modelValue: b.value,
+						"onUpdate:modelValue": t[1] ||= (e) => b.value = e,
+						class: "w-full min-w-0",
+						accept: S.value.accept,
+						multiple: "",
+						reset: "",
+						layout: "list",
+						color: "neutral",
+						icon: "i-lucide-upload",
+						label: S.value.label,
+						description: C(r)("media-upload-panel.or-click-to-choose-from-your-device"),
+						"file-image": !1,
+						preview: !1,
+						dropzone: !C(y),
+						disabled: C(k).isUploading.value,
+						interactive: !C(k).isUploading.value
+					}, N({ _: 2 }, [C(y) ? {
+						name: "default",
+						fn: A(({ open: e }) => [P(c, {
+							label: C(r)("media-upload-panel.choose-files"),
+							icon: "i-lucide-plus",
+							color: "neutral",
+							variant: "outline",
+							class: "w-full justify-center",
+							disabled: C(k).isUploading.value,
+							onClick: (t) => e()
+						}, null, 8, [
+							"label",
+							"disabled",
+							"onClick"
+						])]),
+						key: "0"
+					} : void 0]), 1032, [
+						"modelValue",
+						"accept",
+						"label",
+						"description",
+						"dropzone",
+						"disabled",
+						"interactive"
+					]), C(k).entries.value.length ? (L(), x(Fe, {
+						key: 0,
+						entries: C(k).entries.value,
+						disabled: C(k).isUploading.value,
+						onRemove: C(k).remove,
+						onRetry: t[2] ||= (e) => R(/* @__PURE__ */ new Set([e]))
+					}, null, 8, [
+						"entries",
+						"disabled",
+						"onRemove"
+					])) : D("", !0)]),
+					C(k).entries.value.length ? D("", !0) : (L(), O("p", Ue, F(C(r)("media-upload-panel.choose-several-files-at-once-you-can")), 1))
+				])]),
+				footer: A(() => [
+					z("p", We, F(C(k).entries.value.length ? C(r)("media.files-selected", {
+						count: C(k).entries.value.length,
+						size: j.value
+					}) : C(r)("media-upload-panel.no-files-selected-yet")), 1),
+					z("div", Ge, [P(c, {
+						label: C(o).actions.cancel,
+						color: "neutral",
+						variant: "outline",
+						disabled: C(k).isUploading.value,
+						onClick: t[3] ||= (e) => I(!1)
+					}, null, 8, ["label", "disabled"]), P(c, {
+						label: ie.value,
+						color: "neutral",
+						loading: C(k).isUploading.value,
+						disabled: !M.value.length,
+						onClick: t[4] ||= (e) => R()
+					}, null, 8, [
+						"label",
+						"loading",
+						"disabled"
+					])]),
+					z("p", Ke, F(C(r)("media.formats-limits", {
+						formats: S.value.formats,
+						limits: E.value
+					})), 1)
+				]),
+				_: 1
+			}, 8, [
+				"open",
+				"transition",
+				"close",
+				"dismissible",
+				"title",
+				"description"
+			]);
+		};
+	}
+});
+//#endregion
+export { be as n, qe as t };