Theme:
Ui3nProgress
Progress components for displaying loading and completion states.
Ui3nProgressLinear
Linear progress bar component.
Props
| Name | Type | Default | Description |
|---|---|---|---|
value | string | number | undefined | 0 | Progress value |
height | string | number | undefined | 2 | Progress height |
withText | boolean | undefined | false | Whether to show text |
bgColor | string | undefined | "var(--color-bg-control-primary-default)" | Background color |
color | string | undefined | "var(--color-bg-control-accent-default)" | Progress color |
indeterminate | boolean | undefined | false | Whether progress is indeterminate |
Ui3nProgressCircular
Circular progress indicator component.
Props
| Name | Type | Default | Description |
|---|---|---|---|
value | string | number | undefined | 0 | Progress value |
size | string | number | undefined | 64 | Progress size |
width | string | number | undefined | — | Progress width |
withText | boolean | undefined | false | Whether to show text |
bgColor | string | undefined | "var(--color-bg-control-primary-default)" | Background color |
color | string | undefined | "var(--color-bg-control-accent-default)" | Progress color |
indeterminate | boolean | undefined | false | Whether progress is indeterminate |
Usage Examples
Linear progress
Linear progress
Basic linear progress bar with value
Linear progress indeterminate
Linear progress indeterminate
Indeterminate linear progress for unknown duration
Circular progress
Circular progress
Circular progress indicator with value
Circular progress indeterminate
Circular progress indeterminate
Indeterminate circular progress for unknown duration