laif-ds
Version:
Design System di Laif con componenti React basati su principi di Atomic Design
124 lines (123 loc) • 4.39 kB
JavaScript
"use client";
import { jsxs as f, jsx as r } from "react/jsx-runtime";
import { useMemo as c } from "react";
import { createAsk as w } from "../../node_modules/use-ask/dist/index.js";
import { Dialog as x, DialogContent as g, DialogHeader as N, DialogTitle as y } from "./dialog.js";
import { Icon as P } from "./icon.js";
import { SecurePdfViewer as b } from "./secure-pdf-viewer.js";
import { guessKind as A, isHttpUrl as D, getOfficeEmbedUrl as O } from "../../lib/file-preview.js";
import { cn as F } from "../../lib/utils.js";
const [p, T] = w({});
function h(e) {
return typeof e == "string" ? { url: e } : e || {};
}
async function q(e) {
return p.ask(h(e));
}
function B(e) {
return p.safeAsk(h(e));
}
const E = () => {
const [{ payload: e }, { asking: i, ok: n }] = T(), l = e?.url, a = e?.readOnly, t = e?.page, o = c(() => e?.filename ? e?.filename : (e?.url || "").split(/[?#]/)[0].split("/").pop() || "" || "document", [e?.filename, e?.url]), m = c(() => {
if (!e?.url) return null;
const s = new URL(e?.url), u = s.searchParams.get("response-content-type") || s.searchParams.get("content-type"), d = e?.mimeType || u || "";
return A({
mimeType: d,
filename: o,
url: e?.url
});
}, [e?.mimeType, o, e?.url]), v = c(
() => /* @__PURE__ */ f("span", { className: "flex items-center gap-2", children: [
/* @__PURE__ */ r(P, { name: "File", className: "h-4 w-4" }),
e?.title || o
] }),
[e?.title, o]
);
return /* @__PURE__ */ r(x, { open: i, onOpenChange: (s) => !s && n(), children: /* @__PURE__ */ f(g, { size: "xl", className: "sm:max-w-4xl", children: [
/* @__PURE__ */ r(N, { children: /* @__PURE__ */ r(y, { children: v }) }),
/* @__PURE__ */ r("div", { className: F("relative", "max-h-[80vh] overflow-auto p-1"), children: m && l ? /* @__PURE__ */ r(
j,
{
kind: m,
src: l,
officeUrl: l,
readOnly: a,
page: t
}
) : null })
] }) });
}, j = ({
kind: e,
src: i,
officeUrl: n,
readOnly: l = !1,
page: a = 0
}) => {
if (!i && e !== "text" && e !== "office")
return /* @__PURE__ */ r("div", { className: "text-d-secondary-foreground", children: "Nessuna sorgente disponibile" });
switch (e) {
case "image":
return /* @__PURE__ */ r("div", { className: "grid place-items-center", children: /* @__PURE__ */ r(
"img",
{
src: i,
alt: "preview",
className: "max-h-[78vh] w-auto max-w-full object-contain"
}
) });
case "pdf": {
if (l && i)
return /* @__PURE__ */ r(
b,
{
url: i,
initialPage: a || 1,
className: "w-full"
}
);
let t = i;
return a > 0 && (t += "#page=" + a), /* @__PURE__ */ r(
"iframe",
{
src: t,
title: "PDF Preview",
className: "h-[78vh] w-full rounded"
}
);
}
case "audio":
return /* @__PURE__ */ r("div", { className: "grid place-items-center", children: /* @__PURE__ */ r("audio", { controls: !0, className: "w-full max-w-2xl", children: /* @__PURE__ */ r("source", { src: i }) }) });
case "video":
return /* @__PURE__ */ r("div", { className: "grid place-items-center", children: /* @__PURE__ */ r("video", { controls: !0, className: "max-h-[78vh] w-full max-w-3xl rounded", children: /* @__PURE__ */ r("source", { src: i }) }) });
case "text":
return /* @__PURE__ */ r(
"iframe",
{
src: i,
title: "Text Preview",
className: "h-[78vh] w-full rounded"
}
);
case "office": {
if (n && D(n)) {
const t = O(n);
return /* @__PURE__ */ r(
"iframe",
{
src: t,
title: "Office Preview",
className: "h-[78vh] w-full rounded"
}
);
}
return /* @__PURE__ */ r("div", { className: "rounded border p-3 text-sm", children: 'Anteprima Office non disponibile per file locali. Usa "Apri in nuova scheda" o "Download".' });
}
default:
return /* @__PURE__ */ r("div", { className: "rounded border p-3 text-sm", children: "Anteprima non disponibile per questo tipo di file." });
}
};
export {
E as FilePreviewer,
q as previewFileModal,
B as safePreviewFileModal
};