Files
tabler/shared/ui/ProgressDescription.astro
T

26 lines
717 B
Plaintext

---
// Forward `size` only when explicitly provided.
import Progress from './Progress.astro'
import type { ProgressSize } from './Progress.astro'
interface Props {
label: string
description?: string
value?: number
color?: string
size?: ProgressSize | undefined
class?: string
}
const { label, description, value, color, size, class: className } = Astro.props
---
<div class:list={[className]}>
<div class="d-flex mb-1 align-items-center lh-1">
<div class="fs-5 fw-semibold m-0">{label}</div>
{description && <div class="fs-6 text-secondary ms-2">{description}</div>}
<span class="ms-auto fs-6 strong">{value}%</span>
</div>
<Progress size={size} value={value} color={color} />
</div>