mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-18 19:46:36 +00:00
Code Issues Projects Releases Packages Wiki Activity

Added the status for the ProgressBarUx

Browse source
This commit is contained in:
jqlio18 2022-12-13 00:33:58 -05:00
commit e2a0ce9ac7
1 changed files with 10 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

12
docs/src/pages/framed/ProgressBar/ProgressBarUx.svelte
View file

@ -3,10 +3,14 @@
let max = 328;
let value = 0;
let status = "active";
$: helperText =
value > 0 ? value.toFixed(0) + "MB of " + max + "MB" : "Press start";
$: if (value === max) helperText = "Done";
$: if (value === max) {
helperText = "Done";
status = "finished";
}
</script>
<ProgressBar
@ -14,6 +18,7 @@
value="{value}"
max="{max}"
helperText="{helperText}"
status="{status}"
/>
<ButtonSet style="margin-top: var(--cds-spacing-08)">
@ -37,7 +42,10 @@
<Button
kind="tertiary"
disabled="{value !== max}"
on:click="{() => (value = 0)}"
on:click="{() => {
value = 0;
status = 'active';
}}"
>
Reset
</Button>