21 lines
586 B
Svelte
21 lines
586 B
Svelte
|
<script lang="ts">
|
||
|
|
import { Skeleton } from "$lib/components/ui";
|
||
|
|
import { i18n } from "$lib/i18n";
|
||
|
|
import { cn } from "$lib/utils";
|
||
|
|
|
||
|
|
let {
|
||
|
|
rows = 5,
|
||
|
|
class: className = ""
|
||
|
|
}: {
|
||
|
|
rows?: number;
|
||
|
|
class?: string;
|
||
|
|
} = $props();
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<div class={cn("space-y-3 p-4", className)} role="status" aria-label={i18n.t("common.loading")} aria-busy="true">
|
||
|
|
{#each Array.from({ length: rows }, (_, i) => i) as index (index)}
|
||
|
|
<Skeleton class={cn("h-10 w-full", index === rows - 1 && rows > 1 && "w-4/5")} />
|
||
|
|
{/each}
|
||
|
|
<span class="sr-only">{i18n.t("common.loading")}</span>
|
||
|
|
</div>
|