Linear Progress
5.0.0
Linear Progress indicators display progress by animating an indicator along the length of a fixed, visible track. The behavior of the indicator is dependent on whether the progress of a process is known.
Namn | Typ | Beskrivning |
---|---|---|
customAttribute | { attribute: string; value: string |
number } | Custom attributes for testing purposes. Clickable and requested subcomponents will be suffixed with "-[ComponentName]". |
size | "small" |
"medium" | Size of the progress bar. Affects height and spacing. |
npm install @sj-ab/component-library.ui.linear-progress
Komponenten har stöd för två varianter:
variant="determinate"
– Visar ett specifikt förloppsvärde mellan 0 och 100.variant="indeterminate"
– Visar en animerad laddningsindikator utan angivet värde (används när förloppet inte kan mätas).För att komponenten ska vara tillgänglig för alla användare, inklusive de som använder skärmläsare, används följande WAI-ARIA-attribut:
role="progressbar"
– Indikerar att elementet är en förloppsindikator.aria-valuemin
– Anger minsta värde (implicit satt till 0
).aria-valuemax
– Anger högsta värde (implicit satt till 100
).aria-valuenow
– Anger aktuellt värde vid determinate-variant. Utesluts helt vid indeterminate-variantför att visa att värdet är okänt.Komponenten måste ha en tillgänglig etikett för att beskriva syftet eller statusen på indikatorn:
helperText
– Synlig text under progressbaren. Används automatiskt som etikett via aria-labelledby
.aria-label
– En dold etikett för skärmläsare. Används om du inte visar någon synlig helperText
.Importer av Linear Progress
Repos med Linear Progress
Senaste installerade version av Linear Progress
Äldsta installerade version av Linear Progress