ExportButton.jsx
1.68 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
export default function ExportButton({
label = "Export",
filename = "export",
className = "",
id = "",
}) {
const responseToExport = () => {
const response_to_export = document.querySelector(".response-to-export");
if (!response_to_export) return;
return response_to_export?.innerHTML ?? "";
};
const generatePDF = window.generatePDF;
const onClickExportToPDF = () => {
const response = responseToExport();
generatePDF(response, filename);
};
const onClickExportButton = () => {
let modal = document.querySelector(".export-modal-container");
const response = responseToExport();
if (!response) return;
if (!modal) {
const btutil_buildExportModal = window.btutil_buildExportModal;
modal = btutil_buildExportModal(onClickExportToPDF);
document.body.appendChild(modal);
}
modal.classList.add("active");
};
return (
<>
<div
className={`export-button ${className}`}
id={id}
onClick={onClickExportButton}
>
<svg
fill="#ffffff"
xmlns="http://www.w3.org/2000/svg"
height="1em"
viewBox="0 0 512 512"
>
<path d="M216 0h80c13.3 0 24 10.7 24 24v168h87.7c17.8 0 26.7 21.5 14.1 34.1L269.7 378.3c-7.5 7.5-19.8 7.5-27.3 0L90.1 226.1c-12.6-12.6-3.7-34.1 14.1-34.1H192V24c0-13.3 10.7-24 24-24zm296 376v112c0 13.3-10.7 24-24 24H24c-13.3 0-24-10.7-24-24V376c0-13.3 10.7-24 24-24h146.7l49 49c20.1 20.1 52.5 20.1 72.6 0l49-49H488c13.3 0 24 10.7 24 24zm-124 88c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20zm64 0c0-11-9-20-20-20s-20 9-20 20 9 20 20 20 20-9 20-20z" />
</svg>
<span>{label}</span>
</div>
</>
);
}