Progress
Variants
<DemoSpaceX>
<VelvetProgress @variant="emerald" @value={{25}} />
<VelvetProgress @variant="amber" @value={{50}} />
<VelvetProgress @variant="rose" @value={{75}} />
</DemoSpaceX>
Sizes
<DemoSpaceX>
<VelvetProgress @size="sm" @value={{25}} />
<VelvetProgress @size="md" @value={{50}} />
<VelvetProgress @size="lg" @value={{75}} />
</DemoSpaceX>
Signature
Element
HTMLDivElementBlocks
This component does not accept any blocks.
Arguments
| Name | Description | Type | Default Value |
|---|---|---|---|
@max | The maximum value of the progress. | number | 100 |
@min | The minimum value of the progress. | number | 0 |
@size | The size of the progress. | 'sm' | 'md' | 'lg' | "md" |
@text | The text describing the process in progress. | string | "" |
@value | The value of the progress. | number | 0 |
@variant | The appearance of the progress. | string | 'primary' | "primary" |