docs(progressbar): added docs

docs/user/widgets/bec_progressbar/bec_progressbar.md

@@ -0,0 +1,39 @@
+(user.widgets.bec_progressbar)=
+# BEC Progressbar
+
+```{tab} Overview
+
+The BEC Progressbar widget is a general purpose progress bar that follows the BEC theme and style. It can be embedded in any application to display the progress of a task or operation. 
+
+## Key Features:
+- **Modern Design**: The BEC Progressbar widget is designed with a modern and sleek appearance, following the BEC theme.
+- **Customizable**: Users can customize the appearance and behavior of the progress bar to suit their application.
+- **Responsive**: The progress bar updates in real-time to reflect the progress of the task or operation.
+
+## Screenshot
+![BEC Progressbar](./bec_progressbar_running.png)
+![BEC Progressbar](./bec_progressbar_completed.png)
+
+```
+
+````{tab} Examples
+
+The `BECProgressBar` widget can be integrated within a [`BECDockArea`](user.widgets.bec_dock_area) or used as an individual component in your application through `BECDesigner`. Below are examples demonstrating how to create and use the `BECProgressBar` widget.
+
+## Example 1 - Adding BEC Status Box to BECDockArea
+
+In this example, we demonstrate how to add a `BECProgressBar` widget to a `BECDockArea`, allowing users to manually set and update the progress states.
+
+```python
+# Add a new dock with a BECStatusBox widget
+pb = gui.add_dock().add_widget("BECProgressBar")
+pb.set_value(50)
+```
+
+````
+
+````{tab} API
+```{eval-rst} 
+.. include:: /api_reference/_autosummary/bec_widgets.cli.client.BECProgressbar.rst
+```
+````

docs/user/widgets/bec_status_box/bec_status_box.md

@@ -15,7 +15,7 @@ The [`BEC Status Box`](/api_reference/_autosummary/bec_widgets.cli.client.BECSta
 
 ````{tab} Examples
 
-The `BECStatusBox` widget can be integrated within a [`BECDockArea`](user.widgets.bec_dock_area) or used as an individual component in your application through `QtDesigner`. Below are examples demonstrating how to create and use the `BECStatusBox` widget.
+The `BECStatusBox` widget can be integrated within a [`BECDockArea`](user.widgets.bec_dock_area) or used as an individual component in your application through `BECDesigner`. Below are examples demonstrating how to create and use the `BECStatusBox` widget.
 
 ## Example 1 - Adding BEC Status Box to BECDockArea
 

docs/user/widgets/widgets.md

@@ -191,6 +191,14 @@ Angular like toggle switch.
 Display spinner widget for loading or device movement.
 ```
 
+```{grid-item-card} BEC Progressbar 
+:link: user.widgets.bec_progressbar
+:link-type: ref
+:img-top: /assets/widget_screenshots/bec_progressbar.png
+
+Modern progress bar for BEC.
+```
+
 ```{grid-item-card} Position Indicator
 :link: user.widgets.position_indicator
 :link-type: ref
@@ -239,6 +247,7 @@ text_box/text_box.md
 website/website.md
 toggle/toggle.md
 spinner/spinner.md
+bec_progressbar/bec_progressbar.md
 device_input/device_input.md
 position_indicator/position_indicator.md
 lmfit_dialog/lmfit_dialog.md