Added fill color for progress (#3926)

* Added fill color for progress

* updated pyi file

reflex/components/radix/themes/components/progress.py

@@ -4,6 +4,7 @@ from typing import Literal
 
 from reflex.components.component import Component
 from reflex.components.core.breakpoints import Responsive
+from reflex.style import Style
 from reflex.vars.base import Var
 
 from ..base import LiteralAccentColor, RadixThemesComponent
@@ -38,6 +39,21 @@ class Progress(RadixThemesComponent):
     # The duration of the progress bar animation. Once the duration times out, the progress bar will start an indeterminate animation.
     duration: Var[str]
 
+    # The color of the progress bar fill animation.
+    fill_color: Var[str]
+
+    @staticmethod
+    def _color_selector(color: str) -> Style:
+        """Return a style object with the correct color and css selector.
+
+        Args:
+            color: Color of the fill part.
+
+        Returns:
+            Style: Style object with the correct css selector and color.
+        """
+        return Style({".rt-ProgressIndicator": {"background_color": color}})
+
     @classmethod
     def create(cls, *children, **props) -> Component:
         """Create a Progress component.
@@ -50,6 +66,12 @@ class Progress(RadixThemesComponent):
             The Progress Component.
         """
         props.setdefault("width", "100%")
+        if "fill_color" in props:
+            color = props.get("fill_color", "")
+            style = props.get("style", {})
+            style = style | cls._color_selector(color)
+            props["style"] = style
+
         return super().create(*children, **props)
 
 

reflex/components/radix/themes/components/progress.pyi

@@ -107,6 +107,7 @@ class Progress(RadixThemesComponent):
             ]
         ] = None,
         duration: Optional[Union[Var[str], str]] = None,
+        fill_color: Optional[Union[Var[str], str]] = None,
         style: Optional[Style] = None,
         key: Optional[Any] = None,
         id: Optional[Any] = None,
@@ -162,6 +163,7 @@ class Progress(RadixThemesComponent):
             high_contrast: Whether to render the progress bar with higher contrast color against background
             radius: Override theme radius for progress bar: "none" | "small" | "medium" | "large" | "full"
             duration: The duration of the progress bar animation. Once the duration times out, the progress bar will start an indeterminate animation.
+            fill_color: The color of the progress bar fill animation.
             style: The style of the component.
             key: A unique key for the component.
             id: The id for the component.