IncidentTimeline
Reusable incident timeline component.
Usage
Components are auto-discovered. Use the component directly in any .wrn view:
<IncidentTimeline
title="title"
value="value"
description="description"
summary="summary"
loading="false"
/>Legacy mount name: data-component="IncidentTimeline".
Props and attributes
| Prop | Type | Requirement | Default |
|---|---|---|---|
title | string | Optional | "" |
value | string | Optional | "" |
description | string | Optional | "" |
summary | string | Optional | "" |
loading | boolean | Optional | false |
class | string | Optional | "" |
Slots
default
Events
This component does not declare a custom event.
Source contract
Installed source: components/IncidentTimeline.wrn
component IncidentTimeline {
props {
title = ""
value = ""
description = ""
summary = ""
loading = false
class = ""
}
view {
<figure aria-label="{summary || title}" class="wire-card wire-catalog-visualization {class}">
<figcaption>
<strong data-show="title">{title}</strong>
<span data-show="value" class="wire-metric__value">{value}</span>
<span data-show="description" class="wire-muted">{description}</span>
</figcaption>
<div data-show="loading" class="wire-skeleton wire-catalog-visualization__skeleton">
</div>
<div data-show="!loading" class="wire-catalog-visualization__content">
<slot />
</div>
<p data-show="summary" class="wire-visually-hidden">{summary}</p>
</figure>
}
}