blob: 069a48f84e8d707046c3ad9a9f0bb9ecd67dd319 (
plain)
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
|
<!-- SPDX-FileCopyrightText: 2026 Progmasoft <support@progmasoft.com> -->
<!-- SPDX-License-Identifier: AGPL-3.0-or-later WITH AdditionRef-Progmasoft-Patent-Grant-1.1 -->
<!-- A highlighted code block of a document, with its file name and a button that copies it. -->
<script setup lang="ts">
import { chrome } from "~/content/chrome";
const props = defineProps<{
code?: string;
language?: string | null;
filename?: string | null;
highlights?: number[];
meta?: string | null;
class?: string | null;
}>();
const { locale } = useSiteLocale();
const copied = ref(false);
let timer: ReturnType<typeof setTimeout> | undefined;
async function copy() {
try {
await navigator.clipboard.writeText(props.code ?? "");
} catch {
return;
}
copied.value = true;
clearTimeout(timer);
timer = setTimeout(() => (copied.value = false), 1600);
}
</script>
<template>
<figure class="code">
<figcaption class="code-bar">
<span>{{ filename || language || "text" }}</span>
<button type="button" @click="copy">
{{ copied ? chrome[locale].copied : chrome[locale].copy }}
</button>
</figcaption>
<pre :class="props.class"><slot /></pre>
</figure>
</template>
<style scoped>
figure {
margin: 20px 0;
}
</style>
|