27 lines
1.2 KiB
Plaintext
27 lines
1.2 KiB
Plaintext
import { Alert, Badge, Card } from "@wrnexus/ui"
|
|
|
|
component UploadStatus {
|
|
props {
|
|
files: unknown[] = []
|
|
title: string = "Uploaded files"
|
|
emptyMessage: string = "No files uploaded yet."
|
|
color: string = "primary"
|
|
size: string = "sm"
|
|
class: string = ""
|
|
}
|
|
view {
|
|
<Card {...attrs} title='{title}' color='{color}' size='{size}' class='{class}'>
|
|
{#if files.length == 0}<Alert title="Waiting for files" description='{emptyMessage}' color="info" variant="soft" size='{size}' />{/if}
|
|
<div class="space-y-2">
|
|
{#each files as file}
|
|
<div class="flex items-center gap-3 rounded-[var(--wire-radius-sm)] border border-[var(--wire-color-border)] p-3">
|
|
<span class="icon-[lucide--file-check-2] size-5 text-[var(--wire-color-success)]"></span>
|
|
<div class="min-w-0 flex-1"><p class="m-0 truncate text-sm font-semibold">{file.name}</p><p class="m-0 text-xs text-[var(--wire-color-muted)]">{file.type || "File"} · {file.size || 0} bytes</p></div>
|
|
<Badge label='{file.status || "uploaded"}' color='{file.status == "error" ? "danger" : "success"}' variant="soft" size='{size}' />
|
|
</div>
|
|
{/each}
|
|
</div>
|
|
</Card>
|
|
}
|
|
}
|