# MCircularProgressbar

A circular progress bar visually represents progress toward a goal or completion of a process using a circular shape. It is commonly used to indicate task completion or performance metrics. The progress is displayed as a partially filled ring, often accompanied by a percentage or status indicator. Circular Progress Bars are useful for providing users with real-time feedback on ongoing actions without taking up significant screen space.


## Props

| Name | Description | Type | Default |
| --- | --- | --- | --- | 
| `size` | Sets the size of the progress bar. | `"s"` `"m"` `"l"` | - |
| `value` | The current value of the progress bar. | `number` | `0` |
| `type` | Shows either a percentage or custom content. | `"content"` `"percentage"` | `"percentage"` |
| `contentValue` | Main content shown when `type` is `'content'`. | `string` | - |
| `additionalInfo` | Additional text shown to define the `contentValue`. | `string` | - |

## Dependencies

### Used By

- [MStepperCompact](../steppercompact)

### Graph

```mermaid
graph TD;
  MStepperCompact --> MCircularProgressbar
style MCircularProgressbar fill:#008240,stroke:#333,stroke-width:4px
```