28 lines
840 B
Svelte
28 lines
840 B
Svelte
<script lang="ts">
|
|
import { timestampISO, type Timestamp } from '$lib/time-zone.js';
|
|
import { formatTimeOffset } from '$ui/duration.js';
|
|
import { timeFormat } from '$ui/stores/time-zone.js';
|
|
|
|
let {
|
|
value,
|
|
start,
|
|
missing = 'Not recorded'
|
|
}: { value: Timestamp; start: Timestamp; missing?: string } = $props();
|
|
const iso = $derived(timestampISO(value));
|
|
const offset = $derived(formatTimeOffset(start, value));
|
|
const absolute = $derived($timeFormat.dateTime(value));
|
|
</script>
|
|
|
|
{#if iso}<time
|
|
datetime={iso}
|
|
title={absolute}
|
|
aria-label={offset ? `${offset} from operation start · ${absolute}` : undefined}
|
|
>{offset ?? absolute}</time
|
|
>{:else}<span>{missing}</span>{/if}
|
|
|
|
<style>
|
|
time {
|
|
font-variant-numeric: tabular-nums;
|
|
}
|
|
</style>
|