your-ai-workflow-firebase-os 2.0.1 → 2.0.3

package/dist/FileViewerPopup-CX-J75TM.js

@@ -0,0 +1,1283 @@
+import { Nn as e, cr as t, sr as n } from "./TimeZoneField-DkI1Bkcz.js";
+import { C as r, Et as i, Ft as a, Gt as o, Ht as s, It as c, J as l, L as u, Lt as d, Pt as f, Q as p, Rt as m, U as h, Ut as g, Z as _, an as v, at as y, b, d as x, f as S, ht as C, i as w, in as ee, k as te, mt as ne, nt as re, o as T, p as ie, q as E, r as ae, sn as oe, st as se, vt as D } from "./lucide-react-CA7GD7Nv.js";
+import { a as O, i as k, l as ce, o as A, r as le, t as ue } from "./mediaKind-DmKMsjeY.js";
+import { a as de, i as j, n as fe, r as pe, t as me } from "./fileBytes-bjgvCfWu.js";
+import { forwardRef as M, useCallback as he, useEffect as N, useImperativeHandle as ge, useLayoutEffect as P, useRef as F, useState as I } from "react";
+import { Fragment as _e, jsx as L, jsxs as R } from "react/jsx-runtime";
+import { createPortal as ve } from "react-dom";
+//#region src/components/media/VideoPlayer.tsx
+var z = [
+	.5,
+	.75,
+	1,
+	1.25,
+	1.5,
+	2
+], B = (e) => {
+	let t = Number.isFinite(e) && e > 0 ? e : 0, n = Math.floor(t / 3600), r = Math.floor(t % 3600 / 60), i = String(Math.floor(t % 60)).padStart(2, "0");
+	return n ? `${n}:${String(r).padStart(2, "0")}:${i}` : `${r}:${i}`;
+}, V = "w-9 h-9 shrink-0 rounded-full flex items-center justify-center text-white/85 hover:text-white hover:bg-white/15 transition-colors cursor-pointer outline-none focus-visible:ring-2 focus-visible:ring-accent", ye = "absolute inset-0 m-auto w-16 h-16 md:w-20 md:h-20 rounded-full bg-accent text-[var(--button-fg,#fff)] flex items-center justify-center shadow-2xl shadow-black/40 ring-8 ring-accent/25 hover:scale-105 active:scale-95 transition-transform cursor-pointer outline-none focus-visible:ring-white/70", H = "relative w-full overflow-hidden rounded-2xl bg-black border border-[var(--panel-border)] shadow-xl";
+function U({ value: e, max: t, buffered: n = 0, onSeek: r, tone: i, label: a, format: o = B, step: s = 5 }) {
+	let c = F(null), l = F(!1), [u, d] = I(null), f = (e) => {
+		let t = c.current?.getBoundingClientRect();
+		return t && t.width ? Math.min(1, Math.max(0, (e - t.left) / t.width)) : 0;
+	}, p = t > 0 ? Math.min(100, e / t * 100) : 0, m = t > 0 ? Math.min(100, n / t * 100) : 0, h = i === "dark", g = u !== null && o && t > 0 ? o(u * t) : null;
+	return /* @__PURE__ */ R("div", {
+		ref: c,
+		role: "slider",
+		tabIndex: 0,
+		"aria-label": a,
+		"aria-valuemin": 0,
+		"aria-valuemax": Math.round(t) || 0,
+		"aria-valuenow": Math.round(e) || 0,
+		"aria-valuetext": o ? o(e) : `${Math.round(p)}%`,
+		className: "group/scrub relative h-4 flex items-center cursor-pointer touch-none outline-none rounded-full focus-visible:ring-2 focus-visible:ring-accent/60",
+		onPointerDown: (e) => {
+			e.stopPropagation(), e.currentTarget.setPointerCapture(e.pointerId), l.current = !0, r(f(e.clientX) * t);
+		},
+		onPointerMove: (e) => {
+			d(f(e.clientX)), l.current && r(f(e.clientX) * t);
+		},
+		onPointerUp: () => {
+			l.current = !1;
+		},
+		onPointerCancel: () => {
+			l.current = !1;
+		},
+		onPointerLeave: () => d(null),
+		onKeyDown: (n) => {
+			let i = n.key;
+			[
+				"ArrowRight",
+				"ArrowUp",
+				"ArrowLeft",
+				"ArrowDown",
+				"Home",
+				"End"
+			].includes(i) && (n.preventDefault(), n.stopPropagation(), r(i === "Home" ? 0 : i === "End" ? t : Math.min(t, Math.max(0, e + (i === "ArrowRight" || i === "ArrowUp" ? s : -s)))));
+		},
+		children: [
+			/* @__PURE__ */ R("div", {
+				className: `relative w-full h-1 group-hover/scrub:h-1.5 transition-[height] duration-150 rounded-full overflow-hidden ${h ? "bg-white/25" : "bg-foreground/10"}`,
+				children: [/* @__PURE__ */ L("div", {
+					className: `absolute inset-y-0 left-0 ${h ? "bg-white/35" : "bg-foreground/15"}`,
+					style: { width: `${m}%` }
+				}), /* @__PURE__ */ L("div", {
+					className: "absolute inset-y-0 left-0 bg-accent",
+					style: { width: `${p}%` }
+				})]
+			}),
+			/* @__PURE__ */ L("div", {
+				className: "absolute w-3 h-3 -ml-1.5 rounded-full bg-accent shadow-md scale-0 group-hover/scrub:scale-100 group-focus-visible/scrub:scale-100 transition-transform pointer-events-none",
+				style: { left: `${p}%` }
+			}),
+			g && /* @__PURE__ */ L("div", {
+				className: `absolute bottom-full mb-2 -translate-x-1/2 px-1.5 py-0.5 rounded-md text-[11px] font-semibold tabular-nums whitespace-nowrap pointer-events-none ${h ? "bg-black/80 text-white" : "bg-background text-foreground border border-[var(--panel-border)] shadow"}`,
+				style: { left: `${u * 100}%` },
+				children: g
+			})
+		]
+	});
+}
+function W({ src: e, poster: t, title: n, autoPlay: r, loop: i, muted: a, aspect: o = "16 / 9", className: s = "", onRatio: c }) {
+	let d = F(null), m = F(null), h = F(null), g = F(0), [_, v] = I(!1), [b, w] = I(!!r), [ee, te] = I(!1), [ne, re] = I(!1), [T, ae] = I(!1), [D, O] = I(0), [k, ce] = I(0), [A, le] = I(0), [ue, de] = I(1), [j, fe] = I(!!a || !!r), [pe, me] = I(1), [M, ge] = I(!1), [P, _e] = I(!1), [ve, W] = I(!0), [G, be] = I(null), K = he(() => {
+		W(!0), window.clearTimeout(g.current), g.current = window.setTimeout(() => W(!1), 2600);
+	}, []);
+	N(() => () => window.clearTimeout(g.current), []), N(() => {
+		let e = () => _e(!!d.current && document.fullscreenElement === d.current);
+		return document.addEventListener("fullscreenchange", e), () => document.removeEventListener("fullscreenchange", e);
+	}, []), N(() => {
+		if (!M) return;
+		let e = (e) => {
+			h.current?.contains(e.target) || ge(!1);
+		};
+		return document.addEventListener("pointerdown", e), () => document.removeEventListener("pointerdown", e);
+	}, [M]);
+	let q = () => {
+		let e = m.current;
+		e && (e.paused || e.ended ? e.play().catch(() => {}) : e.pause());
+	}, J = (e) => {
+		let t = m.current;
+		!t || !Number.isFinite(e) || (t.currentTime = Math.max(0, Math.min(e, Number.isFinite(t.duration) ? t.duration : e)), O(t.currentTime));
+	}, xe = (e) => {
+		let t = m.current;
+		t && (t.volume = Math.min(1, Math.max(0, e)), t.muted = t.volume === 0);
+	}, Se = () => {
+		let e = m.current;
+		e && (e.muted || e.volume === 0 ? (e.muted = !1, e.volume === 0 && (e.volume = .6)) : e.muted = !0);
+	}, Y = () => {
+		if (document.fullscreenElement) {
+			document.exitFullscreen().catch(() => {});
+			return;
+		}
+		let e = d.current;
+		e?.requestFullscreen ? e.requestFullscreen().catch(() => {}) : m.current?.webkitEnterFullscreen?.();
+	}, Ce = typeof document < "u" && "pictureInPictureEnabled" in document && document.pictureInPictureEnabled, X = async () => {
+		try {
+			document.pictureInPictureElement ? await document.exitPictureInPicture() : await m.current?.requestPictureInPicture();
+		} catch {}
+	}, we = (e) => {
+		if (e.target !== d.current) return;
+		let t = e.key.toLowerCase();
+		if (t === " " || t === "k") e.preventDefault(), q();
+		else if (t === "arrowright") e.preventDefault(), J(D + 5);
+		else if (t === "arrowleft") e.preventDefault(), J(D - 5);
+		else if (t === "arrowup") e.preventDefault(), xe(ue + .1);
+		else if (t === "arrowdown") e.preventDefault(), xe(ue - .1);
+		else if (t === "m") Se();
+		else if (t === "f") Y();
+		else return;
+		K();
+	}, Te = !_ || ve || M, Z = j || ue === 0 ? x : ue < .5 ? ie : S, Q = t || /#/.test(e) ? e : `${e}#t=0.001`, Ee = o === "auto" ? G ? String(G) : "16 / 9" : o;
+	return /* @__PURE__ */ R("div", {
+		ref: d,
+		tabIndex: 0,
+		role: "region",
+		"aria-label": n ? `Video: ${n}` : "Video player",
+		onKeyDown: we,
+		onPointerMove: K,
+		onPointerLeave: () => {
+			_ && W(!1);
+		},
+		className: `fbos-video group/player ${H} outline-none focus-visible:ring-2 focus-visible:ring-accent ${Te ? "" : "cursor-none"} ${P ? "!rounded-none !border-0" : ""} ${s}`,
+		style: P ? void 0 : { aspectRatio: Ee },
+		children: [
+			!k && !T && /* @__PURE__ */ L("span", {
+				"aria-hidden": "true",
+				className: "fbos-picture-tint fbos-video-tint absolute inset-0"
+			}),
+			/* @__PURE__ */ L("video", {
+				ref: m,
+				src: Q,
+				poster: t,
+				playsInline: !0,
+				preload: "metadata",
+				autoPlay: r,
+				loop: i,
+				muted: j,
+				className: "absolute inset-0 w-full h-full object-contain",
+				onClick: () => {
+					q(), K();
+				},
+				onDoubleClick: Y,
+				onPlay: () => {
+					v(!0), w(!0), re(!1), K();
+				},
+				onPause: () => {
+					v(!1), W(!0);
+				},
+				onEnded: () => {
+					re(!0), v(!1), W(!0);
+				},
+				onTimeUpdate: (e) => O(e.currentTarget.currentTime),
+				onLoadedMetadata: (e) => {
+					let t = e.currentTarget;
+					if (ce(t.duration), t.videoWidth && t.videoHeight) {
+						let e = t.videoWidth / t.videoHeight;
+						be(e), c?.(e);
+					}
+				},
+				onDurationChange: (e) => ce(e.currentTarget.duration),
+				onProgress: (e) => {
+					let t = e.currentTarget.buffered;
+					t.length && le(t.end(t.length - 1));
+				},
+				onWaiting: () => te(!0),
+				onPlaying: () => te(!1),
+				onCanPlay: () => te(!1),
+				onVolumeChange: (e) => {
+					de(e.currentTarget.volume), fe(e.currentTarget.muted);
+				},
+				onRateChange: (e) => me(e.currentTarget.playbackRate),
+				onError: () => ae(!0)
+			}),
+			n && !T && /* @__PURE__ */ L("div", {
+				className: `absolute inset-x-0 top-0 px-4 pt-3 pb-10 bg-gradient-to-b from-black/60 to-transparent text-white text-[13px] md:text-[14px] font-semibold truncate pointer-events-none transition-opacity duration-300 ${Te ? "opacity-100" : "opacity-0"}`,
+				children: n
+			}),
+			T ? /* @__PURE__ */ R("div", {
+				className: "absolute inset-0 flex flex-col items-center justify-center gap-2 text-white/75 text-[13px] font-medium text-center px-6",
+				children: [/* @__PURE__ */ L(f, { className: "w-8 h-8 opacity-60" }), "This video could not be played here."]
+			}) : !_ && !ee ? /* @__PURE__ */ L("button", {
+				type: "button",
+				onClick: q,
+				"aria-label": ne ? "Play again" : "Play",
+				className: ye,
+				children: ne ? /* @__PURE__ */ L(u, { className: "w-7 h-7 md:w-8 md:h-8" }) : /* @__PURE__ */ L(E, { className: "w-7 h-7 md:w-8 md:h-8 translate-x-0.5 fill-current" })
+			}) : null,
+			ee && !T && /* @__PURE__ */ L(C, { className: "absolute inset-0 m-auto w-10 h-10 text-white/90 animate-spin pointer-events-none" }),
+			!T && /* @__PURE__ */ R("div", {
+				className: `absolute inset-x-0 bottom-0 px-2.5 md:px-4 pb-1.5 md:pb-2.5 pt-12 bg-gradient-to-t from-black/75 via-black/35 to-transparent transition-opacity duration-300 ${Te && b ? "opacity-100" : "opacity-0 pointer-events-none"}`,
+				children: [/* @__PURE__ */ L(U, {
+					value: D,
+					max: k,
+					buffered: A,
+					onSeek: J,
+					tone: "dark",
+					label: "Time"
+				}), /* @__PURE__ */ R("div", {
+					className: "flex items-center gap-0.5 md:gap-1 mt-0.5",
+					children: [
+						/* @__PURE__ */ L("button", {
+							type: "button",
+							className: V,
+							onClick: q,
+							"aria-label": _ ? "Pause" : "Play",
+							children: _ ? /* @__PURE__ */ L(p, { className: "w-[18px] h-[18px] fill-current" }) : /* @__PURE__ */ L(E, { className: "w-[18px] h-[18px] fill-current translate-x-px" })
+						}),
+						/* @__PURE__ */ R("div", {
+							className: "group/vol flex items-center",
+							children: [/* @__PURE__ */ L("button", {
+								type: "button",
+								className: V,
+								onClick: Se,
+								"aria-label": j ? "Turn the sound on" : "Mute",
+								children: /* @__PURE__ */ L(Z, { className: "w-[18px] h-[18px]" })
+							}), /* @__PURE__ */ L("div", {
+								className: "max-sm:hidden w-0 group-hover/vol:w-[76px] group-focus-within/vol:w-[76px] overflow-hidden transition-[width] duration-200",
+								children: /* @__PURE__ */ L("div", {
+									className: "w-[68px] ml-1",
+									children: /* @__PURE__ */ L(U, {
+										value: j ? 0 : ue,
+										max: 1,
+										onSeek: xe,
+										tone: "dark",
+										label: "Volume",
+										format: null,
+										step: .1
+									})
+								})
+							})]
+						}),
+						/* @__PURE__ */ R("span", {
+							className: "px-1.5 text-[12px] md:text-[12.5px] font-semibold text-white/90 tabular-nums whitespace-nowrap select-none",
+							children: [
+								B(D),
+								" ",
+								/* @__PURE__ */ R("span", {
+									className: "text-white/50",
+									children: ["/ ", B(k)]
+								})
+							]
+						}),
+						/* @__PURE__ */ L("div", { className: "flex-1" }),
+						/* @__PURE__ */ R("div", {
+							ref: h,
+							className: "relative",
+							children: [/* @__PURE__ */ R("button", {
+								type: "button",
+								className: `${V} !w-auto px-2.5 text-[12px] font-bold tabular-nums`,
+								onClick: () => ge((e) => !e),
+								"aria-label": "Playback speed",
+								"aria-expanded": M,
+								children: [pe, "×"]
+							}), M && /* @__PURE__ */ L("div", {
+								role: "menu",
+								className: "absolute bottom-full right-0 mb-2 py-1 min-w-[108px] rounded-xl bg-black/85 backdrop-blur-md border border-white/10 shadow-2xl",
+								children: z.map((e) => /* @__PURE__ */ R("button", {
+									type: "button",
+									role: "menuitemradio",
+									"aria-checked": e === pe,
+									onClick: () => {
+										m.current && (m.current.playbackRate = e), ge(!1);
+									},
+									className: `w-full px-3 py-1.5 flex items-center justify-between gap-3 text-left text-[12.5px] font-semibold tabular-nums hover:bg-white/10 cursor-pointer ${e === pe ? "text-accent" : "text-white/85"}`,
+									children: [e === 1 ? "Normal" : `${e}×`, e === pe && /* @__PURE__ */ L(oe, { className: "w-3.5 h-3.5" })]
+								}, e))
+							})]
+						}),
+						Ce && /* @__PURE__ */ L("span", {
+							className: "max-sm:hidden",
+							children: /* @__PURE__ */ L("button", {
+								type: "button",
+								className: V,
+								onClick: X,
+								"aria-label": "Picture in picture",
+								children: /* @__PURE__ */ L(l, { className: "w-[18px] h-[18px]" })
+							})
+						}),
+						/* @__PURE__ */ L("button", {
+							type: "button",
+							className: V,
+							onClick: Y,
+							"aria-label": P ? "Leave full screen" : "Full screen",
+							children: L(P ? y : se, { className: "w-[18px] h-[18px]" })
+						})
+					]
+				})]
+			})
+		]
+	});
+}
+function G({ src: t, embed: n, title: r, aspect: i = "16 / 9", autoPlay: a, className: o = "" }) {
+	let [s, c] = I(!!a), [l, u] = I(!1), d = l ? null : le(t), f = s ? `${n}${n.includes("?") ? "&" : "?"}autoplay=1` : n;
+	return /* @__PURE__ */ L("div", {
+		className: `fbos-video ${H} ${o}`,
+		style: { aspectRatio: i === "auto" ? "16 / 9" : i },
+		children: s ? /* @__PURE__ */ L("iframe", {
+			src: f,
+			title: r || "Video",
+			className: "absolute inset-0 w-full h-full border-0",
+			allow: "autoplay; encrypted-media; picture-in-picture; fullscreen; clipboard-write",
+			allowFullScreen: !0,
+			referrerPolicy: "strict-origin-when-cross-origin"
+		}) : /* @__PURE__ */ R("button", {
+			type: "button",
+			onClick: () => c(!0),
+			"aria-label": r ? `Play ${r}` : "Play the video",
+			className: "group/facade absolute inset-0 w-full h-full cursor-pointer",
+			children: [
+				d ? /* @__PURE__ */ L(e, {
+					src: d,
+					alt: "",
+					className: "absolute inset-0",
+					onError: () => u(!0)
+				}) : /* @__PURE__ */ L("span", { className: "absolute inset-0 bg-gradient-to-br from-accent/30 via-black to-black" }),
+				/* @__PURE__ */ L("span", { className: "absolute inset-0 bg-gradient-to-t from-black/55 via-transparent to-black/35" }),
+				r && /* @__PURE__ */ L("span", {
+					className: "absolute left-4 right-4 top-3 text-left text-white text-[14px] font-semibold truncate",
+					children: r
+				}),
+				/* @__PURE__ */ L("span", {
+					className: `${ye} pointer-events-none group-hover/facade:scale-105`,
+					children: /* @__PURE__ */ L(E, { className: "w-7 h-7 md:w-8 md:h-8 translate-x-0.5 fill-current" })
+				})
+			]
+		})
+	});
+}
+function be({ src: e, title: t, autoPlay: n, loop: r, className: i = "" }) {
+	let a = F(null), [o, s] = I(!1), [c, l] = I(0), [u, d] = I(0), [f, m] = I(0), [h, g] = I(!1), [_, v] = I(1), [y, b] = I(!1);
+	return /* @__PURE__ */ R("div", {
+		role: "region",
+		"aria-label": `Recording: ${t || A(e)}`,
+		className: `fbos-audio w-full flex items-center gap-3 rounded-2xl border border-[var(--panel-border)] bg-[var(--panel-bg)] px-3 py-2.5 ${i}`,
+		children: [
+			/* @__PURE__ */ L("audio", {
+				ref: a,
+				src: e,
+				preload: "metadata",
+				autoPlay: n,
+				loop: r,
+				className: "hidden",
+				onPlay: () => s(!0),
+				onPause: () => s(!1),
+				onEnded: () => s(!1),
+				onTimeUpdate: (e) => l(e.currentTarget.currentTime),
+				onLoadedMetadata: (e) => d(e.currentTarget.duration),
+				onDurationChange: (e) => d(e.currentTarget.duration),
+				onProgress: (e) => {
+					let t = e.currentTarget.buffered;
+					t.length && m(t.end(t.length - 1));
+				},
+				onVolumeChange: (e) => g(e.currentTarget.muted),
+				onRateChange: (e) => v(e.currentTarget.playbackRate),
+				onError: () => b(!0)
+			}),
+			/* @__PURE__ */ L("button", {
+				type: "button",
+				onClick: () => {
+					let e = a.current;
+					e && (e.paused ? e.play().catch(() => {}) : e.pause());
+				},
+				disabled: y,
+				"aria-label": o ? "Pause" : "Play",
+				className: "w-10 h-10 shrink-0 rounded-full bg-accent text-[var(--button-fg,#fff)] flex items-center justify-center shadow-md hover:scale-105 active:scale-95 transition-transform cursor-pointer disabled:opacity-40",
+				children: o ? /* @__PURE__ */ L(p, { className: "w-4 h-4 fill-current" }) : /* @__PURE__ */ L(E, { className: "w-4 h-4 fill-current translate-x-px" })
+			}),
+			/* @__PURE__ */ R("div", {
+				className: "flex-1 min-w-0 flex flex-col",
+				children: [/* @__PURE__ */ R("div", {
+					className: "flex items-center justify-between gap-2",
+					children: [/* @__PURE__ */ L("span", {
+						className: "text-[13px] font-semibold text-foreground truncate",
+						children: t || A(e)
+					}), /* @__PURE__ */ L("span", {
+						className: "text-[11.5px] font-medium text-foreground/50 tabular-nums whitespace-nowrap",
+						children: y ? "Could not be played" : `${B(c)} / ${B(u)}`
+					})]
+				}), /* @__PURE__ */ L(U, {
+					value: c,
+					max: u,
+					buffered: f,
+					onSeek: (e) => {
+						let t = a.current;
+						!t || !Number.isFinite(e) || (t.currentTime = Math.max(0, Math.min(e, Number.isFinite(t.duration) ? t.duration : e)), l(t.currentTime));
+					},
+					tone: "theme",
+					label: "Time"
+				})]
+			}),
+			/* @__PURE__ */ R("button", {
+				type: "button",
+				onClick: () => {
+					let e = a.current;
+					if (!e) return;
+					let t = [
+						1,
+						1.25,
+						1.5,
+						2,
+						.75
+					];
+					e.playbackRate = t[(t.indexOf(e.playbackRate) + 1) % t.length] || 1;
+				},
+				"aria-label": "Playback speed",
+				className: "h-8 px-2 shrink-0 rounded-lg text-[12px] font-bold tabular-nums text-foreground/60 hover:text-foreground hover:bg-foreground/5 transition-colors cursor-pointer",
+				children: [_, "×"]
+			}),
+			/* @__PURE__ */ L("button", {
+				type: "button",
+				onClick: () => {
+					a.current && (a.current.muted = !a.current.muted);
+				},
+				"aria-label": h ? "Turn the sound on" : "Mute",
+				className: "w-8 h-8 shrink-0 rounded-lg flex items-center justify-center text-foreground/60 hover:text-foreground hover:bg-foreground/5 transition-colors cursor-pointer",
+				children: L(h ? x : S, { className: "w-4 h-4" })
+			})
+		]
+	});
+}
+function K(e) {
+	let t = k(e.src);
+	return t ? /* @__PURE__ */ L(G, {
+		...e,
+		embed: t
+	}) : ce(e.src, e.type) === "audio" ? /* @__PURE__ */ L(be, { ...e }) : /* @__PURE__ */ L(W, { ...e }, e.src);
+}
+//#endregion
+//#region src/components/media/KindIcon.tsx
+var q = new Set([
+	"csv",
+	"tsv",
+	"xls",
+	"xlsx",
+	"ods",
+	"numbers"
+]), J = new Set([
+	"ppt",
+	"pptx",
+	"odp",
+	"key"
+]), xe = new Set([
+	"json",
+	"xml",
+	"yml",
+	"yaml",
+	"log",
+	"ics"
+]);
+function Se({ kind: e, name: t = "", className: n = "w-4 h-4" }) {
+	let r = O(t);
+	return /* @__PURE__ */ L(e === "image" ? i : e === "video" ? f : e === "audio" ? re : e === "link" ? D : q.has(r) ? d : J.has(r) ? h : xe.has(r) ? m : e === "file" ? a : c, {
+		className: n,
+		"aria-hidden": !0
+	});
+}
+var Y = "shrink-0 flex items-center justify-center rounded-xl bg-gradient-to-br from-accent/25 via-accent/10 to-transparent border border-accent/30 text-accent", Ce = 16, X = 980;
+function we({ doc: e, index: t, cssW: n, cssH: r, root: i, strokes: a, drawing: o, ink: s, onStroke: c }) {
+	let l = F(null), u = F(null), [d, f] = I(t < 2), [p, m] = I(0);
+	return N(() => {
+		let e = l.current;
+		if (!e || typeof IntersectionObserver > "u") return;
+		let t = new IntersectionObserver(([e]) => {
+			f(e.isIntersecting), !e.isIntersecting && u.current && u.current.width && (u.current.width = 0, u.current.height = 0, m(0));
+		}, {
+			root: i,
+			rootMargin: "1500px 0px"
+		});
+		return t.observe(e), () => t.disconnect();
+	}, [i]), N(() => {
+		if (!d || !n || Math.abs(p - n) < .5) return;
+		let r = !1, i = null, a = window.setTimeout(async () => {
+			try {
+				let a = await e.getPage(t + 1);
+				if (r) return;
+				let o = Math.min(window.devicePixelRatio || 1, 2), s = a.getViewport({ scale: 1 }), c = a.getViewport({ scale: n / s.width * o }), l = document.createElement("canvas");
+				l.width = Math.ceil(c.width), l.height = Math.ceil(c.height), i = a.render({
+					canvas: l,
+					viewport: c
+				}), await i.promise;
+				let d = u.current;
+				if (r || !d) return;
+				d.width = l.width, d.height = l.height, d.getContext("2d")?.drawImage(l, 0, 0), m(n);
+			} catch {}
+		}, p ? 140 : 0);
+		return () => {
+			r = !0, window.clearTimeout(a), i?.cancel();
+		};
+	}, [
+		d,
+		n,
+		e,
+		t,
+		p
+	]), /* @__PURE__ */ R("div", {
+		ref: l,
+		"data-page": t + 1,
+		className: "relative shrink-0 bg-white rounded-[3px] ring-1 ring-black/5 shadow-[0_1px_3px_rgba(0,0,0,0.12),0_12px_32px_-16px_rgba(0,0,0,0.35)]",
+		style: {
+			width: n,
+			height: r
+		},
+		children: [
+			/* @__PURE__ */ L("canvas", {
+				ref: u,
+				className: "absolute inset-0 w-full h-full rounded-[3px]",
+				"aria-label": `Page ${t + 1}`,
+				role: "img"
+			}),
+			!p && /* @__PURE__ */ L("div", {
+				className: "absolute inset-0 flex items-center justify-center",
+				children: /* @__PURE__ */ L(C, { className: "w-5 h-5 text-black/20 animate-spin" })
+			}),
+			/* @__PURE__ */ L(j, {
+				strokes: a,
+				active: o,
+				ink: s,
+				onStroke: (e) => c(t, e)
+			})
+		]
+	});
+}
+var Te = M(function({ data: e, zoom: t, drawing: n, ink: r, strokes: i, onStroke: a, onReady: o, onPage: s, onFail: c }, l) {
+	let u = F(null), [d, f] = I(null), [p, m] = I([]), [h, g] = I(0), [_, v] = I(null), y = F({
+		onReady: o,
+		onPage: s,
+		onFail: c
+	});
+	N(() => {
+		y.current = {
+			onReady: o,
+			onPage: s,
+			onFail: c
+		};
+	});
+	let b = F(0);
+	N(() => {
+		let t = !1, n = null;
+		return (async () => {
+			let r = await pe(), i = new Uint8Array(await e.arrayBuffer()), a = r.getDocument({ data: i });
+			n = a;
+			let o = await a.promise;
+			if (t) return;
+			let s = await Promise.all(Array.from({ length: o.numPages }, (e, t) => o.getPage(t + 1)));
+			t || (m(s.map((e) => {
+				let t = e.getViewport({ scale: 1 });
+				return {
+					w: t.width,
+					h: t.height
+				};
+			})), f(o), y.current.onReady(o.numPages));
+		})().catch((e) => {
+			t || y.current.onFail(e?.name === "PasswordException" ? "locked" : "broken");
+		}), () => {
+			t = !0, n?.destroy();
+		};
+	}, [e]), P(() => {
+		let e = u.current;
+		if (!e) return;
+		v(e);
+		let t = () => g(e.clientWidth);
+		if (t(), typeof ResizeObserver > "u") return;
+		let n = new ResizeObserver(t);
+		return n.observe(e), () => n.disconnect();
+	}, []);
+	let x = p.reduce((e, t) => Math.max(e, t.w), 0) || 612, S = h < 640 ? 12 : 32, w = Math.max(120, Math.min(h - S * 2, X)) / x * t, ee = F(w);
+	return P(() => {
+		let e = u.current, t = ee.current;
+		if (ee.current = w, !e || !t || t === w) return;
+		let n = w / t;
+		e.scrollTop = (e.scrollTop + e.clientHeight / 2) * n - e.clientHeight / 2, e.scrollLeft = (e.scrollLeft + e.clientWidth / 2) * n - e.clientWidth / 2;
+	}, [w]), N(() => () => cancelAnimationFrame(b.current), []), ge(l, () => ({ goTo: (e) => {
+		let t = u.current, n = t?.querySelector(`[data-page="${e}"]`);
+		t && n && t.scrollTo({
+			top: n.offsetTop - Ce,
+			behavior: "smooth"
+		});
+	} }), []), /* @__PURE__ */ L("div", {
+		ref: u,
+		onScroll: () => {
+			cancelAnimationFrame(b.current), b.current = requestAnimationFrame(() => {
+				let e = u.current;
+				if (!e) return;
+				let t = e.scrollTop + e.clientHeight * .35, n = 1;
+				for (let r of Array.from(e.querySelectorAll("[data-page]"))) if (r.offsetTop <= t) n = Number(r.dataset.page);
+				else break;
+				y.current.onPage(n);
+			});
+		},
+		className: "absolute inset-0 overflow-auto overscroll-contain",
+		children: d ? /* @__PURE__ */ L("div", {
+			className: "relative w-max min-w-full flex flex-col items-center",
+			style: {
+				gap: Ce,
+				padding: `${S / 2 + 4}px ${S}px ${S + 56}px`
+			},
+			children: p.map((e, t) => /* @__PURE__ */ L(we, {
+				doc: d,
+				index: t,
+				cssW: e.w * w,
+				cssH: e.h * w,
+				root: _,
+				strokes: i[t] || [],
+				drawing: n,
+				ink: r,
+				onStroke: a
+			}, t))
+		}) : /* @__PURE__ */ L("div", {
+			className: "absolute inset-0 flex items-center justify-center",
+			children: /* @__PURE__ */ L(C, { className: "w-6 h-6 text-accent animate-spin" })
+		})
+	});
+}), Z = [
+	.5,
+	.75,
+	1,
+	1.25,
+	1.5,
+	2,
+	3
+], Q = "h-9 min-w-9 px-2 shrink-0 rounded-xl flex items-center justify-center gap-1.5 text-[12.5px] font-semibold text-foreground/65 hover:text-foreground hover:bg-foreground/[0.06] transition-colors cursor-pointer disabled:opacity-35 disabled:pointer-events-none outline-none focus-visible:ring-2 focus-visible:ring-accent/50", Ee = "items-center h-9 shrink-0 rounded-xl border border-[var(--panel-border)] bg-[var(--panel-bg)] px-0.5", De = "w-8 h-8 rounded-lg flex items-center justify-center text-foreground/60 hover:text-foreground hover:bg-foreground/[0.06] transition-colors cursor-pointer disabled:opacity-30 disabled:pointer-events-none", Oe = new Set([
+	"json",
+	"xml",
+	"yml",
+	"yaml",
+	"log",
+	"ics"
+]), $ = 4e5;
+function ke(e, t = ",") {
+	let n = [], r = [], i = "", a = !1;
+	for (let o = 0; o < e.length; o++) {
+		let s = e[o];
+		if (a) {
+			s === "\"" ? e[o + 1] === "\"" ? (i += "\"", o++) : a = !1 : i += s;
+			continue;
+		}
+		s === "\"" ? a = !0 : s === t ? (r.push(i), i = "") : s === "\n" || s === "\r" ? (s === "\r" && e[o + 1] === "\n" && o++, r.push(i), n.push(r), r = [], i = "") : i += s;
+	}
+	return (i || r.length) && (r.push(i), n.push(r)), n;
+}
+var Ae = (e, t) => {
+	let n = e.lastIndexOf(".");
+	return `${n > 0 ? e.slice(0, n) : e} (with drawing).${t === "pdf" ? "pdf" : "png"}`;
+};
+function je() {
+	return /* @__PURE__ */ L("div", {
+		className: "absolute inset-0 flex items-center justify-center",
+		children: /* @__PURE__ */ L(C, { className: "w-6 h-6 text-accent animate-spin" })
+	});
+}
+function Me({ src: e, alt: t, zoom: n, drawing: r, ink: i, strokes: a, onStroke: o, onSize: s }) {
+	let c = F(null), l = F(null), [u, d] = I({
+		w: 0,
+		h: 0
+	}), [f, p] = I(null), [m, h] = I(!1);
+	P(() => {
+		let e = c.current;
+		if (!e) return;
+		let t = () => {
+			let t = e.clientWidth < 640 ? 24 : 48;
+			d({
+				w: Math.max(0, e.clientWidth - t),
+				h: Math.max(0, e.clientHeight - t)
+			});
+		};
+		if (t(), typeof ResizeObserver > "u") return;
+		let n = new ResizeObserver(t);
+		return n.observe(e), () => n.disconnect();
+	}, []);
+	let g = f && u.w && u.h ? Math.min(u.w / f.w, u.h / f.h, 1) : 0, _ = f ? f.w * g * n : 0, v = f ? f.h * g * n : 0, y = !r && n > 1;
+	return /* @__PURE__ */ R("div", {
+		ref: c,
+		className: `absolute inset-0 overflow-auto overscroll-contain flex p-3 sm:p-6 ${y ? "cursor-grab active:cursor-grabbing" : ""}`,
+		onPointerDown: (e) => {
+			!y || e.button > 0 || !c.current || (l.current = {
+				x: e.clientX,
+				y: e.clientY,
+				left: c.current.scrollLeft,
+				top: c.current.scrollTop
+			}, e.currentTarget.setPointerCapture(e.pointerId));
+		},
+		onPointerMove: (e) => {
+			let t = l.current;
+			!t || !c.current || (c.current.scrollLeft = t.left - (e.clientX - t.x), c.current.scrollTop = t.top - (e.clientY - t.y));
+		},
+		onPointerUp: () => {
+			l.current = null;
+		},
+		onPointerCancel: () => {
+			l.current = null;
+		},
+		children: [m ? /* @__PURE__ */ L("p", {
+			className: "m-auto text-[13px] font-medium text-foreground/50",
+			children: "This picture could not be shown."
+		}) : /* @__PURE__ */ R("div", {
+			className: "relative m-auto shrink-0 rounded-lg overflow-hidden shadow-lg",
+			style: f ? {
+				width: _,
+				height: v
+			} : {
+				width: 0,
+				height: 0
+			},
+			children: [/* @__PURE__ */ L("img", {
+				src: e,
+				alt: t,
+				draggable: !1,
+				onLoad: (e) => {
+					let t = {
+						w: e.currentTarget.naturalWidth || 800,
+						h: e.currentTarget.naturalHeight || 600
+					};
+					p(t), s(t.w, t.h);
+				},
+				onError: () => h(!0),
+				className: "absolute inset-0 w-full h-full select-none"
+			}), f && /* @__PURE__ */ L(j, {
+				strokes: a,
+				active: r,
+				ink: i,
+				onStroke: o
+			})]
+		}), !f && !m && /* @__PURE__ */ L(je, {})]
+	});
+}
+function Ne({ blob: e, name: t }) {
+	let [n, r] = I(null);
+	if (N(() => {
+		let t = !1;
+		return e.text().then((e) => {
+			t || r(e);
+		}, () => {
+			t || r("");
+		}), () => {
+			t = !0;
+		};
+	}, [e]), n === null) return /* @__PURE__ */ L(je, {});
+	let i = O(t), a = n.length > $, o = a ? n.slice(0, $) : n, s = a && /* @__PURE__ */ L("p", {
+		className: "px-4 sm:px-8 pb-8 text-[12px] font-medium text-foreground/45",
+		children: "The rest of this file is too long to show here — download it to read it all."
+	});
+	if (i === "csv" || i === "tsv") {
+		let [e, ...t] = ke(o, i === "tsv" ? "	" : ",").slice(0, 2e3);
+		return /* @__PURE__ */ R("div", {
+			className: "absolute inset-0 overflow-auto",
+			children: [/* @__PURE__ */ R("table", {
+				className: "min-w-full text-[12.5px] border-separate border-spacing-0",
+				children: [e && /* @__PURE__ */ L("thead", {
+					className: "sticky top-0 z-10",
+					children: /* @__PURE__ */ L("tr", { children: e.map((e, t) => /* @__PURE__ */ L("th", {
+						className: "px-3 py-2 text-left font-bold text-foreground bg-[var(--panel-bg)] backdrop-blur-md border-b border-[var(--panel-border)] whitespace-nowrap",
+						children: e
+					}, t)) })
+				}), /* @__PURE__ */ L("tbody", { children: t.map((e, t) => /* @__PURE__ */ L("tr", {
+					className: "hover:bg-foreground/[0.03]",
+					children: e.map((e, t) => /* @__PURE__ */ L("td", {
+						className: "px-3 py-1.5 text-foreground/80 border-b border-[var(--panel-border)]/50 whitespace-nowrap",
+						children: e
+					}, t))
+				}, t)) })]
+			}), s]
+		});
+	}
+	let c = o;
+	if (i === "json") try {
+		c = JSON.stringify(JSON.parse(o), null, 2);
+	} catch {}
+	return /* @__PURE__ */ R("div", {
+		className: "absolute inset-0 overflow-auto",
+		children: [/* @__PURE__ */ L("pre", {
+			className: `m-0 mx-auto max-w-4xl p-4 sm:p-8 whitespace-pre-wrap break-words text-foreground/85 leading-relaxed ${Oe.has(i) ? "font-mono text-[12.5px]" : "font-sans text-[14px]"}`,
+			children: c
+		}), s]
+	});
+}
+function Pe({ src: e, type: t, title: n }) {
+	let r = F(null), [i, a] = I(16 / 9), [o, s] = I({
+		w: 0,
+		h: 0
+	});
+	P(() => {
+		let e = r.current;
+		if (!e) return;
+		let t = () => s({
+			w: e.clientWidth,
+			h: e.clientHeight
+		});
+		if (t(), typeof ResizeObserver > "u") return;
+		let n = new ResizeObserver(t);
+		return n.observe(e), () => n.disconnect();
+	}, []);
+	let c = o.w && o.h ? Math.min(o.w, o.h * i) : 0;
+	return /* @__PURE__ */ L("div", {
+		className: "absolute inset-0 p-3 sm:p-6",
+		children: /* @__PURE__ */ L("div", {
+			ref: r,
+			className: "w-full h-full flex items-center justify-center",
+			children: /* @__PURE__ */ L("div", {
+				style: c ? { width: c } : { width: "100%" },
+				children: /* @__PURE__ */ L(K, {
+					src: e,
+					type: t,
+					title: n,
+					aspect: String(i),
+					onRatio: a
+				})
+			})
+		})
+	});
+}
+function Fe({ kind: e, title: t, src: n, onDownload: r, busy: i, canDownload: a }) {
+	let c = O(t) || O(n), l = e === "link" ? "This is a link to another website." : e === "document" ? `${c ? `A ${c.toUpperCase()} file` : "This file"} opens in its own app — download it to read it.` : "This kind of file cannot be shown here. Download it to open it.";
+	return /* @__PURE__ */ L("div", {
+		className: "absolute inset-0 overflow-auto flex p-6",
+		children: /* @__PURE__ */ R("div", {
+			className: "m-auto flex flex-col items-center text-center max-w-sm gap-3",
+			children: [
+				/* @__PURE__ */ L("span", {
+					className: `${Y} w-16 h-16 rounded-2xl`,
+					children: /* @__PURE__ */ L(Se, {
+						kind: e,
+						name: t || n,
+						className: "w-7 h-7"
+					})
+				}),
+				/* @__PURE__ */ L("p", {
+					className: "text-[16px] font-bold text-foreground break-all",
+					children: t
+				}),
+				/* @__PURE__ */ L("p", {
+					className: "text-[13px] text-foreground/55 leading-relaxed",
+					children: l
+				}),
+				e === "link" ? /* @__PURE__ */ R("a", {
+					href: n,
+					target: "_blank",
+					rel: "noopener noreferrer",
+					className: "btn-primary inline-flex items-center gap-2 px-5 py-2.5 rounded-xl text-[13px] font-bold mt-1",
+					children: [/* @__PURE__ */ L(s, { className: "w-4 h-4" }), " Open it"]
+				}) : a ? /* @__PURE__ */ R("button", {
+					type: "button",
+					onClick: r,
+					disabled: i,
+					className: "btn-primary inline-flex items-center gap-2 px-5 py-2.5 rounded-xl text-[13px] font-bold mt-1 cursor-pointer",
+					children: [i ? /* @__PURE__ */ L(C, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ L(o, { className: "w-4 h-4" }), " Download"]
+				}) : null
+			]
+		})
+	});
+}
+function Ie({ src: e, name: t, type: n, height: i, className: a = "", draw: s = !0, download: c = !0, actions: l, onClose: u }) {
+	let d = ce(e, n), f = t || A(e), p = d === "pdf" || d === "text", m = F(null), h = F(null), y = F(null), [x, S] = I(null), [re, ie] = I(!1), [E, oe] = I(0), [se, D] = I(1), [k, le] = I("1"), [j, pe] = I(null), [M, ge] = I(null), [P, ve] = I(1), [z, B] = I(!1), [V, ye] = I("black"), [H, U] = I({}), [W, G] = I([]), [be, q] = I(!1), [J, xe] = I(!1);
+	N(() => {
+		if (!p) return;
+		let t = !1;
+		return me(e).then((e) => {
+			t || S(e);
+		}, () => {
+			t || ie(!0);
+		}), () => {
+			t = !0;
+		};
+	}, [e, p]), N(() => {
+		let e = () => xe(!!m.current && document.fullscreenElement === m.current);
+		return document.addEventListener("fullscreenchange", e), () => document.removeEventListener("fullscreenchange", e);
+	}, []);
+	let Ce = d === "pdf" && !!x && !re && !j, X = Ce && E > 0 || d === "image" && !!M, we = s && X, Oe = W.length > 0, $ = he((e) => {
+		ve((t) => {
+			let n = Z.findIndex((e) => e >= t - .001);
+			return Z[Math.min(Z.length - 1, Math.max(0, (n < 0 ? 2 : n) + e))] ?? t;
+		});
+	}, []);
+	N(() => {
+		let e = h.current;
+		if (!e || !X) return;
+		let t = (e) => {
+			!e.ctrlKey && !e.metaKey || (e.preventDefault(), $(e.deltaY < 0 ? 1 : -1));
+		};
+		return e.addEventListener("wheel", t, { passive: !1 }), () => e.removeEventListener("wheel", t);
+	}, [X, $]);
+	let ke = (e, t) => {
+		U((n) => ({
+			...n,
+			[e]: [...n[e] || [], t]
+		})), G((t) => [...t, e]);
+	}, Ie = () => {
+		let e = W[W.length - 1];
+		e !== void 0 && (U((t) => ({
+			...t,
+			[e]: (t[e] || []).slice(0, -1)
+		})), G((e) => e.slice(0, -1)));
+	}, Le = () => {
+		U({}), G([]);
+	}, Re = (e) => {
+		let t = Math.min(E, Math.max(1, Math.round(e) || 1));
+		D(t), le(String(t)), y.current?.goTo(t);
+	}, ze = async () => {
+		q(!0);
+		try {
+			if (Oe && (d === "pdf" || d === "image")) {
+				let { bakePdf: t, bakeImage: n } = await import("./bake-naZeMu98.js");
+				fe(d === "pdf" && x ? await t(x, H) : await n(e, H[0] || []), Ae(f, d));
+			} else d === "video" || d === "audio" || d === "link" ? window.open(e, "_blank", "noopener,noreferrer") : fe(x || await me(e), f);
+		} catch {
+			window.open(e, "_blank", "noopener,noreferrer");
+		}
+		q(!1);
+	}, Be = () => {
+		document.fullscreenElement ? document.exitFullscreen().catch(() => {}) : m.current?.requestFullscreen?.().catch(() => {});
+	}, Ve = (e) => {
+		if (!e.target.closest("input, textarea, [role=\"slider\"], .fbos-video")) {
+			if (e.key === "Escape" && z) {
+				e.preventDefault(), B(!1);
+				return;
+			}
+			!X || e.metaKey || e.ctrlKey || (e.key === "+" || e.key === "=" ? (e.preventDefault(), $(1)) : e.key === "-" ? (e.preventDefault(), $(-1)) : e.key === "0" && (e.preventDefault(), ve(1)));
+		}
+	}, He = [
+		ue[d],
+		E ? `${E} page${E === 1 ? "" : "s"}` : "",
+		M ? `${M.w} × ${M.h}` : ""
+	].filter(Boolean).join(" · "), Ue;
+	return Ue = d === "image" ? /* @__PURE__ */ L(Me, {
+		src: e,
+		alt: f,
+		zoom: P,
+		drawing: z,
+		ink: V,
+		strokes: H[0] || [],
+		onStroke: (e) => ke(0, e),
+		onSize: (e, t) => ge({
+			w: e,
+			h: t
+		})
+	}) : d === "video" || d === "audio" ? d === "audio" ? /* @__PURE__ */ L("div", {
+		className: "absolute inset-0 flex p-6",
+		children: /* @__PURE__ */ L("div", {
+			className: "m-auto w-full max-w-lg",
+			children: /* @__PURE__ */ L(K, {
+				src: e,
+				type: n,
+				title: f
+			})
+		})
+	}) : /* @__PURE__ */ L(Pe, {
+		src: e,
+		type: n,
+		title: f
+	}) : p && re ? /* @__PURE__ */ L("iframe", {
+		src: e,
+		title: f,
+		className: "absolute inset-0 w-full h-full border-0 bg-white"
+	}) : d === "pdf" && j ? /* @__PURE__ */ L("div", {
+		className: "absolute inset-0 flex p-6",
+		children: /* @__PURE__ */ R("div", {
+			className: "m-auto flex flex-col items-center text-center gap-3 max-w-sm",
+			children: [
+				/* @__PURE__ */ L("span", {
+					className: `${Y} w-14 h-14 rounded-2xl`,
+					children: j === "locked" ? /* @__PURE__ */ L(ne, { className: "w-6 h-6" }) : /* @__PURE__ */ L(Se, {
+						kind: "pdf",
+						className: "w-6 h-6"
+					})
+				}),
+				/* @__PURE__ */ L("p", {
+					className: "text-[14px] font-semibold text-foreground",
+					children: j === "locked" ? "This PDF is locked with a password." : "This PDF could not be opened here."
+				}),
+				/* @__PURE__ */ L("p", {
+					className: "text-[13px] text-foreground/55",
+					children: "Download it to open it on your own device."
+				})
+			]
+		})
+	}) : d === "pdf" ? x ? /* @__PURE__ */ L(Te, {
+		ref: y,
+		data: x,
+		zoom: P,
+		drawing: z,
+		ink: V,
+		strokes: H,
+		onStroke: ke,
+		onReady: (e) => oe(e),
+		onPage: (e) => {
+			D(e), le(String(e));
+		},
+		onFail: pe
+	}) : /* @__PURE__ */ L(je, {}) : d === "text" ? x ? /* @__PURE__ */ L(Ne, {
+		blob: x,
+		name: O(f) ? f : A(e)
+	}) : /* @__PURE__ */ L(je, {}) : /* @__PURE__ */ L(Fe, {
+		kind: d,
+		title: f,
+		src: e,
+		onDownload: ze,
+		busy: be,
+		canDownload: c
+	}), /* @__PURE__ */ R("div", {
+		ref: m,
+		tabIndex: -1,
+		onKeyDown: Ve,
+		className: `fbos-file-viewer relative flex flex-col w-full overflow-hidden bg-background border border-[var(--panel-border)] shadow-2xl outline-none ${J ? "" : "rounded-2xl sm:rounded-3xl"} ${a}`,
+		style: { height: J ? "100vh" : i ?? "min(80vh, 760px)" },
+		children: [
+			/* @__PURE__ */ L("div", {
+				"aria-hidden": !0,
+				className: "pointer-events-none absolute top-0 inset-x-0 h-[2px] z-20 bg-gradient-to-r from-transparent via-accent/60 to-transparent"
+			}),
+			/* @__PURE__ */ R("div", {
+				className: "relative z-10 shrink-0 flex items-center gap-1.5 sm:gap-2 h-14 px-2.5 sm:px-3.5 border-b border-[var(--panel-border)]/60 bg-background/85 backdrop-blur-md",
+				children: [
+					/* @__PURE__ */ L("span", {
+						className: "max-sm:hidden shrink-0",
+						children: /* @__PURE__ */ L("span", {
+							className: `${Y} w-9 h-9`,
+							children: /* @__PURE__ */ L(Se, {
+								kind: d,
+								name: f
+							})
+						})
+					}),
+					/* @__PURE__ */ R("div", {
+						className: "flex flex-col min-w-0 flex-1 mr-1",
+						children: [/* @__PURE__ */ L("span", {
+							className: "text-[13.5px] sm:text-[14px] font-bold text-foreground truncate leading-tight",
+							title: f,
+							children: f
+						}), /* @__PURE__ */ L("span", {
+							className: "text-[11px] sm:text-[11.5px] font-medium text-foreground/45 truncate leading-tight mt-0.5",
+							children: He
+						})]
+					}),
+					Ce && E > 1 && /* @__PURE__ */ R("div", {
+						className: `${Ee} inline-flex`,
+						children: [
+							/* @__PURE__ */ L("span", {
+								className: "max-sm:hidden",
+								children: /* @__PURE__ */ L("button", {
+									type: "button",
+									className: De,
+									onClick: () => Re(se - 1),
+									disabled: se <= 1,
+									"aria-label": "Previous page",
+									children: /* @__PURE__ */ L(v, { className: "w-4 h-4" })
+								})
+							}),
+							/* @__PURE__ */ R("span", {
+								className: "flex items-center gap-1 px-1.5 text-[12.5px] font-semibold text-foreground/70 tabular-nums",
+								children: [/* @__PURE__ */ L("input", {
+									value: k,
+									onChange: (e) => le(e.target.value.replace(/\D/g, "")),
+									onBlur: () => Re(Number(k)),
+									onKeyDown: (e) => {
+										e.key === "Enter" && Re(Number(k));
+									},
+									"aria-label": "Page",
+									inputMode: "numeric",
+									className: "no-glow w-7 h-7 text-center rounded-md bg-transparent outline-none focus:bg-foreground/[0.06] text-foreground"
+								}), /* @__PURE__ */ R("span", {
+									className: "text-foreground/40",
+									children: ["/ ", E]
+								})]
+							}),
+							/* @__PURE__ */ L("span", {
+								className: "max-sm:hidden",
+								children: /* @__PURE__ */ L("button", {
+									type: "button",
+									className: De,
+									onClick: () => Re(se + 1),
+									disabled: se >= E,
+									"aria-label": "Next page",
+									children: /* @__PURE__ */ L(ee, { className: "w-4 h-4" })
+								})
+							})
+						]
+					}),
+					X && /* @__PURE__ */ R("div", {
+						className: `${Ee} max-sm:hidden sm:inline-flex`,
+						children: [
+							/* @__PURE__ */ L("button", {
+								type: "button",
+								className: De,
+								onClick: () => $(-1),
+								disabled: P <= Z[0],
+								"aria-label": "Zoom out",
+								children: /* @__PURE__ */ L(w, { className: "w-4 h-4" })
+							}),
+							/* @__PURE__ */ R("button", {
+								type: "button",
+								onClick: () => ve(1),
+								title: "Fit to the window",
+								className: "min-w-[48px] h-8 px-1 rounded-lg text-[12px] font-semibold text-foreground/70 tabular-nums hover:bg-foreground/[0.06] cursor-pointer",
+								children: [Math.round(P * 100), "%"]
+							}),
+							/* @__PURE__ */ L("button", {
+								type: "button",
+								className: De,
+								onClick: () => $(1),
+								disabled: P >= Z[Z.length - 1],
+								"aria-label": "Zoom in",
+								children: /* @__PURE__ */ L(ae, { className: "w-4 h-4" })
+							})
+						]
+					}),
+					we && /* @__PURE__ */ R("button", {
+						type: "button",
+						onClick: () => B((e) => !e),
+						"aria-pressed": z,
+						title: z ? "Stop drawing" : "Draw on it",
+						className: `${Q} ${z ? "!text-accent bg-accent/10 hover:bg-accent/15" : ""}`,
+						children: [/* @__PURE__ */ L(_, { className: "w-4 h-4" }), /* @__PURE__ */ L("span", {
+							className: "max-md:hidden",
+							children: "Draw"
+						})]
+					}),
+					c && d !== "link" && /* @__PURE__ */ R("button", {
+						type: "button",
+						onClick: ze,
+						disabled: be,
+						title: Oe ? "Download with your drawing" : "Download",
+						className: Q,
+						children: [be ? /* @__PURE__ */ L(C, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ L(o, { className: "w-4 h-4" }), /* @__PURE__ */ L("span", {
+							className: "max-md:hidden",
+							children: "Download"
+						})]
+					}),
+					!u && typeof document < "u" && document.fullscreenEnabled && /* @__PURE__ */ L("span", {
+						className: "max-sm:hidden",
+						children: /* @__PURE__ */ L("button", {
+							type: "button",
+							onClick: Be,
+							"aria-label": J ? "Leave full screen" : "Full screen",
+							className: Q,
+							children: L(J ? te : g, { className: "w-4 h-4" })
+						})
+					}),
+					l,
+					u && /* @__PURE__ */ R(_e, { children: [/* @__PURE__ */ L("span", {
+						"aria-hidden": !0,
+						className: "w-px h-6 bg-[var(--panel-border)] mx-0.5"
+					}), /* @__PURE__ */ L("button", {
+						type: "button",
+						onClick: u,
+						"aria-label": "Close",
+						className: Q,
+						children: /* @__PURE__ */ L(T, { className: "w-[18px] h-[18px]" })
+					})] })
+				]
+			}),
+			/* @__PURE__ */ R("div", {
+				ref: h,
+				className: "relative flex-1 min-h-0 bg-foreground/[0.035]",
+				children: [Ue, z && /* @__PURE__ */ R("div", {
+					className: "absolute bottom-4 left-1/2 -translate-x-1/2 z-20 flex items-center gap-0.5 p-1.5 rounded-full border border-[var(--panel-border)] bg-background shadow-2xl dark:bg-[color-mix(in_srgb,var(--accent-color)_9%,var(--bg-color))] dark:border-accent/30",
+					children: [
+						/* @__PURE__ */ L("span", {
+							"aria-hidden": !0,
+							className: "pointer-events-none absolute top-0 inset-x-4 h-px bg-gradient-to-r from-transparent via-accent/60 to-transparent"
+						}),
+						de.map((e) => /* @__PURE__ */ L("button", {
+							type: "button",
+							onClick: () => ye(e.id),
+							"aria-label": e.label,
+							"aria-pressed": V === e.id,
+							title: e.label,
+							className: `w-8 h-8 rounded-full flex items-center justify-center cursor-pointer transition-colors ${V === e.id ? "bg-foreground/[0.08]" : "hover:bg-foreground/5"}`,
+							children: /* @__PURE__ */ L("span", {
+								className: `block ${e.id === "marker" ? "w-5 h-2.5 rounded-sm" : "w-4 h-4 rounded-full"} border border-foreground/25 ring-2 ring-offset-2 ring-offset-background ${V === e.id ? "ring-accent" : "ring-transparent"}`,
+								style: {
+									background: e.color,
+									opacity: e.id === "marker" ? .85 : 1
+								}
+							})
+						}, e.id)),
+						/* @__PURE__ */ L("span", {
+							"aria-hidden": !0,
+							className: "w-px h-5 bg-[var(--panel-border)] mx-1"
+						}),
+						/* @__PURE__ */ L("button", {
+							type: "button",
+							onClick: Ie,
+							disabled: !Oe,
+							"aria-label": "Undo",
+							title: "Undo",
+							className: `${Q} !h-8 !min-w-8 !rounded-full`,
+							children: /* @__PURE__ */ L(b, { className: "w-4 h-4" })
+						}),
+						/* @__PURE__ */ L("button", {
+							type: "button",
+							onClick: Le,
+							disabled: !Oe,
+							"aria-label": "Clear the drawing",
+							title: "Clear the drawing",
+							className: `${Q} !h-8 !min-w-8 !rounded-full hover:!text-red-500`,
+							children: /* @__PURE__ */ L(r, { className: "w-4 h-4" })
+						}),
+						/* @__PURE__ */ L("button", {
+							type: "button",
+							onClick: () => B(!1),
+							className: "btn-primary ml-1 h-8 px-3.5 rounded-full text-[12.5px] font-bold cursor-pointer",
+							children: "Done"
+						})
+					]
+				})]
+			})
+		]
+	});
+}
+function Le(e) {
+	return /* @__PURE__ */ L(Ie, { ...e }, e.src);
+}
+//#endregion
+//#region src/components/media/FileViewerPopup.tsx
+function Re({ open: e, onClose: r, ...i }) {
+	return N(() => {
+		if (!e) return;
+		let t = (e) => {
+			e.key === "Escape" && !e.defaultPrevented && r();
+		};
+		window.addEventListener("keydown", t);
+		let n = document.body.style.overflow;
+		return document.body.style.overflow = "hidden", () => {
+			window.removeEventListener("keydown", t), document.body.style.overflow = n;
+		};
+	}, [e, r]), typeof document > "u" ? null : ve(/* @__PURE__ */ L(t, { children: e && i.src && /* @__PURE__ */ R("div", {
+		role: "dialog",
+		"aria-modal": "true",
+		"aria-label": i.name || A(i.src),
+		className: "fixed inset-0 z-[9999] flex items-center justify-center p-2 sm:p-4 md:p-8",
+		children: [/* @__PURE__ */ L(n.div, {
+			onClick: r,
+			initial: { opacity: 0 },
+			animate: { opacity: 1 },
+			exit: { opacity: 0 },
+			className: "absolute inset-0 bg-background/80 backdrop-blur-xl cursor-pointer"
+		}), /* @__PURE__ */ L(n.div, {
+			initial: {
+				opacity: 0,
+				scale: .97,
+				y: 8
+			},
+			animate: {
+				opacity: 1,
+				scale: 1,
+				y: 0
+			},
+			exit: {
+				opacity: 0,
+				scale: .97,
+				y: 8
+			},
+			transition: { duration: .18 },
+			className: "relative z-10 w-full max-w-6xl h-full max-h-[min(92vh,1000px)]",
+			children: /* @__PURE__ */ L(Le, {
+				...i,
+				onClose: r,
+				height: "100%"
+			})
+		})]
+	}) }), document.body);
+}
+//#endregion
+export { K as a, Se as i, Le as n, Y as r, Re as t };