brumate/ui

ProgressBar

The progress of a task.

<script>
  import { $signal } from 'brumate/signals';
  import Button from '@brumate/ui/Button.brm';
  import Label from '@brumate/ui/Label.brm';
  import ProgressBar from '@brumate/ui/ProgressBar.brm';

  let uploaded = $signal(2);
</script>

<ProgressBar class="ui-bar" value=uploaded maxValue=(5)><Label>Uploaded {uploaded} of 5</Label></ProgressBar>
<Button class="ui-button" onPress=(() => (uploaded = (uploaded + 1) % 6))>Upload one more</Button>
<ProgressBar class="ui-bar" isIndeterminate><Label>Waiting for the server</Label></ProgressBar>